From 3272c83f09dbe9ee8ee1f5f0dbb4475859464045 Mon Sep 17 00:00:00 2001 From: gibbyb Date: Sun, 1 Sep 2024 20:31:09 -0500 Subject: [PATCH] cant remember --- package.json | 2 + pnpm-lock.yaml | 21 ++++ .../billtracker/BillTrackerCalendar.tsx | 19 +-- src/components/billtracker/CreateBillForm.tsx | 27 ++++ src/components/home/Hero.tsx | 27 ++-- src/components/home/NavBar.tsx | 5 - src/components/ui/drawer.tsx | 118 ++++++++++++++++++ 7 files changed, 188 insertions(+), 31 deletions(-) create mode 100644 src/components/billtracker/CreateBillForm.tsx create mode 100644 src/components/ui/drawer.tsx diff --git a/package.json b/package.json index 5ddbd8d..75cba9c 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@hookform/resolvers": "^3.9.0", "@radix-ui/react-alert-dialog": "^1.1.1", "@radix-ui/react-avatar": "^1.1.0", + "@radix-ui/react-dialog": "^1.1.1", "@radix-ui/react-dropdown-menu": "^2.1.1", "@radix-ui/react-label": "^2.1.0", "@radix-ui/react-navigation-menu": "^1.2.0", @@ -49,6 +50,7 @@ "sonner": "^1.5.0", "tailwind-merge": "^2.4.0", "tailwindcss-animate": "^1.0.7", + "vaul": "^0.9.1", "zod": "^3.23.8" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 553ab0b..cacc6a6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,6 +20,9 @@ importers: '@radix-ui/react-avatar': specifier: ^1.1.0 version: 1.1.0(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-dialog': + specifier: ^1.1.1 + version: 1.1.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@radix-ui/react-dropdown-menu': specifier: ^2.1.1 version: 2.1.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -104,6 +107,9 @@ importers: tailwindcss-animate: specifier: ^1.0.7 version: 1.0.7(tailwindcss@3.4.9(ts-node@10.9.2(@types/node@20.14.14)(typescript@5.5.4))) + vaul: + specifier: ^0.9.1 + version: 0.9.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) zod: specifier: ^3.23.8 version: 3.23.8 @@ -3101,6 +3107,12 @@ packages: v8-compile-cache-lib@3.0.1: resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==} + vaul@0.9.1: + resolution: {integrity: sha512-fAhd7i4RNMinx+WEm6pF3nOl78DFkAazcN04ElLPFF9BMCNGbY/kou8UMhIcicm0rJCNePJP0Yyza60gGOD0Jw==} + peerDependencies: + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + which-boxed-primitive@1.0.2: resolution: {integrity: sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==} @@ -6116,6 +6128,15 @@ snapshots: v8-compile-cache-lib@3.0.1: {} + vaul@0.9.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + dependencies: + '@radix-ui/react-dialog': 1.1.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + transitivePeerDependencies: + - '@types/react' + - '@types/react-dom' + which-boxed-primitive@1.0.2: dependencies: is-bigint: 1.0.4 diff --git a/src/components/billtracker/BillTrackerCalendar.tsx b/src/components/billtracker/BillTrackerCalendar.tsx index a5b9eef..e909ea4 100644 --- a/src/components/billtracker/BillTrackerCalendar.tsx +++ b/src/components/billtracker/BillTrackerCalendar.tsx @@ -1,7 +1,7 @@ "use client" import * as React from "react" import { Calendar } from "~/components/ui/BillTrackerCalendar" -import { Button } from "~/components/ui/button" +import CreateBillForm from "~/components/billtracker/CreateBillForm" export default function BillTrackerCalendar() { const [selectedDate, setSelectedDate] = React.useState(undefined) @@ -39,7 +39,7 @@ export default function BillTrackerCalendar() { }, []) return ( -
+
-
-

- {selectedDate.toDateString()} -

- -
-

Add your events or bills due here.

+ < CreateBillForm date={selectedDate} setIsOpen={setIsOpen} />
diff --git a/src/components/billtracker/CreateBillForm.tsx b/src/components/billtracker/CreateBillForm.tsx new file mode 100644 index 0000000..3a6f80a --- /dev/null +++ b/src/components/billtracker/CreateBillForm.tsx @@ -0,0 +1,27 @@ +import React from "react"; + +type CreateBillFormProps = { + date: Date; + setIsOpen: React.Dispatch>; +}; + +// Create Bill Form. Get date from calendar +export default function CreateBillForm({date, setIsOpen}: CreateBillFormProps) { + return ( +
+
+

+ {date.toDateString()} +

+ +
+

Create Bill

+
+ ); +} diff --git a/src/components/home/Hero.tsx b/src/components/home/Hero.tsx index 45a42ee..5fa45c1 100644 --- a/src/components/home/Hero.tsx +++ b/src/components/home/Hero.tsx @@ -1,5 +1,6 @@ import { Outfit as FontSans } from "next/font/google"; import { cn } from "~/lib/utils" +import Link from "next/link" const fontSans = FontSans({ subsets: ["latin"], @@ -8,17 +9,19 @@ const fontSans = FontSans({ export default function Hero() { return ( -
-

- TENANT -

-

- PORTAL -

-
+ +
+

+ TENANT +

+

+ PORTAL +

+
+ ); }; diff --git a/src/components/home/NavBar.tsx b/src/components/home/NavBar.tsx index 910e236..c7761bc 100644 --- a/src/components/home/NavBar.tsx +++ b/src/components/home/NavBar.tsx @@ -17,11 +17,6 @@ export default function Nav_Bar() { "py-6 text-lg md:text-xl lg:text-2xl font-semibold font-sans antialiased", fontSans.variable)} > - - - Dashboard - - Make Payment diff --git a/src/components/ui/drawer.tsx b/src/components/ui/drawer.tsx new file mode 100644 index 0000000..196db90 --- /dev/null +++ b/src/components/ui/drawer.tsx @@ -0,0 +1,118 @@ +"use client" + +import * as React from "react" +import { Drawer as DrawerPrimitive } from "vaul" + +import { cn } from "~/lib/utils" + +const Drawer = ({ + shouldScaleBackground = true, + ...props +}: React.ComponentProps) => ( + +) +Drawer.displayName = "Drawer" + +const DrawerTrigger = DrawerPrimitive.Trigger + +const DrawerPortal = DrawerPrimitive.Portal + +const DrawerClose = DrawerPrimitive.Close + +const DrawerOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName + +const DrawerContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + +
+ {children} + + +)) +DrawerContent.displayName = "DrawerContent" + +const DrawerHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +DrawerHeader.displayName = "DrawerHeader" + +const DrawerFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +DrawerFooter.displayName = "DrawerFooter" + +const DrawerTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DrawerTitle.displayName = DrawerPrimitive.Title.displayName + +const DrawerDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DrawerDescription.displayName = DrawerPrimitive.Description.displayName + +export { + Drawer, + DrawerPortal, + DrawerOverlay, + DrawerTrigger, + DrawerClose, + DrawerContent, + DrawerHeader, + DrawerFooter, + DrawerTitle, + DrawerDescription, +}