feat: Add quotes page

messages/en-GB.json

@@ -33,7 +33,8 @@
     "cancel": "Cancel",
     "save": "Save",
     "uploadText": "Drop files here or click to upload",
-    "noValidFiles": "No valid files were dropped"
+    "noValidFiles": "No valid files were dropped",
+    "noChoicesFound": "No choices found"
   },
   "error": {
     "notFound": "404 - Page not found",
@@ -119,6 +120,7 @@
     "about": "About",
     "shiftSchedule": "Shift Schedule",
     "members": "Members",
+    "quotes": "Quotes",
     "desktopNavMenu": "{open, select, true {Open} other {Close}} navigation menu",
     "goToMatrix": "Go to Matrix",
     "rules": "Rules",
@@ -604,13 +606,6 @@
     "microcontroller": "Microcontroller Programming",
     "webdevelopment": "Web Development"
   },
-  "api": {
-    "tooManyRequests": "Too many requests, please try again later",
-    "notAuthenticated": "Not authenticated",
-    "notAuthorized": "Not authorized",
-    "noFileFound": "No file found",
-    "unableToUpdateMatrix": "Unable to update on Matrix"
-  },
   "privacy": {
     "title": "Privacy Policy",
     "lastUpdated": "Last updated: 9th July 2025",
@@ -673,5 +668,62 @@
       "title": "Changes to this Privacy Policy",
       "content": "We reserve the right to change this Privacy Policy at any time. Any changes will be published on this page and the change date will be updated. We encourage you to regularly read the statement to stay informed about how we protect your privacy."
     }
+  },
+  "quotes": {
+    "title": "Inspirational Quotes",
+    "backToQuotes": "Back to quotes",
+    "heardByUser": "Heard by: {user}",
+    "new": {
+      "title": "New Quote",
+      "createQuote": "Create quote",
+      "success": "Quote created",
+      "unauthorized": "Unauthorized to create new quotes"
+    },
+    "update": {
+      "title": "Update Quote",
+      "updateQuote": "Update quote",
+      "success": "Quote updated",
+      "unauthorized": "Unauthorized to update quotes"
+    },
+    "delete": {
+      "title": "Are you sure you want to delete this quote?",
+      "description": "This action cannot be undone.",
+      "success": "Quote deleted successfully",
+      "unauthorized": "Unauthorized to delete quotes"
+    },
+    "form": {
+      "userId": {
+        "label": "User",
+        "required": "User is required",
+        "placeholder": "Search for a user...",
+        "description": "Select a user"
+      },
+      "content": {
+        "labelEnglish": "Quote (English)",
+        "labelNorwegian": "Quote (Norwegian)",
+        "placeholderEnglish": "My heart cries because I do not own a 3D printer",
+        "placeholderNorwegian": "Mitt hjerte gråter fordi jeg ikke eier en 3D-printer",
+        "required": "Quote is required",
+        "minLength": "Quote must be at least {count} characters"
+      },
+      "internal": {
+        "label": "Internal quote",
+        "description": "If selected, this quote will only be visible to Hackerspace members."
+      }
+    },
+    "api": {
+      "invalidId": "Invalid ID",
+      "failedToGetQuotes": "The server failed to get quotes",
+      "noUserWithUsername": "No user with provided username found",
+      "quoteNotFound": "Quote not found"
+    }
+  },
+  "api": {
+    "internalServerError": "Internal server error",
+    "tooManyRequests": "Too many requests, please try again later",
+    "notAuthenticated": "Not authenticated",
+    "notAuthorized": "Not authorized",
+    "noFileFound": "No file found",
+    "unableToUpdateMatrix": "Unable to update on Matrix"
   }
 }

messages/nb-NO.json

@@ -33,7 +33,8 @@
     "cancel": "Avbryt",
     "save": "Lagre",
     "uploadText": "Slipp filer her eller klikk for å laste opp",
-    "noValidFiles": "Ingen gyldige filer ble sluppet"
+    "noValidFiles": "Ingen gyldige filer ble sluppet",
+    "noChoicesFound": "Ingen valg funnet"
   },
   "error": {
     "notFound": "404 - Siden ble ikke funnet",
@@ -119,6 +120,7 @@
     "about": "Om oss",
     "shiftSchedule": "Vaktliste",
     "members": "Medlemmer",
+    "quotes": "Quotes",
     "desktopNavMenu": "{open, select, true {Åpne} other {Lukk}} navigasjonsmeny",
     "goToMatrix": "Dra til Matrix",
     "rules": "Regler",
@@ -604,13 +606,6 @@
     "microcontroller": "Mikrokontroller-programmering",
     "webdevelopment": "Webutvikling"
   },
