merge from main

danskernesdigitalebibliotek · Oct 17, 2024 · 23401dc · 23401dc
1 parent afaa4c6
commit 23401dc
Show file tree

Hide file tree

Showing 21 changed files with 6,821 additions and 12,392 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -1,4 +1,16 @@
 {
-  "trailingComma": "none",
-  "plugins": ["prettier-plugin-tailwindcss"]
+  "trailingComma": "es5",
+  "semi": false,
+  "arrowParens": "avoid",
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "endOfLine": "lf",
+  "bracketSpacing": true,
+  "bracketSameLine": true,
+  "proseWrap": "preserve",
+  "quoteProps": "as-needed",
+  "insertPragma": false,
+  "requirePragma": false,
+  "plugins": ["prettier-plugin-tailwindcss", "prettier-plugin-classnames", "prettier-plugin-merge"]
 }
diff --git a/.vscode.example/settings.json b/.vscode.example/settings.json
@@ -1,4 +1,6 @@
 {
-    "typescript.tsdk": "node_modules/typescript/lib",
-    "typescript.enablePromptUseWorkspaceTsdk": true
-  }
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "typescript.enablePromptUseWorkspaceTsdk": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true
+}
diff --git a/app/article/[id]/loadArticle.ts b/app/article/[id]/loadArticle.ts
@@ -1,15 +1,12 @@
-import {
-  GetArticleQuery,
-  useGetArticleQuery
-} from '@/lib/graphql/generated/dpl-cms/graphql'
-import getQueryClient from '@/lib/getQueryClient'
+import getQueryClient from "@/lib/getQueryClient"
+import { GetArticleQuery, useGetArticleQuery } from "@/lib/graphql/generated/dpl-cms/graphql"
 
 const loadArticle = async (id: string) => {
   const queryClient = getQueryClient()
 
   const data = await queryClient.fetchQuery<GetArticleQuery>({
     queryKey: useGetArticleQuery.getKey({ id }),
-    queryFn: useGetArticleQuery.fetcher({ id })
+    queryFn: useGetArticleQuery.fetcher({ id }),
   })
 
   return data

diff --git a/app/article/[id]/page.tsx b/app/article/[id]/page.tsx
@@ -1,14 +1,14 @@
-import { Suspense } from "react";
+import { Suspense } from "react"
 
-import loadArticle from "./loadArticle";
+import loadArticle from "./loadArticle"
 
 const Page = async ({ params: { id } }: { params: { id: string } }) => {
-  const data = await loadArticle(id);
+  const data = await loadArticle(id)
   return (
     <Suspense fallback={<p>Loading...</p>}>
       <pre>{JSON.stringify(data, null, 2)}</pre>
     </Suspense>
-  );
-};
+  )
+}
 
-export default Page;
+export default Page
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,35 +1,35 @@
-import '@/styles/globals.css'
+import "@/styles/globals.css"
 
-import type { Metadata } from 'next'
-import localFont from 'next/font/local'
+import type { Metadata } from "next"
+import localFont from "next/font/local"
 
