Implement Rocket.Chat Auth Component

[Sing-Li]

Create a component that supports Rocket.Chat auth (and then populate / link superprofile, plus addiitonal data - making them available to components using RC4Community framework )

At a minimum supporting:

• google OAuth
• GitHub OAuth
• email + password

Leverage the work already done by @sidmohanty11 in his embedded chat component

[renovX]

I would like to work on this issue, thank you

[Sing-Li]

@renovX Looking forward to your PR. Please contact @Dnouv if you need some help to get things going.

[Dnouv]

Hello @renovX
Thank you for taking up the issue. Here is the latest update.
The 1. RocketChat Auth component based on Google OAuth with TOTP support is completed. Please find all the related codes here.
So we would need you to try to complete the 2. RocketChat Auth component based on GitHub OAuth, and 3. RocketChat Auth component based on email+password.

First of all, please set up the local development environment, if you have any questions or difficulty setting up the environment, please feel free to ping me here or on Rocket Chat.

Q. What's the use of this Authentication, and for which?
A. The different Authentication mentioned in the issue would help the user to log in/sign up with Rocket Chat. Similar to the different auth methods present on the Rocket Chat Authentication page. Here is the link to Rocket Chat REST API endpoint docs, please have a look at what payloads are required.

Please feel free to contact me on Rocket Chat (if you are already in the Open Server) for any related questions. I would be happy to answer them. Or, if you feel comfortable with GitHub, you can comment here.

Thank you!

[adarsh500]

Hey, this seems like an interesting issue to work on. I've run experiments on authentication strategies on NextJS for some of my projects. I was hoping I could work on this, plus this would help me learn more about Rocket(dot)chat. Looking forward to this ✌🏼

[Nabhag8848]

Hey, @adarsh500 . I was looking around this issue on Tuesday and was setting it up before having this issue. Would you mind to work together? Asking cause it would solve two issues including RocketChat/RC4Community#185

[Dnouv]

Hello @adarsh500, hello @Nabhag8848

I appreciate your interest. Could you please explain your approach before taking up the issue? And also, currently, if you look into the RC authentication using Google OAuth implemented here, we are using custom functions to handle the Authentication that needs to be refactored to use NextAuth, so please do consider this requirement while researching more about the solution.

Looking forward to your amazing approaches. Thank you!

PS. A nice idea you both can work together on this if both parties agree; this will be good for community bonding.

[adarsh500]

This is a brief idea of how the [...nextAuth].ts file would look like if we add the new sign on methods. This approach handles the requirements of adding google, github and credentials

const authOptions = {
  providers: [
    //other existing providers,
    CredentialsProvider({
      // options
       async authorize(credentials, req) {
      // Add logic here to look up the user from the credentials supplied

      if (user) {
        // verify user
        return user
      } else {
        // throw appropriate error message
        return null
      }
    }),
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET
    }),
    GitHubProvider({
      clientId: process.env.GITHUB_ID,
      clientSecret: process.env.GITHUB_SECRET
    })
  ],
  callbacks: {
    async signIn({ user, account, profile, email, credentials }) {
      // here goes custom logic for SSO / 2FA auth 
    },

    async jwt({ token, user, account, profile, isNewUser }) {
      return token
    }

     async session({ session, token, user }) {
      return session
    },
  },

}

We can also add custom logic to handle cookies manually (IF REQUIRED), I would love to get more feedback on this approach. What do you think @Dnouv @Sing-Li @Nabhag8848?

[Dnouv]

Hey @adarsh500

Thanks for explaining the initial approach. That's great you took care of explaining the different functions where we handle the 2FA and cookies. Minor addition, we will need a custom OAuth provider for the RC Authentication based on the Google OAuth; here is how the authentication works in RC -> https://developer.rocket.chat/reference/api/rest-api/endpoints/other-important-endpoints/authentication-endpoints/google

We make use of the tokens returned from Google OAuth to make a call to the REST API, passing it as one of the parameters. It would be great if you could look into the current codebase of RC4Conference's using the Google OAuth for RC Authentication, this will help you understand things more better.

Once you figure it out, you will be good to start writing the code. Thank you!

[adarsh500]

Hey @Dnouv, I apologize for the delay in response. I think that would be pretty easy to handle. We can make the request to the REST API inside the signIn callback. We know that we can obtain our accessToken, idToken, and the serviceName in the user param of signIn method. This should be enough to make a call to the REST api. Then we could set the rc_token and the rc_uid in the cookies if the request passes.

[Dnouv]

No problem, thanks! Please go ahead to implement this feature.

I'm really looking forward to your contributions. Thank you!

[adarsh500]

Hey @Dnouv, I apologize for the delay in updates, I had my exams. I have setup the basic functionality for these authentication strategies

1. github oauth
2. google oauth
3. credentials (email + password)

I'm currently in the process of implementing 2FA

I have a draft PR that shows my current work: #96
I'll add a readme file soon with instructions on how to set up the new auth strategies and the configuration required in the RC server

[Dnouv]

No, problem; please let me know once it is ready for review. Thank you!

[adarsh500]

Here's the update on this issue

• google OAuth
• GitHub OAuth
• email + password