-  "api": {
-    "tooManyRequests": "For mange forespørsler. Vennligst vent noen minutter og prøv igjen",
-    "notAuthenticated": "Ikke autentisert",
-    "notAuthorized": "Ikke autorisert",
-    "noFileFound": "Ingen fil funnet",
-    "unableToUpdateMatrix": "Kunne ikke oppdatere på Matrix"
-  },
   "privacy": {
     "title": "Personvernerklæring",
     "lastUpdated": "Sist oppdatert: 9. juli 2025",
@@ -673,5 +668,62 @@
       "title": "Endringer i denne personvernerklæringen",
       "content": "Vi forbeholder oss retten til å endre denne personvernerklæringen når som helst. Eventuelle endringer vil bli publisert på denne siden, og endringsdatoen vil bli oppdatert. Vi oppfordrer deg til å regelmessig lese erklæringen for å holde deg informert om hvordan vi beskytter personvernet ditt."
     }
+  },
+  "quotes": {
+    "title": "Inspirerende sitater",
+    "backToQuotes": "Tilbake til sitater",
+    "heardByUser": "Heard by: {user}",
+    "new": {
+      "title": "Nytt sitat",
+      "createQuote": "Opprett sitat",
+      "success": "Sitat opprettet",
+      "unauthorized": "Du har ikke rettigheter til å opprette nye sitater"
+    },
+    "update": {
+      "title": "Oppdater sitat",
+      "updateQuote": "Oppdater sitat",
+      "success": "Sitat oppdatert",
+      "unauthorized": "Du har ikke rettigheter til å oppdatere sitater"
+    },
+    "delete": {
+      "title": "Er du sikker på at du vil slette dette sitatet?",
+      "description": "Denne handlingen kan ikke angres.",
+      "success": "Sitat slettet",
+      "unauthorized": "Du har ikke rettigheter til å slette sitater"
+    },
+    "form": {
+      "userId": {
+        "label": "Bruker",
+        "required": "Bruker er påkrevd",
+        "placeholder": "Søk etter en bruker...",
+        "description": "Velg en bruker"
+      },
+      "content": {
+        "labelEnglish": "Sitat (engelsk)",
+        "labelNorwegian": "Sitat (norsk)",
+        "placeholderEnglish": "My heart cries because I do not own a 3D printer",
+        "placeholderNorwegian": "Mitt hjerte gråter fordi jeg ikke eier en 3D-printer",
+        "required": "Sitat er påkrevd",
+        "minLength": "Sitat må være minst {count} tegn"
+      },
+      "internal": {
+        "label": "Internt sitat",
+        "description": "Hvis valgt, vil dette sitatet kun være synlig for Hackerspace-medlemmer."
+      }
+    },
+    "api": {
+      "invalidId": "Ugyldig ID",
+      "failedToGetQuotes": "Serveren klarte ikke å hente sitater",
+      "noUserWithUsername": "Ingen bruker med oppgitt brukernavn funnet",
+      "quoteNotFound": "Sitat ikke funnet"
+    }
+  },
+  "api": {
+    "internalServerError": "Intern serverfeil",
+    "tooManyRequests": "For mange forespørsler. Vennligst vent noen minutter og prøv igjen",
+    "notAuthenticated": "Ikke autentisert",
+    "notAuthorized": "Ikke autorisert",
+    "noFileFound": "Ingen fil funnet",
+    "unableToUpdateMatrix": "Kunne ikke oppdatere på Matrix"
   }
 }

src/app/[locale]/(default)/about/group/[name]/page.tsx

