Merge branch 'master' into 2630-remove-flagged-exercises-in-accordance-with-design-doc-1

Author: flacial

__tests__/pages/discord/success.test.js

@@ -133,32 +133,26 @@ describe('connect to Discord success page', () => {
     )
   })
 
-  it('should render discord error page when no userInfo is returned', async () => {
+  it('should render discord account already used page', async () => {
     render(
       <ConnectToDiscordSuccess
-        username="fakeUser"
-        errorCode={ErrorCode.DISCORD_ERROR}
-        error={{ message: 'errorMessage' }}
+        errorCode={ErrorCode.DIFFERENT_ACCOUNT_IS_CONNECTED}
       />
     )
-    await waitFor(() => {
+    await waitFor(() =>
       expect(
-        screen.getByText(
-          'Dear fakeUser, we had trouble connecting to Discord, please try again.',
-          {
-            exact: true
-          }
-        )
+        screen.getByText('Discord account is already used', {
+          exact: true
+        })
       ).toBeTruthy()
-      expect(screen.getByText('{ "message": "errorMessage" }')).toBeTruthy()
-    })
+    )
   })
 
-  it('should render discord error page if another user is already connected to the Discord account', async () => {
+  it('should render discord error page when no userInfo is returned', async () => {
     render(
       <ConnectToDiscordSuccess
         username="fakeUser"
-        errorCode={ErrorCode.DIFFERENT_ACCOUNT_IS_CONNECTED}
+        errorCode={ErrorCode.DISCORD_ERROR}
         error={{ message: 'errorMessage' }}
       />
     )

pages/discord/success.tsx

@@ -10,6 +10,7 @@ import Image from 'next/image'
 import { DiscordUserInfo, getDiscordUserInfo } from '../../helpers/discordAuth'
 import { getSession } from 'next-auth/react'
 import { Session } from '../../@types/auth'
+import { CURRICULUM_PATH, LOGIN_PATH } from '../../constants'
 
 type ConnectToDiscordSuccessProps = {
   errorCode: number
@@ -21,8 +22,7 @@ type ConnectToDiscordSuccessProps = {
 type DiscordErrorPageProps = {
   error: Error
   username: string
-  navPath: string
-  navText: string
+  errorCode?: ErrorCode
 }
 
 type Error = {
@@ -41,12 +41,22 @@ const DISCORD_BUGS_FEEDBACK_URL =
 const DiscordErrorPage: React.FC<DiscordErrorPageProps> = ({
   username,
   error,
-  navPath,
-  navText
+  errorCode
 }) => {
-  let errorMessage = <></>,
-    errorLog = <></>
-  if (!username) {
+  const isDiscordError = errorCode === ErrorCode.DISCORD_ERROR
+  const isUserNotLoggedIn = errorCode === ErrorCode.USER_NOT_LOGGED_IN
+  const isDiscordAccountUsed =
+    errorCode === ErrorCode.DIFFERENT_ACCOUNT_IS_CONNECTED
+
+  let errorMessage = <></>
+  let errorLog = <></>
+  let navText = isDiscordError ? 'Try Again' : 'Curriculum'
+  let navPath = CURRICULUM_PATH
+
+  if (isUserNotLoggedIn) {
+    navText = 'Log In Here'
+    navPath = LOGIN_PATH
+
     errorMessage = (
       <>
         <p>You need to be logged in to connect to Discord.</p>
@@ -66,6 +76,7 @@ const DiscordErrorPage: React.FC<DiscordErrorPageProps> = ({
       </>
     )
   }
+
   if (error?.message) {
     errorLog = (
       <>
@@ -75,10 +86,33 @@ const DiscordErrorPage: React.FC<DiscordErrorPageProps> = ({
       </>
     )
   }
+
+  if (isDiscordAccountUsed) {
+    errorMessage = (
+      <>
+        <p>
+          Sorry, but it looks like the Discord account you are trying to link to
+          your C0D3 account is already in use by another account.
+        </p>
+        <p>
+          To fix this, you can either use a different Discord account or, if the
+          account you are trying to link is already connected to a different
+          C0D3 account, you can go to that account and unlink the Discord
+          account. Then, come back to this account and try linking the Discord
+          account again.
+        </p>
+      </>
+    )
+  }
+
   return (
     <>
       <Title title="Error" />
-      <Card title="Error">
+      <Card
+        title={
+          isDiscordAccountUsed ? 'Discord account is already used' : 'Error'
+        }
+      >
         <div className="mt-3">{errorMessage}</div>
         <p>
           If this problem persists, please ask for help in our{' '}
@@ -102,36 +136,16 @@ const DiscordErrorPage: React.FC<DiscordErrorPageProps> = ({
 
 export const ConnectToDiscordSuccess: React.FC<ConnectToDiscordSuccessProps> &
   WithLayout = ({ errorCode, username, userInfo, error }) => {
-  if (errorCode === ErrorCode.DIFFERENT_ACCOUNT_IS_CONNECTED) {
+  if (errorCode) {
     return (
       <DiscordErrorPage
         username={username}
         error={error}
-        navPath="/curriculum"
-        navText="Curriculum"
+        errorCode={errorCode}
       />
     )
   }
 
-  if (errorCode === ErrorCode.DISCORD_ERROR)
-    return (
-      <DiscordErrorPage
-        username={username}
-        error={error}
-        navPath="/curriculum"
-        navText="Try Again"
-      />
-    )
-  if (errorCode === ErrorCode.USER_NOT_LOGGED_IN)
-    return (
-      <DiscordErrorPage
-        username=""
-        error={error}
-        navPath="/login"
-        navText="Log In Here"
-      />
-    )
-
   return (
     <>
       <Title title="Success!" />
@@ -189,6 +203,7 @@ export const getServerSideProps = async ({
       id: sessionUser.id
     }
   })
+
   if (!user) return { props: { errorCode: ErrorCode.USER_NOT_LOGGED_IN } }
 
   const userInfo = await getDiscordUserInfo(user)