build(signin): ♿️ Add SSO signin for Sleekplan

apps/builder/pages/api/auth/sleekplan.ts

@@ -0,0 +1,31 @@
+import { withSentry } from '@sentry/nextjs'
+import { User } from 'db'
+import { sign } from 'jsonwebtoken'
+import { NextApiRequest, NextApiResponse } from 'next'
+import { getAuthenticatedUser } from 'services/api/utils'
+import { methodNotAllowed, notAuthenticated } from 'utils'
+
+const handler = async (req: NextApiRequest, res: NextApiResponse) => {
+  if (req.method === 'GET') {
+    const user = await getAuthenticatedUser(req)
+    if (!user) return notAuthenticated(res)
+    const ssoToken = createSSOToken(user)
+    res.redirect(`https://feedback.typebot.io?sso=${ssoToken}`)
+    return
+  }
+  methodNotAllowed(res)
+}
+
+const createSSOToken = (user: User) => {
+  if (!process.env.SLEEKPLAN_SSO_KEY) return
+  const userData = {
+    mail: user.email,
+    id: user.id,
+    name: user.name,
+    img: user.image,
+  }
+
+  return sign(userData, process.env.SLEEKPLAN_SSO_KEY, { algorithm: 'HS256' })
+}
+
+export default withSentry(handler)

apps/builder/pages/typebots.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react'
-import { Flex, Link, Stack, Text } from '@chakra-ui/layout'
+import { Link, Stack, Text, VStack } from '@chakra-ui/layout'
 import { DashboardHeader } from 'components/dashboard/DashboardHeader'
 import { Seo } from 'components/Seo'
 import { FolderContent } from 'components/dashboard/FolderContent'
@@ -35,8 +35,14 @@ const DashboardPage = () => {
     if (!isReady) return
     const couponCode = query.coupon?.toString()
     const stripeStatus = query.stripe?.toString()
+    const sleekplan = query.sleekplan?.toString()
     const redirectPath = query.redirectPath as string | undefined
 
+    if (sleekplan) {
+      setIsLoading(true)
+      push('/api/auth/sleekplan')
+      return
+    }
     if (stripeStatus === 'success')
       toast({
         title: 'Typebot Pro',
@@ -66,9 +72,10 @@ const DashboardPage = () => {
       <DashboardHeader />
       <TypebotDndContext>
         {isLoading ? (
-          <Flex w="full" justifyContent="center" pt="10">
+          <VStack w="full" justifyContent="center" pt="10" spacing={6}>
+            <Text>You are being redirected...</Text>
             <Spinner />
-          </Flex>
+          </VStack>
         ) : (
           <FolderContent folder={null} />
         )}