feat(DOJO/mentor): Only display mentor created exercises

__dummy__/getExercisesData.ts

@@ -64,6 +64,9 @@ const getExercisesData: GetExercisesQuery = {
           slug: 'js0'
         }
       },
+      author: {
+        id: 1
+      },
       description: '```\nlet a = 5\na = a + 10\n// what is a?\n```',
       answer: '15',
       explanation: 'You can reassign variables that were created with "let".'
@@ -76,6 +79,9 @@ const getExercisesData: GetExercisesQuery = {
           slug: 'js0'
         }
       },
+      author: {
+        id: 1
+      },
       description: '```\nlet a = 1\na += 2\n// what is a?\n```',
       answer: '3',
       explanation: '`a += 2` is a shorter way to write `a = a + 2`'
@@ -88,6 +94,9 @@ const getExercisesData: GetExercisesQuery = {
           slug: 'js0'
         }
       },
+      author: {
+        id: 1
+      },
       description: '```\nlet a = 1\na -= 2\n// what is a?\n```',
       answer: '-1',
       explanation: null

__tests__/pages/curriculum/[lessonSlug]/mentor/index.test.js

@@ -6,8 +6,12 @@ import { useRouter } from 'next/router'
 import { MockedProvider } from '@apollo/client/testing'
 import getExercisesData from '../../../../../__dummy__/getExercisesData'
 import GET_EXERCISES from '../../../../../graphql/queries/getExercises'
+import GET_SESSION from '../../../../../graphql/queries/getSession'
+import dummySessionData from '../../../../../__dummy__/sessionData'
 
-describe('AddExercises page', () => {
+import '@testing-library/jest-dom'
+
+describe('Mentor page', () => {
   const { query, push } = useRouter()
   query['lessonSlug'] = 'js0'
 
@@ -18,6 +22,16 @@ describe('AddExercises page', () => {
         result: {
           data: getExercisesData
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 
@@ -36,13 +50,62 @@ describe('AddExercises page', () => {
     screen.getByRole('link', { name: 'LESSON' })
   })
 
+  test('Should not render exercises if the user id mismatch exercise author.id', async () => {
+    const mocks = [
+      {
+        request: { query: GET_EXERCISES },
+        result: {
+          data: getExercisesData
+        }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData,
+              user: {
+                id: 4
+              }
+            }
+          }
+        }
+      }
+    ]
+
+    render(
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <AddExercises />
+      </MockedProvider>
+    )
+
+    await waitFor(() =>
+      screen.getByRole('heading', { name: /Foundations of JavaScript/i })
+    )
+
+    expect(screen.queryByText('Numbers')).not.toBeInTheDocument()
+    expect(
+      screen.getByRole('heading', { name: /Foundations of JavaScript/i })
+    ).toBeInTheDocument()
+  })
+
   test('Should push to addExercise page', async () => {
     const mocks = [
       {
         request: { query: GET_EXERCISES },
         result: {
           data: getExercisesData
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 
@@ -78,6 +141,16 @@ describe('AddExercises page', () => {
             }))
           }
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 
@@ -106,6 +179,16 @@ describe('AddExercises page', () => {
             lessons: null
           }
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 
@@ -128,6 +211,16 @@ describe('AddExercises page', () => {
             lessons: []
           }
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 
@@ -150,6 +243,16 @@ describe('AddExercises page', () => {
         result: {
           data: getExercisesData
         }
+      },
+      {
+        request: { query: GET_SESSION },
+        result: {
+          data: {
+            session: {
+              ...dummySessionData
+            }
+          }
+        }
       }
     ]
 

graphql/index.tsx

@@ -865,6 +865,7 @@ export type GetExercisesQuery = {
     description: string
     answer: string
     explanation?: string | null
+    author: { __typename?: 'User'; id: number }
     module: {
       __typename?: 'Module'
       name: string
@@ -3682,6 +3683,9 @@ export const GetExercisesDocument = gql`
     }
     exercises {
       id
+      author {
+        id
+      }
       module {
         name
         lesson {

graphql/queries/getExercises.ts

@@ -16,6 +16,9 @@ const GET_EXERCISES = gql`
     }
     exercises {
       id
+      author {
+        id
+      }
       module {
         name
         lesson {

pages/curriculum/[lessonSlug]/mentor/addExercise/index.tsx

@@ -132,7 +132,7 @@ const initValues = [
   }
 ]
 
-const MentorPage = ({ data }: GetAppProps) => {
+const AddExercisePage = ({ data }: GetAppProps) => {
   const router = useRouter()
   const { lessonSlug } = router.query
 
@@ -218,4 +218,4 @@ const MentorPage = ({ data }: GetAppProps) => {
   )
 }
 
-export default withGetApp()(MentorPage)
+export default withGetApp()(AddExercisePage)

pages/curriculum/[lessonSlug]/mentor/index.tsx

@@ -4,7 +4,7 @@ import Layout from '../../../../components/Layout'
 import withQueryLoader, {
   QueryDataProps
 } from '../../../../containers/withQueryLoader'
-import { GetExercisesQuery } from '../../../../graphql'
+import { GetExercisesQuery, useGetSessionQuery } from '../../../../graphql'
 import Error, { StatusCode } from '../../../../components/Error'
 import LoadingSpinner from '../../../../components/LoadingSpinner'
 import AlertsDisplay from '../../../../components/AlertsDisplay'
@@ -14,9 +14,12 @@ import { NewButton } from '../../../../..../../components/theme/Button'
 import GET_EXERCISES from '../../../../..../../graphql/queries/getExercises'
 import styles from '../../../../scss/exercises.module.scss'
 
-const AddExercises: React.FC<QueryDataProps<GetExercisesQuery>> = ({
+const MentorPage: React.FC<QueryDataProps<GetExercisesQuery>> = ({
   queryData
 }) => {
+  const { data } = useGetSessionQuery()
+  const sessionUser = data?.session.user
+
   const { lessons, alerts, exercises } = queryData
   const router = useRouter()
 
@@ -43,7 +46,11 @@ const AddExercises: React.FC<QueryDataProps<GetExercisesQuery>> = ({
   ]
 
   const currentExercises = exercises
-    .filter(exercise => exercise?.module.lesson.slug === slug)
+    .filter(
+      exercise =>
+        exercise.module.lesson.slug === slug &&
+        exercise.author.id === sessionUser?.id
+    )
     .map(exercise => ({
       id: exercise.id,
       moduleName: exercise.module.name,
@@ -128,5 +135,5 @@ export default withQueryLoader<GetExercisesQuery>(
   {
     query: GET_EXERCISES
   },
-  AddExercises
+  MentorPage
 )