diff --git a/package.json b/package.json index f330fbe..99b8031 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ "react-dom": "^18.3.1", "react-hook-form": "^7.52.2", "server-only": "^0.0.1", + "sonner": "^1.5.0", "tailwind-merge": "^2.4.0", "tailwindcss-animate": "^1.0.7", "zod": "^3.23.8" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 59f9f7d..6dcb0de 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -89,6 +89,9 @@ importers: server-only: specifier: ^0.0.1 version: 0.0.1 + sonner: + specifier: ^1.5.0 + version: 1.5.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) tailwind-merge: specifier: ^2.4.0 version: 2.4.0 @@ -2847,6 +2850,12 @@ packages: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} + sonner@1.5.0: + resolution: {integrity: sha512-FBjhG/gnnbN6FY0jaNnqZOMmB73R+5IiyYAw8yBj7L54ER7HB3fOSE5OFiQiE2iXWxeXKvg6fIP4LtVppHEdJA==} + peerDependencies: + react: ^18.0.0 + react-dom: ^18.0.0 + source-map-js@1.2.0: resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==} engines: {node: '>=0.10.0'} @@ -5805,6 +5814,11 @@ snapshots: slash@3.0.0: {} + sonner@1.5.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + dependencies: + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + source-map-js@1.2.0: {} source-map-support@0.5.21: diff --git a/src/app/page.tsx b/src/app/page.tsx index 8e8fc06..dca79c4 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -6,6 +6,8 @@ import Title from "~/components/home/Title" import Avatar_Popover from "~/components/auth/AvatarPopover" import First_Sign_In_Form from "~/components/auth/FirstSignInForm" import Hero from "~/components/home/Hero" +import Breadcrumb_Home from "~/components/home/breadcrumb/BreadcrumbHome" +import Nav_Bar from "~/components/home/NavBar" export default async function HomePage() { const session = await auth(); @@ -27,18 +29,22 @@ export default async function HomePage() { return (
< First_Sign_In_Form users_name={users_name} users_email={users_email} /> -
- < Hero /> -
-
-
- -
-
- +
+
+ < Hero /> + < Breadcrumb_Home /> +
+
+
+ +
+
+ +
+
); diff --git a/src/components/home/NavBar.tsx b/src/components/home/NavBar.tsx new file mode 100644 index 0000000..6165318 --- /dev/null +++ b/src/components/home/NavBar.tsx @@ -0,0 +1,71 @@ +import { Outfit as FontSans } from "next/font/google"; +import { cn } from "~/lib/utils" +import Link from "next/link" +import { + Card, + CardContent, + CardDescription, + CardFooter, + CardHeader, + CardTitle, +} from "~/components/ui/card" + +const fontSans = FontSans({ + subsets: ["latin"], + variable: "--font-sans", +}); + +export default function Nav_Bar() { + return ( +
+ + + + + + Dashboard + + + + + Make Payment + + + + + Auto-Payment + + + + + Payment Methods + + + + + Payment History + + + + + Workorders + + + + + Messages + + + + + Documents + + + + + +
+ ); +}; diff --git a/src/components/home/breadcrumb/BreadcrumbHome.tsx b/src/components/home/breadcrumb/BreadcrumbHome.tsx new file mode 100644 index 0000000..e5f99c7 --- /dev/null +++ b/src/components/home/breadcrumb/BreadcrumbHome.tsx @@ -0,0 +1,22 @@ +import { + Breadcrumb, + BreadcrumbItem, + BreadcrumbList, +} from "~/components/ui/breadcrumb" +import Link from "next/link" + +export default function Breadcrumb_Home() { + return ( + + + + +

+ Dashboard +

+ +
+
+
+ ); +}; diff --git a/src/components/theme/theme_toggle.tsx b/src/components/theme/theme_toggle.tsx index e490982..242a546 100644 --- a/src/components/theme/theme_toggle.tsx +++ b/src/components/theme/theme_toggle.tsx @@ -15,7 +15,7 @@ export default function Theme_Toggle() { return ( -