@@ -68,7 +68,7 @@ export default async function GroupPage({
           ['labops', 'leadership', 'admin'].includes(g),
         ) && (
           <Link
-            className='absolute top-0 right-0'
+            className='-translate-y-1/2 absolute top-1/2 right-0'
             href={{
               pathname: '/about/group/[name]/edit',
               params: { name: group.identifier },

src/app/[locale]/(default)/quotes/[quoteId]/edit/loading.tsx

@@ -0,0 +1,25 @@
+import { ArrowLeftIcon } from 'lucide-react';
+import { getTranslations } from 'next-intl/server';
+import { QuoteFormSkeleton } from '@/components/quotes/QuoteFormSkeleton';
+import { Link } from '@/components/ui/Link';
+
+export default async function NewQuoteLoading() {
+  const t = await getTranslations('quotes');
+  const tUpdate = await getTranslations('quotes.update');
+
+  return (
+    <>
+      <Link
+        className='flex w-fit items-center gap-2'
+        href='/quotes'
+        variant='ghost'
+        size='default'
+      >
+        <ArrowLeftIcon />
+        <span>{t('backToQuotes')}</span>
+      </Link>
+      <h1 className='text-center'>{tUpdate('title')}</h1>
+      <QuoteFormSkeleton />
+    </>
+  );
+}

src/app/[locale]/(default)/quotes/[quoteId]/edit/page.tsx

@@ -0,0 +1,70 @@
+import { ArrowLeftIcon } from 'lucide-react';
+import { notFound } from 'next/navigation';
+import { type Locale, type Messages, NextIntlClientProvider } from 'next-intl';
+import {
+  getMessages,
+  getTranslations,
+  setRequestLocale,
+} from 'next-intl/server';
+import { QuoteForm } from '@/components/quotes/QuoteForm';
+import { Link } from '@/components/ui/Link';
+import { api } from '@/lib/api/server';
+
+export async function generateMetadata() {
+  const t = await getTranslations('quotes.update');
+
+  return {
+    title: t('title'),
+  };
+}
+
+export default async function NewQuotePage({
+  params,
+}: {
+  params: Promise<{ locale: Locale; quoteId: string }>;
+}) {
+  const { locale, quoteId } = await params;
+  setRequestLocale(locale);
+
+  const { user } = await api.auth.state();
+  const t = await getTranslations('quotes');
+  const tUpdate = await getTranslations('quotes.update');
+
+  if (Number.isNaN(quoteId)) return notFound();
+
+  const quote = await api.quotes.getQuote(Number(quoteId));
+
+  if (!quote) return notFound();
+
+  if (
+    !user?.groups.some((g) => ['labops', 'leadership', 'admin'].includes(g)) &&
+    quote.saidBy.id !== user?.id &&
+    quote.heardBy.id !== user?.id
+  ) {
+    // TODO: Actually return a HTTP 401 Unauthorized reponse whenever `unauthorized.tsx` is stable
+    throw new Error(tUpdate('unauthorized'));
+  }
+
+  const { quotes, ui } = await getMessages();
+  const users = await api.users.fetchAllUsers();
+
+  return (
+    <>
+      <Link
+        className='flex w-fit items-center gap-2'
+        href='/quotes'
+        variant='ghost'
+        size='default'
+      >
+        <ArrowLeftIcon />
+        <span>{t('backToQuotes')}</span>
+      </Link>
+      <h1 className='text-center'>{tUpdate('title')}</h1>
+      <NextIntlClientProvider
+        messages={{ quotes, ui } as Pick<Messages, 'quotes' | 'ui'>}
+      >
+        <QuoteForm users={users} quote={quote} />
+      </NextIntlClientProvider>
+    </>
+  );
+}

src/app/[locale]/(default)/quotes/new/loading.tsx

@@ -0,0 +1,25 @@
+import { ArrowLeftIcon } from 'lucide-react';
+import { getTranslations } from 'next-intl/server';
+import { QuoteFormSkeleton } from '@/components/quotes/QuoteFormSkeleton';
+import { Link } from '@/components/ui/Link';
+
+export default async function NewQuotePage() {
+  const t = await getTranslations('quotes');
+  const tNew = await getTranslations('quotes.new');
+
+  return (
+    <>
+      <Link
+        className='flex w-fit items-center gap-2'
+        href='/quotes'
+        variant='ghost'
+        size='default'
+      >
+        <ArrowLeftIcon />
+        <span>{t('backToQuotes')}</span>
+      </Link>
+      <h1 className='text-center'>{tNew('title')}</h1>
+      <QuoteFormSkeleton />
+    </>
+  );
+}

src/app/[locale]/(default)/quotes/new/page.tsx

@@ -0,0 +1,61 @@
+import { ArrowLeftIcon } from 'lucide-react';
+import { type Locale, type Messages, NextIntlClientProvider } from 'next-intl';
+import {
+  getMessages,
+  getTranslations,
+  setRequestLocale,
+} from 'next-intl/server';
+import { QuoteForm } from '@/components/quotes/QuoteForm';
+import { Link } from '@/components/ui/Link';
+import { api } from '@/lib/api/server';
+
+export async function generateMetadata() {
+  const t = await getTranslations('quotes.new');
+
+  return {
+    title: t('title'),
+  };
+}
+
+export default async function NewQuotePage({
+  params,
+}: {
+  params: Promise<{ locale: Locale }>;
+}) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  const { user } = await api.auth.state();
+  const t = await getTranslations('quotes');
+  const tNew = await getTranslations('quotes.new');
+
+  if (
+    !user?.groups.some((g) => ['labops', 'leadership', 'admin'].includes(g))
+  ) {
+    // TODO: Actually return a HTTP 401 Unauthorized reponse whenever `unauthorized.tsx` is stable
+    throw new Error(tNew('unauthorized'));
+  }
+
+  const { quotes, ui } = await getMessages();
+  const users = await api.users.fetchAllUsers();
+
+  return (
+    <>
+      <Link
+        className='flex w-fit items-center gap-2'
+        href='/quotes'
+        variant='ghost'
+        size='default'
+      >
+        <ArrowLeftIcon />
+        <span>{t('backToQuotes')}</span>
+      </Link>
+      <h1 className='text-center'>{tNew('title')}</h1>
+      <NextIntlClientProvider
+        messages={{ quotes, ui } as Pick<Messages, 'quotes' | 'ui'>}
+      >
+        <QuoteForm users={users} />
+      </NextIntlClientProvider>
+    </>
+  );
+}