diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 361c3f0..ed707ed 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,7 +3,6 @@ import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; import { Navbar } from "@/components/organisms/Navbar"; import { GlobalStoreProvider } from "./store/globalStore"; -import { getMovies } from "@/lib/db"; const geistSans = Geist({ variable: "--font-geist-sans", @@ -16,8 +15,8 @@ const geistMono = Geist_Mono({ }); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "Movie List", + description: "Personal watch list and progress tracker", }; export default async function RootLayout({ @@ -25,14 +24,12 @@ export default async function RootLayout({ }: Readonly<{ children: React.ReactNode; }>) { - const movies = await getMovies(); - return ( - + {children} diff --git a/src/app/store/globalStore.tsx b/src/app/store/globalStore.tsx index 15b7ade..f8eda30 100644 --- a/src/app/store/globalStore.tsx +++ b/src/app/store/globalStore.tsx @@ -1,6 +1,7 @@ "use client"; +import { getMovies } from "@/lib/db"; import { movies } from "@/lib/db/schema"; -import { createContext, FC, use, useState } from "react"; +import { createContext, FC, use, useEffect, useState } from "react"; type Movie = typeof movies.$inferSelect; @@ -20,11 +21,16 @@ const globalStore = createContext({ type Props = { children: React.ReactNode; - initialMovies: GlobalStore["movies"]; }; -export const GlobalStoreProvider: FC = ({ children, initialMovies }) => { - const [movies, setMovies] = useState(initialMovies); +export const GlobalStoreProvider: FC = ({ children }) => { + const [movies, setMovies] = useState([]); + + useEffect(() => { + getMovies().then((movies) => { + setMovies(movies); + }); + }, []); const addMovie = async (movie: Movie) => { if (movies.find((m) => m.id === movie.id)) return; diff --git a/src/lib/db/index.ts b/src/lib/db/index.ts index 3d57755..5f7c9c6 100644 --- a/src/lib/db/index.ts +++ b/src/lib/db/index.ts @@ -6,7 +6,7 @@ import { eq } from "drizzle-orm"; const db = drizzle(process.env.DB_FILE_NAME!); export const getMovies = async () => { - return await db.select().from(movies); + return await db.select().from(movies).$withCache(); }; export const addMovie = async (movie: typeof movies.$inferInsert) => {