Refactor layout components: separate layout with global data into its own file, restore GlobalStoreProvider in the new layout, and update global state management to accept initial movies as a prop for improved data handling.

This commit is contained in:
Norbert Maciaszek 2025-08-09 00:43:15 +02:00
parent e128a5f493
commit 181826cceb
4 changed files with 20 additions and 12 deletions

View File

@ -0,0 +1,15 @@
import { getMovies } from "@/lib/db";
import { GlobalStoreProvider } from "../store/globalStore";
export const revalidate = 0;
export default async function WithGlobalDataLayout({
children,
}: {
children: React.ReactNode;
}) {
const movies = await getMovies();
return (
<GlobalStoreProvider initialMovies={movies}>{children}</GlobalStoreProvider>
);
}

View File

@ -2,7 +2,6 @@ import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { Navbar } from "@/components/organisms/Navbar";
import { GlobalStoreProvider } from "./store/globalStore";
const geistSans = Geist({
variable: "--font-geist-sans",
@ -29,7 +28,7 @@ export default async function RootLayout({
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
<GlobalStoreProvider>{children}</GlobalStoreProvider>
{children}
</body>
</html>
);

View File

@ -1,7 +1,6 @@
"use client";
import { getMovies } from "@/lib/db";
import { movies } from "@/lib/db/schema";
import { createContext, FC, use, useEffect, useState } from "react";
import { createContext, FC, use, useState } from "react";
type Movie = typeof movies.$inferSelect;
@ -21,16 +20,11 @@ const globalStore = createContext<GlobalStore>({
type Props = {
children: React.ReactNode;
initialMovies: Movie[];
};
export const GlobalStoreProvider: FC<Props> = ({ children }) => {
const [movies, setMovies] = useState<GlobalStore["movies"]>([]);
useEffect(() => {
getMovies().then((movies) => {
setMovies(movies);
});
}, []);
export const GlobalStoreProvider: FC<Props> = ({ children, initialMovies }) => {
const [movies, setMovies] = useState<GlobalStore["movies"]>(initialMovies);
const addMovie = async (movie: Movie) => {
if (movies.find((m) => m.id === movie.id)) return;