restoring page titles

src/app/course/[courseName]/CourseTitle.tsx

@@ -1,10 +0,0 @@
-"use client"
-
-import { useCourseContext } from "./context/courseContext"
-
-export default function CourseTitle() {
-  const {courseName}= useCourseContext()
-  return (
-    <title>{(process.env.NEXT_PUBLIC_TITLE_PREFIX ?? "")}{courseName}</title>
-  )
-}

src/app/course/[courseName]/layout.tsx

@@ -1,5 +1,18 @@
 import { Suspense } from "react";
 import CourseContextProvider from "./context/CourseContextProvider";
+import { Metadata } from "next";
+import { getTitle } from "@/services/titleUtils";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ courseName: string }>;
+}): Promise<Metadata> {
+  const { courseName } = await params;
+  return {
+    title: getTitle(courseName),
+  };
+}
 
 export default async function CourseLayout({
   children,

src/app/course/[courseName]/lecture/[lectureDay]/layout.tsx

@@ -1,5 +1,20 @@
 import { Suspense } from "react";
 import CourseContextProvider from "../../context/CourseContextProvider";
+import { Metadata } from "next";
+import { getTitle } from "@/services/titleUtils";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ courseName: string; lectureDay: string }>;
+}): Promise<Metadata> {
+  const { courseName, lectureDay } = await params;
+  const decodedDay = decodeURIComponent(lectureDay);
+  const dayOnly = decodedDay.split(" ")[0];
+  return {
+    title: getTitle(`${courseName} lecture ${dayOnly}`),
+  };
+}
 
 export default async function LectureLayout({
   children,

src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/layout.tsx

@@ -1,5 +1,6 @@
 import React, { ReactNode, Suspense } from "react";
 
+
 export default function layout({ children }: { children: ReactNode }) {
   return <Suspense>{children}</Suspense>;
 }

src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/page.tsx

@@ -1,5 +1,23 @@
 import React from "react";
 import EditAssignment from "./EditAssignment";
+import { Metadata } from "next";
+import { getTitle } from "@/services/titleUtils";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{
+    courseName: string;
+    assignmentName: string;
+    moduleName: string;
+  }>;
+}): Promise<Metadata> {
+  const { courseName, assignmentName } = await params;
+  const decodedAssignmentName = decodeURIComponent(assignmentName);
+  return {
+    title: getTitle(`${decodedAssignmentName}, ${courseName}`),
+  };
+}
 
 export default async function Page({
   params,

src/app/course/[courseName]/modules/[moduleName]/page/[pageName]/page.tsx

@@ -1,5 +1,23 @@
 import React from "react";
 import EditPage from "./EditPage";
+import { getTitle } from "@/services/titleUtils";
+import { Metadata } from "next";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{
+    courseName: string;
+    pageName: string;
+    moduleName: string;
+  }>;
+}): Promise<Metadata> {
+  const { courseName, pageName } = await params;
+  const decodedPageName = decodeURIComponent(pageName);
+  return {
+    title: getTitle(`${decodedPageName}, ${courseName}`),
+  };
+}
 
 export default async function Page({
   params,

src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/page.tsx

@@ -1,5 +1,23 @@
 import React from "react";
 import EditQuiz from "./EditQuiz";
+import { getTitle } from "@/services/titleUtils";
+import { Metadata } from "next";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{
+    courseName: string;
+    quizName: string;
+    moduleName: string;
+  }>;
+}): Promise<Metadata> {
+  const { courseName, quizName } = await params;
+  const decodedQuizName = decodeURIComponent(quizName);
+  return {
+    title: getTitle(`${decodedQuizName}, ${courseName}`),
+  };
+}
 
 export default async function Page({
   params,

src/app/course/[courseName]/page.tsx

@@ -2,14 +2,13 @@ import CourseCalendar from "./calendar/CourseCalendar";
 import CourseSettingsLink from "./CourseSettingsLink";
 import ModuleList from "./modules/ModuleList";
 import DraggingContextProvider from "./context/drag/DraggingContextProvider";
-import CourseTitle from "./CourseTitle";
 import { CourseNavigation } from "./CourseNavigation";
 import { DragStyleContextProvider } from "./context/drag/dragStyleContext";
 
+
 export default async function CoursePage({}: {}) {
   return (
     <>
-      <CourseTitle />
       <div className="h-full flex flex-col">
         <DragStyleContextProvider>
           <DraggingContextProvider>

src/app/course/[courseName]/settings/page.tsx

@@ -1,4 +1,17 @@
+import { Metadata } from "next";
 import AllSettings from "./AllSettings";
+import { getTitle } from "@/services/titleUtils";
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ courseName: string }>;
+}): Promise<Metadata> {
+  const { courseName } = await params;
+  return {
+    title: getTitle(courseName) + " Settings",
+  };
+}
 
 export default function page() {
   return (

src/app/layout.tsx

@@ -10,10 +10,11 @@ import { createTrpcContext } from "@/services/serverFunctions/context";
 import superjson from "superjson";
 import { fileStorageService } from "@/services/fileStorage/fileStorageService";
 import { ClientCacheInvalidation } from "../components/realtime/ClientCacheInvalidation";
+import { getTitle } from "@/services/titleUtils";
 export const dynamic = "force-dynamic";
 
 export const metadata: Metadata = {
-  title: (process.env.NEXT_PUBLIC_TITLE_PREFIX ?? "") + "Canvas Manager 2.0",
+  title: getTitle("Canvas Manager 2.0"),
 };
 
 export default async function RootLayout({

src/services/titleUtils.ts

@@ -0,0 +1,6 @@
+export function getTitle(title: string) {
+  const prefix = process.env.NEXT_PUBLIC_TITLE_PREFIX
+    ? process.env.NEXT_PUBLIC_TITLE_PREFIX + " "
+    : "";
+  return `${prefix}${title}`;
+}