feat: make page title consistent

frontend/src/pages/(navbar)/exercise-panel.tsx

@@ -14,7 +14,7 @@ const wrapper = css`
 `
 
 const ExercisePanel = () => {
-  useSetPageTitle('Admin Panel')
+  useSetPageTitle('Exercise Panel')
 
   return (
     <>

frontend/src/pages/(navbar)/graphiql.tsx

+import { useSetPageTitle } from '@/utils'
 import { lazy } from 'react'
 
 const GraphiQLPage = lazy(() => import('@/logic/GraphiQL'))
 
-export const GraphiQL = () => <GraphiQLPage />
+export const GraphiQL = () => {
+  useSetPageTitle('GraphiQL')
+
+  return <GraphiQLPage />
+}
 
 export default GraphiQL

frontend/src/pages/(navbar)/index.tsx

@@ -2,14 +2,12 @@ import InjectLogo from '@/assets/inject-logo--vertical-black.svg?react'
 import StaffSelector from '@/logic/StaffSelector'
 import TeamSelector from '@/logic/TeamSelector'
 import { useNavigate } from '@/router'
-import { useSetPageTitle } from '@/utils'
 import { Checkbox, Collapse } from '@blueprintjs/core'
 import { useAuthIdentity } from '@inject/graphql/auth'
 import Container from '@inject/shared/components/Container'
 import { useEffect, useState } from 'react'
 
 const Index = () => {
-  useSetPageTitle('Team Selection')
   const { isActive, isStaff, isSuperuser, isLogged, loading } = useAuthIdentity(
     !!window.INJECT_NOAUTH
   )

frontend/src/pages/(navbar)/settings.tsx

@@ -5,6 +5,7 @@ import InstructorTeams from '@/clientsettings/components/InstructorTeams'
 import Logout from '@/clientsettings/components/Logout'
 import Notification from '@/clientsettings/components/Notification'
 import RelativeTime from '@/clientsettings/components/RelativeTime'
+import { useSetPageTitle } from '@/utils'
 import { css } from '@emotion/css'
 import { useAuthIdentity } from '@inject/graphql/auth'
 import Container from '@inject/shared/components/Container'
@@ -14,6 +15,7 @@ const heading = css`
 `
 
 const Settings = () => {
+  useSetPageTitle('Settings')
   const { isStaff, isSuperuser } = useAuthIdentity(!!window.INJECT_NOAUTH)
 
   return (

frontend/src/pages/404.tsx

@@ -2,7 +2,7 @@ import { useSetPageTitle } from '@/utils'
 import { NonIdealState } from '@blueprintjs/core'
 
 const FourOhFour = () => {
-  useSetPageTitle('Page not Found')
+  useSetPageTitle('Page not found')
 
   return (
     <NonIdealState title='Page not found' icon='warning-sign'>

frontend/src/pages/analyst/_layout.tsx

-import { useStaffBoundary } from '@/utils'
+import { useSetPageTitle, useStaffBoundary } from '@/utils'
 import { Outlet } from 'react-router-dom'
 
 const Layout = () => {
   useStaffBoundary()
+  useSetPageTitle('Analyst')
 
   return <Outlet />
 }

frontend/src/pages/instructor/[exerciseId]/[teamId]/[channelId]/email/_layout.tsx

 import { EmailSelection } from '@/analyst/utilities'
 import InstructorTeamEmails from '@/email/TeamEmails/InstructorTeamEmails'
 import { useNavigate, useParams } from '@/router'
-import { useSetPageTitle } from '@/utils'
 import { useGetEmailThreads } from '@inject/graphql/queries/GetEmailThreads.generated'
 import notEmpty from '@inject/shared/utils/notEmpty'
 
@@ -9,7 +8,6 @@ const Layout = () => {
   const { exerciseId, teamId, tab, channelId, threadId } = useParams(
     '/instructor/:exerciseId/:teamId/:channelId/email/:tab/:threadId'
   )
-  useSetPageTitle(`Team ${teamId} - Emails`)
   const nav = useNavigate()
 
   const { data: emailThreadsData } = useGetEmailThreads({

frontend/src/pages/instructor/_layout.tsx

 import { useParams } from '@/router'
-import { useStaffBoundary } from '@/utils'
+import { useSetPageTitle, useStaffBoundary } from '@/utils'
 import InstructorView from '@/views/InstructorView'
 import { Outlet } from 'react-router-dom'
 
 const Layout = () => {
   const { exerciseId, teamId } = useParams('/instructor/:exerciseId/:teamId')
   useStaffBoundary()
+  useSetPageTitle('Instructor')
 
   return (
     <InstructorView exerciseId={exerciseId} teamId={teamId}>

frontend/src/pages/instructor/index.tsx

-import { useSetPageTitle } from '@/utils'
 import { NonIdealState } from '@blueprintjs/core'
 
-const InstructorIndexPage = () => {
-  useSetPageTitle('Instructor')
-
-  return (
-    <NonIdealState
-      icon='search'
-      title='No teams selected'
-      description='Select teams to interact with'
-    />
-  )
-}
+const InstructorIndexPage = () => (
+  <NonIdealState
+    icon='search'
+    title='No teams selected'
+    description='Select teams to interact with'
+  />
+)
 
 export default InstructorIndexPage

frontend/src/pages/login.tsx

 import InjectLogo from '@/assets/inject-logo--vertical-black.svg?react'
 import Login from '@/logic/Login'
+import { useSetPageTitle } from '@/utils'
 import Container from '@inject/shared/components/Container'
 
-const LoginPage = () => (
-  <Container>
-    <InjectLogo
-      style={{
-        width: '100%',
-        height: '300px',
-        margin: 'auto',
-      }}
-    />
-    <Login />
-  </Container>
-)
+const LoginPage = () => {
+  useSetPageTitle('Login')
+
+  return (
+    <Container>
+      <InjectLogo
+        style={{
+          width: '100%',
+          height: '300px',
+          margin: 'auto',
+        }}
+      />
+      <Login />
+    </Container>
+  )
+}
 
 export default LoginPage

frontend/src/pages/trainee/[exerciseId]/[teamId]/[channelId]/email/_layout.tsx

 import { EmailSelection } from '@/analyst/utilities'
 import TraineeTeamEmails from '@/email/TeamEmails/TraineeTeamEmails'
 import { useNavigate, useParams } from '@/router'
-import { useSetPageTitle } from '@/utils'
 import { useGetEmailThreads } from '@inject/graphql/queries/GetEmailThreads.generated'
 import notEmpty from '@inject/shared/utils/notEmpty'
 
@@ -9,7 +8,6 @@ const Layout = () => {
   const { exerciseId, teamId, tab, channelId, threadId } = useParams(
     '/trainee/:exerciseId/:teamId/:channelId/email/:tab/:threadId'
   )
-  useSetPageTitle(`Team ${teamId} - Emails`)
   const nav = useNavigate()
 
   const { data: emailThreadsData } = useGetEmailThreads({

frontend/src/pages/trainee/_layout.tsx

 import { useParams } from '@/router'
+import { useSetPageTitle } from '@/utils'
 import TraineeView from '@/views/TraineeView'
 import { Outlet } from 'react-router-dom'
 
 const Layout = () => {
   const { exerciseId, teamId } = useParams('/trainee/:exerciseId/:teamId')
+  useSetPageTitle('Trainee')
 
   return (
     <TraineeView exerciseId={exerciseId} teamId={teamId}>

frontend/src/pages/users/_layout.tsx

+import { useSetPageTitle } from '@/utils'
+import { Outlet } from 'react-router-dom'
+
+const Layout = () => {
+  useSetPageTitle('User management')
+
+  return <Outlet />
+}
+
+export default Layout

frontend/src/pages/users/index.tsx

 import UserTable from '@/users/UserTable'
-import { useSetPageTitle } from '@/utils'
 
-const UserManagementIndexPage = () => {
-  useSetPageTitle('User management')
-
-  return <UserTable />
-}
+const UserManagementIndexPage = () => <UserTable />
 
 export default UserManagementIndexPage