gitadmin
/
moviebox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Implement global state management for movies; refactor RootLayout to fetch movies and wrap children in GlobalStoreProvider; enhance database schema with additional movie fields and CRUD operations.

This commit is contained in:
Norbert Maciaszek 2025-08-05 21:51:32 +02:00
parent 922e55f27f
commit 08d766bf8c
4 changed files with 77 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/layout.tsx
View File

@ -2,6 +2,8 @@ import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google"; import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css"; import "./globals.css";
import { Navbar } from "@/components/organisms/Navbar"; import { Navbar } from "@/components/organisms/Navbar";
import { GlobalStoreProvider } from "./store/globalStore";
import { getMovies } from "@/lib/db";
const geistSans = Geist({ const geistSans = Geist({
variable: "--font-geist-sans", variable: "--font-geist-sans",
@ -18,19 +20,23 @@ export const metadata: Metadata = {
description: "Generated by create next app", description: "Generated by create next app",
}; };
export default function RootLayout({ export default async function RootLayout({
children, children,
}: Readonly<{ }: Readonly<{
children: React.ReactNode; children: React.ReactNode;
}>) { }>) {
const movies = await getMovies();
return ( return (
<html lang="en"> <html lang="en">
<body <body
className={`${geistSans.variable} ${geistMono.variable} antialiased`} className={`${geistSans.variable} ${geistMono.variable} antialiased`}
> >
<Navbar /> <GlobalStoreProvider initialMovies={movies}>
<Navbar />
{children} {children}
</GlobalStoreProvider>
</body> </body>
</html> </html>
); );

44
src/app/store/globalStore.tsx Normal file
View File

@ -0,0 +1,44 @@
"use client";
import { movies } from "@/lib/db/schema";
import { createContext, FC, use, useState } from "react";
type GlobalStore = {
movies: (typeof movies.$inferSelect)[];
addMovie: (movie: typeof movies.$inferSelect) => void;
deleteMovie: (id: number) => void;
};
const globalStore = createContext<GlobalStore>({
movies: [],
addMovie: () => {},
deleteMovie: () => {},
});
type Props = {
children: React.ReactNode;
initialMovies: GlobalStore["movies"];
};
export const GlobalStoreProvider: FC<Props> = ({ children, initialMovies }) => {
const [movies, setMovies] = useState<GlobalStore["movies"]>(initialMovies);
const addMovie = async (movie: GlobalStore["movies"][number]) => {
if (movies.find((m) => m.id === movie.id)) return;
setMovies((prev) => [...prev, movie]);
};
const deleteMovie = async (id: number) => {
setMovies((prev) => prev.filter((m) => m.id !== id));
};
return (
<globalStore.Provider value={{ movies, addMovie, deleteMovie }}>
{children}
</globalStore.Provider>
);
};
export const useGlobalStore = () => {
return use(globalStore);
};

17
src/lib/db/index.ts
View File

@ -1,3 +1,18 @@
"use server";
import { drizzle } from "drizzle-orm/libsql"; import { drizzle } from "drizzle-orm/libsql";
import { movies } from "./schema";
import { eq } from "drizzle-orm";
export const db = drizzle(process.env.DB_FILE_NAME!); const db = drizzle(process.env.DB_FILE_NAME!);
export const getMovies = async () => {
return await db.select().from(movies);
};
export const addMovie = async (movie: typeof movies.$inferInsert) => {
await db.insert(movies).values(movie).onConflictDoNothing();
};
export const deleteMovie = async (id: number) => {
await db.delete(movies).where(eq(movies.id, id));
};

13
src/lib/db/schema.ts
View File

@ -1,10 +1,13 @@
import { integer, sqliteTable, text } from "drizzle-orm/sqlite-core"; import { integer, real, sqliteTable, text } from "drizzle-orm/sqlite-core";
export const movies = sqliteTable("movies", { export const movies = sqliteTable("movies", {
id: integer("id").primaryKey(), id: integer("id").primaryKey(),
title: text("title").notNull(), title: text("title").notNull(),
releaseDate: text("release_date"), overview: text("overview").notNull(),
posterPath: text("poster_path"), popularity: real("popularity").notNull(),
status: text("status"), // to-watch, seen releaseDate: text("release_date").notNull(),
notes: text("notes"), posterPath: text("poster_path").notNull(),
seen: integer("seen").default(0).notNull(),
favorite: integer("favorite").default(0).notNull(),
notes: text("notes").default("").notNull(),
}); });