-import Footer from '@/components/global/footer/Footer'
-import Header from '@/components/global/header/Header'
-import Theme from '@/components/global/theme/Theme'
-import ReactQueryProvider from '@/lib/providers/ReactQueryProvider'
+import Footer from "@/components/global/footer/Footer"
+import Header from "@/components/global/header/Header"
+import Theme from "@/components/global/theme/Theme"
+import ReactQueryProvider from "@/lib/providers/ReactQueryProvider"
 
 const GTFlexa = localFont({
   src: [
     {
-      path: '../fonts/GT-Flexa-Expanded-Regular.woff2',
-      weight: '400'
+      path: "../fonts/GT-Flexa-Expanded-Regular.woff2",
+      weight: "400",
     },
     {
-      path: '../fonts/GT-Flexa-Expanded-Medium.woff2',
-      weight: '500'
-    }
+      path: "../fonts/GT-Flexa-Expanded-Medium.woff2",
+      weight: "500",
+    },
   ],
-  variable: '--font-headline',
-  display: 'swap'
+  variable: "--font-headline",
+  display: "swap",
 })
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app'
+  title: "Create Next App",
+  description: "Generated by create next app",
 }
 
 export default function RootLayout({
-  children
+  children,
 }: Readonly<{
   children: React.ReactNode
 }>) {

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,9 +1,11 @@
-import Image from "next/image";
+import Image from "next/image"
 
 export default function Home() {
   return (
-    <div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
-      <main className="flex flex-col gap-8 row-start-2 items-center sm:items-start">
+    <div
+      className="grid min-h-screen grid-rows-[20px_1fr_20px] items-center justify-items-center gap-16 p-8 pb-20
+        font-[family-name:var(--font-geist-sans)] sm:p-20">
+      <main className="row-start-2 flex flex-col items-center gap-8 sm:items-start">
         <Image
           className="dark:invert"
           src="https://nextjs.org/icons/next.svg"
@@ -12,24 +14,25 @@ export default function Home() {
           height={38}
           priority
         />
-        <ol className="list-inside list-decimal text-sm text-center sm:text-left font-[family-name:var(--font-geist-mono)]">
+        <ol className="text-sm list-inside list-decimal text-center font-[family-name:var(--font-geist-mono)] sm:text-left">
           <li className="mb-2">
             Get started by editing{" "}
-            <code className="bg-black/[.05] dark:bg-white/[.06] px-1 py-0.5 rounded font-semibold">
+            <code className="rounded bg-black/[.05] px-1 py-0.5 font-semibold dark:bg-white/[.06]">
               app/page.tsx
             </code>
             .
           </li>
           <li>Save and see your changes instantly.</li>
         </ol>
 
-        <div className="flex gap-4 items-center flex-col sm:flex-row">
+        <div className="flex flex-col items-center gap-4 sm:flex-row">
           <a
-            className="rounded-full border border-solid border-transparent flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5"
+            className="text-sm sm:text-base flex h-10 items-center justify-center gap-2 rounded-full border border-solid
+              border-transparent bg-foreground px-4 text-background hover:bg-[#383838] dark:hover:bg-[#ccc]
+              sm:h-12 sm:px-5"
             href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
             target="_blank"
-            rel="noopener noreferrer"
-          >
+            rel="noopener noreferrer">
             <Image
               className="dark:invert"
               src="https://nextjs.org/icons/vercel.svg"
@@ -40,22 +43,22 @@ export default function Home() {
             Deploy now
           </a>
           <a
-            className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:min-w-44"
+            className="text-sm sm:text-base flex h-10 items-center justify-center rounded-full border border-solid
+              border-black/[.08] px-4 hover:border-transparent hover:bg-[#f2f2f2] dark:border-white/[.145]
+              dark:hover:bg-[#1a1a1a] sm:h-12 sm:min-w-44 sm:px-5"
             href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
             target="_blank"
-            rel="noopener noreferrer"
-          >
+            rel="noopener noreferrer">
             Read our docs
           </a>
         </div>
       </main>
-      <footer className="row-start-3 flex gap-6 flex-wrap items-center justify-center">
+      <footer className="row-start-3 flex flex-wrap items-center justify-center gap-6">
         <a
           className="flex items-center gap-2 hover:underline hover:underline-offset-4"
           href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
           target="_blank"
-          rel="noopener noreferrer"
-        >
+          rel="noopener noreferrer">
           <Image
             aria-hidden
             src="https://nextjs.org/icons/file.svg"
@@ -69,8 +72,7 @@ export default function Home() {
           className="flex items-center gap-2 hover:underline hover:underline-offset-4"
           href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
           target="_blank"
-          rel="noopener noreferrer"
-        >
+          rel="noopener noreferrer">
           <Image
             aria-hidden
             src="https://nextjs.org/icons/window.svg"
@@ -84,8 +86,7 @@ export default function Home() {
           className="flex items-center gap-2 hover:underline hover:underline-offset-4"
           href="https://nextjs.org?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
           target="_blank"
-          rel="noopener noreferrer"
-        >
+          rel="noopener noreferrer">
           <Image
             aria-hidden
             src="https://nextjs.org/icons/globe.svg"
@@ -97,5 +98,5 @@ export default function Home() {
         </a>
       </footer>
     </div>
-  );
+  )
 }
diff --git a/components/global/footer/Footer.tsx b/components/global/footer/Footer.tsx
@@ -1,25 +1,26 @@
-import Link from "next/link";
-import { Facebook, Instagram } from "lucide-react";
-import Icon from "../../shared/icon/Icon";
+import { Facebook, Instagram } from "lucide-react"
+import Link from "next/link"
+
+import Icon from "../../shared/icon/Icon"
 
 export default function Footer() {
   return (
-    <footer className="bg-background-foreground py-12">
+    <footer className="bg-background-overlay py-12">
       <div className="content-container">
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+        <div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-4">
           <div>
-            <h2 className="text-xl font-semibold mb-4">Åbningstider</h2>
+            <h2 className="text-xl mb-4 font-semibold">Åbningstider</h2>
             <p className="text-sm mb-4">
-              Bibliotekerne lorem ipsum consectetur, adipisci velit, sed quia
-              non numquam eius modi tempora incidunt ut labore.
+              Bibliotekerne lorem ipsum consectetur, adipisci velit, sed quia non numquam eius modi
+              tempora incidunt ut labore.
             </p>
             <Link href="#" className="text-sm underline">
               Se bibliotekernes åbningstider
             </Link>
           </div>
 
           <div>
-            <h2 className="text-xl font-semibold mb-4">Om Bibliotekerne</h2>
+            <h2 className="text-xl mb-4 font-semibold">Om Bibliotekerne</h2>
             <ul className="space-y-2">
               {[
                 "Brug af bibliotekerne",
@@ -29,8 +30,8 @@ export default function Footer() {
                 "Internetadgang",
                 "Print, scan og kopi",
                 "Booking af lokaler",
-                "Nyhedsbrev"
-              ].map((item) => (
+                "Nyhedsbrev",
+              ].map(item => (
                 <li key={item}>
                   <Link href="#" className="text-sm hover:underline">
                     {item}
@@ -41,29 +42,24 @@ export default function Footer() {
           </div>
 
           <div>
-            <h2 className="text-xl font-semibold mb-4">Online tilbud</h2>
-            <ul className="space-y-2 mb-8">
-              {[
-                "Litteratursiden",
-                "Bibliotek.dk",
-                "eReolen",
-                "Filmstriben"
-              ].map((item) => (
+            <h2 className="text-xl mb-4 font-semibold">Online tilbud</h2>
+            <ul className="mb-8 space-y-2">
+              {["Litteratursiden", "Bibliotek.dk", "eReolen", "Filmstriben"].map(item => (
                 <li key={item}>
                   <Link href="#" className="text-sm hover:underline">
                     {item}
                   </Link>
                 </li>
               ))}
             </ul>
-            <h2 className="text-xl font-semibold mb-4">Text</h2>
+            <h2 className="text-xl mb-4 font-semibold">Text</h2>
             <ul className="space-y-2">
               {[
                 "Lorem ipsum a la lorem ip",
                 "Bibliotekerne lorem",
                 "Labore ipsum",
-                "Adipisci velit le lorem"
-              ].map((item) => (
+                "Adipisci velit le lorem",
+              ].map(item => (
                 <li key={item}>
                   <Link href="#" className="text-sm hover:underline">
                     {item}
@@ -74,7 +70,7 @@ export default function Footer() {
           </div>
 
           <div>
-            <h2 className="text-xl font-semibold mb-4">Kontakt</h2>
+            <h2 className="text-xl mb-4 font-semibold">Kontakt</h2>
             <p className="text-sm mb-4">
               Lyngby-Taarbæk Bibliotekerne
               <br />
@@ -93,15 +89,15 @@ export default function Footer() {
           </div>
         </div>
 
-        <div className="mt-8 pb-8 flex justify-between border-b border-border">
-          <select className="border rounded px-2 py-1 text-sm">
+        <div className="mt-8 flex justify-between border-b border-border pb-8">
+          <select className="rounded text-sm border px-2 py-1">
             <option>DK</option>
           </select>
           <Icon className="h-[40px]" name="library-logo" />
         </div>
 
-        <div className="mt-8 flex flex-col md:flex-row justify-between items-center">
-          <div className="flex items-center space-x-4 mb-4 md:mb-0">
+        <div className="mt-8 flex flex-col items-center justify-between md:flex-row">
+          <div className="mb-4 flex items-center space-x-4 md:mb-0">
             <Link href="#" className="text-gray-600 hover:text-gray-900">
               <Facebook size={20} />
               <span className="sr-only">Facebook</span>
@@ -111,7 +107,7 @@ export default function Footer() {
               <span className="sr-only">Instagram</span>
             </Link>
           </div>
-          <div className="flex flex-wrap justify-center md:justify-end space-x-4 text-sm">
+          <div className="text-sm flex flex-wrap justify-center space-x-4 md:justify-end">
             <Link href="#" className="hover:underline">
               Behandling af persondata
             </Link>
@@ -128,5 +124,5 @@ export default function Footer() {
         </div>
       </div>
     </footer>
-  );
+  )
 }