From 80b3c6d0717dd6a87276222f98aabade41e36f65 Mon Sep 17 00:00:00 2001 From: Ryan Le <31494954+lryanle@users.noreply.github.com> Date: Mon, 27 Nov 2023 13:48:29 -0600 Subject: [PATCH] WEE GOT DASHBOARD DONE --- .vscode/settings.json | 10 +- frontend/app/dashboard/page.tsx | 183 ++ frontend/app/fonts/index.ts | 8 +- frontend/app/globals.css | 19 + frontend/app/layout.tsx | 28 +- frontend/app/middleware.ts | 14 + frontend/app/page.tsx | 4 +- frontend/components.json | 2 +- .../dashboard/date-range-picker.tsx | 66 + frontend/components/dashboard/main-nav.tsx | 40 + frontend/components/dashboard/overview.tsx | 38 + .../components/dashboard/recent-sales.tsx | 71 + frontend/components/dashboard/search.tsx | 13 + .../components/dashboard/team-switcher.tsx | 214 +++ frontend/components/dashboard/user-nav.tsx | 62 + frontend/components/layout/footer.tsx | 2 +- frontend/components/ui/avatar.tsx | 52 + frontend/components/ui/button.tsx | 57 + frontend/components/ui/calendar.tsx | 74 + frontend/components/ui/card.tsx | 77 + frontend/components/ui/command.tsx | 151 ++ frontend/components/ui/dialog.tsx | 116 ++ frontend/components/ui/dropdown-menu.tsx | 196 ++ frontend/components/ui/input.tsx | 25 + frontend/components/ui/label.tsx | 26 + frontend/components/ui/popover.tsx | 32 + frontend/components/ui/select.tsx | 156 ++ frontend/components/ui/tabs.tsx | 56 + frontend/package-lock.json | 1580 ++++++++++++++++- frontend/package.json | 11 + frontend/tailwind.config.js | 5 + frontend/tsconfig.json | 2 +- 32 files changed, 3318 insertions(+), 72 deletions(-) create mode 100644 frontend/app/dashboard/page.tsx create mode 100644 frontend/app/middleware.ts create mode 100644 frontend/components/dashboard/date-range-picker.tsx create mode 100644 frontend/components/dashboard/main-nav.tsx create mode 100644 frontend/components/dashboard/overview.tsx create mode 100644 frontend/components/dashboard/recent-sales.tsx create mode 100644 frontend/components/dashboard/search.tsx create mode 100644 frontend/components/dashboard/team-switcher.tsx create mode 100644 frontend/components/dashboard/user-nav.tsx create mode 100644 frontend/components/ui/avatar.tsx create mode 100644 frontend/components/ui/button.tsx create mode 100644 frontend/components/ui/calendar.tsx create mode 100644 frontend/components/ui/card.tsx create mode 100644 frontend/components/ui/command.tsx create mode 100644 frontend/components/ui/dialog.tsx create mode 100644 frontend/components/ui/dropdown-menu.tsx create mode 100644 frontend/components/ui/input.tsx create mode 100644 frontend/components/ui/label.tsx create mode 100644 frontend/components/ui/popover.tsx create mode 100644 frontend/components/ui/select.tsx create mode 100644 frontend/components/ui/tabs.tsx diff --git a/.vscode/settings.json b/.vscode/settings.json index 4015df5..d6d534c 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -28,5 +28,13 @@ "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.formatOnSave": true }, - "eslint.workingDirectories": ["./frontend"] + "eslint.workingDirectories": [ + "./frontend" + ], + "[typescript][typescriptreact]": { + "editor.codeActionsOnSave": { + "source.fixAll": "explicit", + "source.organizeImports": "explicit" + } + } } diff --git a/frontend/app/dashboard/page.tsx b/frontend/app/dashboard/page.tsx new file mode 100644 index 0000000..a4d9a86 --- /dev/null +++ b/frontend/app/dashboard/page.tsx @@ -0,0 +1,183 @@ +/* eslint-disable new-cap */ +import { authOptions } from "@/app/api/auth/[...nextauth]/authOptions"; +import { Metadata } from "next"; +import { getServerSession } from "next-auth/next"; +import Image from "next/image"; + +import { CalendarDateRangePicker } from "@/components/dashboard/date-range-picker"; +import { Overview } from "@/components/dashboard/overview"; +import { RecentListings } from "@/components/dashboard/recent-sales"; +import { Button } from "@/components/ui/button"; +import { + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from "@/components/ui/card"; +import { + Tabs, + TabsContent, + TabsList, + TabsTrigger, +} from "@/components/ui/tabs"; +import { redirect } from "next/navigation"; + +export const metadata: Metadata = { + title: "Dashboard", + description: "Example dashboard app built using the components.", +} + +export default async function DashboardPage() { + const session = await getServerSession(authOptions); + if (!session) { redirect('/api/auth/signin') } + + return (session && ( +
+
+ Dashboard + Dashboard +
+
+ {/*
+
+ + +
+ + +
+
+
*/} +
+
+

Marketplace Listings Dashboard

+
+ + +
+
+ + + Overview + + Analytics + + + Reports + + + Notifications + + + Search + + + +
+ + + + Total Listings + + + + +
286
+

+ +1098% from last month +

+
+
+ + + + Flagged Listings + + + + +
+0
+

+ +0% from last month +

+
+
+ + + New Listings + + + +
+243
+

+ +876% from last month +

+
+
+ + + + Listings Today + + + + + + +
+36
+

+ +36 from last 24 hours +

+
+
+
+
+ + + Overview + + + + + + + + Recent Listings + + 8 listings flagged in the last 24 hours + + + + + + +
+
+
+
+
+
+ )) +} \ No newline at end of file diff --git a/frontend/app/fonts/index.ts b/frontend/app/fonts/index.ts index 71d138a..2b9e60f 100644 --- a/frontend/app/fonts/index.ts +++ b/frontend/app/fonts/index.ts @@ -1,13 +1,7 @@ -import { Inter } from "next/font/google"; +/* eslint-disable new-cap */ import localFont from "next/font/local"; export const sfPro = localFont({ src: "./SF-Pro-Display-Medium.otf", variable: "--font-sf", }); - -// eslint-disable-next-line new-cap -export const inter = Inter({ - variable: "--font-inter", - subsets: ["latin"], -}); diff --git a/frontend/app/globals.css b/frontend/app/globals.css index 6a75725..f994691 100644 --- a/frontend/app/globals.css +++ b/frontend/app/globals.css @@ -72,5 +72,24 @@ } body { @apply bg-background text-foreground; + font-feature-settings: "rlig" 1, "calt" 1; + } + } + + @layer utilities { + .step { + counter-increment: step; + } + + .step:before { + @apply absolute w-9 h-9 bg-muted rounded-full font-mono font-medium text-center text-base inline-flex items-center justify-center -indent-px border-4 border-background; + @apply ml-[-50px] mt-[-4px]; + content: counter(step); + } + } + + @media (max-width: 640px) { + .container { + @apply px-4; } } \ No newline at end of file diff --git a/frontend/app/layout.tsx b/frontend/app/layout.tsx index 025c9f9..3857875 100644 --- a/frontend/app/layout.tsx +++ b/frontend/app/layout.tsx @@ -1,11 +1,23 @@ +/* eslint-disable new-cap */ import Footer from "@/layouts/footer"; import Nav from "@/layouts/nav"; +import { cn } from "@/lib/utils"; import { Analytics } from "@vercel/analytics/react"; import cx from "classnames"; + import { Suspense } from "react"; -import { inter, sfPro } from "./fonts"; +import { sfPro } from "./fonts"; import "./globals.css"; +import { Inter as FontSans } from "next/font/google"; + +export const fontSans = FontSans({ + subsets: ["latin"], + variable: "--font-sans", +}) + + + export const metadata = { title: "SMARE - Social Marketplace Automotive Risk Engine", description: @@ -20,17 +32,23 @@ export default async function RootLayout({ children: React.ReactNode; }) { return ( - - -
+ + +