fix mongodb templates and add migrate and generate scripts

apps/web/package.json

@@ -22,10 +22,12 @@
     "lucide-react": "^0.503.0",
     "motion": "^12.8.0",
     "next": "15.3.1",
+    "next-themes": "^0.4.6",
     "nuqs": "^2.4.3",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-tweet": "^3.2.2",
+    "sonner": "^2.0.3",
     "tailwind-merge": "^3.2.0"
   },
   "devDependencies": {

apps/web/src/app/layout.tsx

@@ -4,6 +4,7 @@ import { Poppins } from "next/font/google";
 import { NuqsAdapter } from "nuqs/adapters/next/app";
 import type { ReactNode } from "react";
 import "./global.css";
+import { Toaster } from "@/components/ui/sonner";
 
 const poppins = Poppins({
 	subsets: ["latin"],
@@ -96,6 +97,7 @@ export default function Layout({ children }: { children: ReactNode }) {
 					}}
 				>
 					<NuqsAdapter>{children}</NuqsAdapter>
+					<Toaster />
 				</RootProvider>
 			</body>
 		</html>

apps/web/src/components/ui/sonner.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { useTheme } from "next-themes";
+import { Toaster as Sonner, type ToasterProps } from "sonner";
+
+const Toaster = ({ ...props }: ToasterProps) => {
+	const { theme = "system" } = useTheme();
+
+	return (
+		<Sonner
+			theme={theme as ToasterProps["theme"]}
+			className="toaster group"
+			style={
+				{
+					"--normal-bg": "var(--popover)",
+					"--normal-text": "var(--popover-foreground)",
+					"--normal-border": "var(--border)",
+				} as React.CSSProperties
+			}
+			{...props}
+		/>
+	);
+};
+
+export { Toaster };