diff --git a/components.json b/components.json index 9b2d462..556d973 100644 --- a/components.json +++ b/components.json @@ -6,7 +6,7 @@ "tailwind": { "config": "tailwind.config.ts", "css": "src/app/globals.css", - "baseColor": "blue", + "baseColor": "slate", "cssVariables": true }, "aliases": { diff --git a/next.config.js b/next.config.js index 658404a..8f9205c 100644 --- a/next.config.js +++ b/next.config.js @@ -1,4 +1,19 @@ /** @type {import('next').NextConfig} */ -const nextConfig = {}; +const nextConfig = { + redirects() { + return [ + { + source: '/', + destination: '/dashboard/projects', + permanent: true, + }, + { + source: '/dashboard', + destination: '/dashboard/projects', + permanent: true, + }, + ]; + }, +}; module.exports = nextConfig; diff --git a/package-lock.json b/package-lock.json index a4fc68f..857192c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,10 +15,12 @@ "@radix-ui/react-avatar": "^1.0.4", "@radix-ui/react-checkbox": "^1.0.4", "@radix-ui/react-dialog": "^1.0.5", + "@radix-ui/react-dropdown-menu": "2.0.6", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-slot": "^1.0.2", "@supabase/auth-helpers-nextjs": "^0.8.1", "@vercel/analytics": "^1.1.1", + "date-fns": "2.30.0", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", "core-js": "^3.33.2", @@ -34,6 +36,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-hook-form": "^7.47.0", + "swagger-ui-react": "^5.9.0", "redoc": "^2.1.3", "styled-components": "^6.1.0", "tailwind-merge": "^1.14.0", @@ -340,6 +343,40 @@ "resolved": "https://registry.npmjs.org/@exodus/schemasafe/-/schemasafe-1.3.0.tgz", "integrity": "sha512-5Aap/GaRupgNx/feGBwLLTVv8OQFfv3pq2lPRzPg9R+IOBnDgghTGW7l7EuVXOvg5cc/xSAlRW8rBrjIC3Nvqw==" }, + "node_modules/@floating-ui/core": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.5.0.tgz", + "integrity": "sha512-kK1h4m36DQ0UHGj5Ah4db7R0rHemTqqO0QLvUqi1/mUUp3LuAWbWxdxSIf/XsnH9VS6rRVPLJCncjRzUvyCLXg==", + "dependencies": { + "@floating-ui/utils": "^0.1.3" + } + }, + "node_modules/@floating-ui/dom": { + "version": "1.5.3", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.3.tgz", + "integrity": "sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==", + "dependencies": { + "@floating-ui/core": "^1.4.2", + "@floating-ui/utils": "^0.1.3" + } + }, + "node_modules/@floating-ui/react-dom": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.2.tgz", + "integrity": "sha512-5qhlDvjaLmAst/rKb3VdlCinwTF4EYMiVxuuc/HVUjs46W0zgtbMmAZ1UTsDrRTxRmUEzl92mOtWbeeXL26lSQ==", + "dependencies": { + "@floating-ui/dom": "^1.5.1" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, + "node_modules/@floating-ui/utils": { + "version": "0.1.6", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.6.tgz", + "integrity": "sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A==" + }, "node_modules/@fontsource/inter": { "version": "5.0.8", "resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-5.0.8.tgz", @@ -654,6 +691,29 @@ } } }, + "node_modules/@radix-ui/react-arrow": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.0.3.tgz", + "integrity": "sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@radix-ui/react-primitive": "1.0.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0", + "react-dom": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-avatar": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/@radix-ui/react-avatar/-/react-avatar-1.0.4.tgz", @@ -880,6 +940,35 @@ } } }, + "node_modules/@radix-ui/react-dropdown-menu": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.0.6.tgz", + "integrity": "sha512-i6TuFOoWmLWq+M/eCLGd/bQ2HfAX1RJgvrBQ6AQLmzfvsLdefxbWu8G9zczcPFfcSPehz9GcpF6K9QYreFV8hA==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@radix-ui/primitive": "1.0.1", + "@radix-ui/react-compose-refs": "1.0.1", + "@radix-ui/react-context": "1.0.1", + "@radix-ui/react-id": "1.0.1", + "@radix-ui/react-menu": "2.0.6", + "@radix-ui/react-primitive": "1.0.3", + "@radix-ui/react-use-controllable-state": "1.0.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0", + "react-dom": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-focus-guards": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.1.tgz", @@ -963,6 +1052,78 @@ } } }, + "node_modules/@radix-ui/react-menu": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/@radix-ui/react-menu/-/react-menu-2.0.6.tgz", + "integrity": "sha512-BVkFLS+bUC8HcImkRKPSiVumA1VPOOEC5WBMiT+QAVsPzW1FJzI9KnqgGxVDPBcql5xXrHkD3JOVoXWEXD8SYA==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@radix-ui/primitive": "1.0.1", + "@radix-ui/react-collection": "1.0.3", + "@radix-ui/react-compose-refs": "1.0.1", + "@radix-ui/react-context": "1.0.1", + "@radix-ui/react-direction": "1.0.1", + "@radix-ui/react-dismissable-layer": "1.0.5", + "@radix-ui/react-focus-guards": "1.0.1", + "@radix-ui/react-focus-scope": "1.0.4", + "@radix-ui/react-id": "1.0.1", + "@radix-ui/react-popper": "1.1.3", + "@radix-ui/react-portal": "1.0.4", + "@radix-ui/react-presence": "1.0.1", + "@radix-ui/react-primitive": "1.0.3", + "@radix-ui/react-roving-focus": "1.0.4", + "@radix-ui/react-slot": "1.0.2", + "@radix-ui/react-use-callback-ref": "1.0.1", + "aria-hidden": "^1.1.1", + "react-remove-scroll": "2.5.5" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0", + "react-dom": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-popper": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.1.3.tgz", + "integrity": "sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@floating-ui/react-dom": "^2.0.0", + "@radix-ui/react-arrow": "1.0.3", + "@radix-ui/react-compose-refs": "1.0.1", + "@radix-ui/react-context": "1.0.1", + "@radix-ui/react-primitive": "1.0.3", + "@radix-ui/react-use-callback-ref": "1.0.1", + "@radix-ui/react-use-layout-effect": "1.0.1", + "@radix-ui/react-use-rect": "1.0.1", + "@radix-ui/react-use-size": "1.0.1", + "@radix-ui/rect": "1.0.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0", + "react-dom": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-portal": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.0.4.tgz", @@ -1033,6 +1194,37 @@ } } }, + "node_modules/@radix-ui/react-roving-focus": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.0.4.tgz", + "integrity": "sha512-2mUg5Mgcu001VkGy+FfzZyzbmuUWzgWkj3rvv4yu+mLw03+mTzbxZHvfcGyFp2b8EkQeMkpRQ5FiA2Vr2O6TeQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@radix-ui/primitive": "1.0.1", + "@radix-ui/react-collection": "1.0.3", + "@radix-ui/react-compose-refs": "1.0.1", + "@radix-ui/react-context": "1.0.1", + "@radix-ui/react-direction": "1.0.1", + "@radix-ui/react-id": "1.0.1", + "@radix-ui/react-primitive": "1.0.3", + "@radix-ui/react-use-callback-ref": "1.0.1", + "@radix-ui/react-use-controllable-state": "1.0.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0", + "react-dom": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-slot": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.2.tgz", @@ -1138,6 +1330,24 @@ } } }, + "node_modules/@radix-ui/react-use-rect": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.0.1.tgz", + "integrity": "sha512-Cq5DLuSiuYVKNU8orzJMbl15TXilTnJKUCltMVQg53BQOF1/C5toAaGrowkgksdBQ9H+SRL23g0HDmg9tvmxXw==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@radix-ui/rect": "1.0.1" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-use-size": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz", @@ -1156,6 +1366,14 @@ } } }, + "node_modules/@radix-ui/rect": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.0.1.tgz", + "integrity": "sha512-fyrgCaedtvMg9NK3en0pnOYJdtfwxUcNolezkNPUsoX57X8oQk+NkqcvzHXD2uKNij6GXmWU9NDru2IWjrO4BQ==", + "dependencies": { + "@babel/runtime": "^7.13.10" + } + }, "node_modules/@redocly/ajv": { "version": "8.11.0", "resolved": "https://registry.npmjs.org/@redocly/ajv/-/ajv-8.11.0.tgz", @@ -2989,6 +3207,21 @@ "node": ">= 12" } }, + "node_modules/date-fns": { + "version": "2.30.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", + "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==", + "dependencies": { + "@babel/runtime": "^7.21.0" + }, + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } + }, "node_modules/dayjs": { "version": "1.11.10", "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz", diff --git a/package.json b/package.json index 92d6f84..4addd16 100644 --- a/package.json +++ b/package.json @@ -25,10 +25,12 @@ "@radix-ui/react-avatar": "^1.0.4", "@radix-ui/react-checkbox": "^1.0.4", "@radix-ui/react-dialog": "^1.0.5", + "@radix-ui/react-dropdown-menu": "2.0.6", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-slot": "^1.0.2", "@supabase/auth-helpers-nextjs": "^0.8.1", "@vercel/analytics": "^1.1.1", + "date-fns": "2.30.0", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", "core-js": "^3.33.2", @@ -44,6 +46,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-hook-form": "^7.47.0", + "swagger-ui-react": "^5.9.0", "redoc": "^2.1.3", "styled-components": "^6.1.0", "tailwind-merge": "^1.14.0", diff --git a/public/sqd-light-trans.png b/public/logo.png similarity index 100% rename from public/sqd-light-trans.png rename to public/logo.png diff --git a/src/app/dashboard/components/main-nav.tsx b/src/app/dashboard/components/main-nav.tsx new file mode 100644 index 0000000..5cfd56f --- /dev/null +++ b/src/app/dashboard/components/main-nav.tsx @@ -0,0 +1,27 @@ +import Link from 'next/link'; +import { cn } from '@/lib/utils'; + +export function MainNav({ + className, + ...props +}: React.HTMLAttributes) { + return ( + + ); +} diff --git a/src/app/dashboard/components/project-nav.tsx b/src/app/dashboard/components/project-nav.tsx new file mode 100644 index 0000000..ab7777f --- /dev/null +++ b/src/app/dashboard/components/project-nav.tsx @@ -0,0 +1,19 @@ +import Link from 'next/link'; +import { cn } from '@/lib/utils'; + +// TODO: Fix typing please +export function ProjectNav({ className, projectId, ...props }: any) { + return ( + + ); +} diff --git a/src/app/dashboard/components/user-nav.tsx b/src/app/dashboard/components/user-nav.tsx new file mode 100644 index 0000000..1656c3d --- /dev/null +++ b/src/app/dashboard/components/user-nav.tsx @@ -0,0 +1,66 @@ +import { + Avatar, + AvatarFallback, + AvatarImage, +} from '../../../components/ui/avatar'; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuGroup, + DropdownMenuItem, + DropdownMenuLabel, + DropdownMenuSeparator, + DropdownMenuShortcut, + DropdownMenuTrigger, +} from '../../../components/ui/dropdown-menu'; +import { Button } from '../../../components/ui/button'; + +export function UserNav() { + return ( + + + + + + +
+

shadcn

+

+ m@example.com +

+
+ + + + + Profile + ⇧⌘P + + + Billing + ⌘B + + + Settings + ⌘S + + New Team + + + + Log out + ⇧⌘Q + + + + ); +} diff --git a/src/app/dashboard/layout.tsx b/src/app/dashboard/layout.tsx new file mode 100644 index 0000000..a28cb76 --- /dev/null +++ b/src/app/dashboard/layout.tsx @@ -0,0 +1,38 @@ +'use client'; + +import Image from 'next/image'; +import { MainNav } from './components/main-nav'; +import { UserNav } from './components/user-nav'; +import Link from 'next/link'; +import { useParams } from 'next/navigation'; +import { ProjectNav } from './components/project-nav'; + +export default function MainLayout({ + children, +}: { + children: React.ReactNode; +}) { + const params = useParams(); + return ( +
+
+
+
+ + Squaredev + + {params.projectId ? ( + + ) : ( + + )} +
+ +
+
+
+ {children} +
+
+ ); +} diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx deleted file mode 100644 index f2fd41d..0000000 --- a/src/app/dashboard/page.tsx +++ /dev/null @@ -1,61 +0,0 @@ -'use client'; - -import { Database } from '@/types/supabase'; -import Link from 'next/link'; -import { useEffect, useState } from 'react'; -import { createClientComponentClient } from '@supabase/auth-helpers-nextjs'; -import NewProject from '@/components/NewProject'; -import { Project } from '@/types/supabase-entities'; -import { Button } from '@/components/Button'; - -export default function Dashboard() { - const supabase = createClientComponentClient(); - const [projects, setProjects] = useState([]); - const [createNewProjectOpen, setCreateNewProjectOpen] = useState(false); - - useEffect(() => { - getData(); - }, [createNewProjectOpen]); - - const getData = async () => { - const { data: projects, error: projectsError } = await supabase - .from('projects') - .select('*'); - - if (projectsError) { - alert(`Error fetching data: projects: ${projectsError?.message}`); - } - - setProjects(projects || []); - }; - - const toggleNewProjectOpen = () => - setCreateNewProjectOpen(!createNewProjectOpen); - - return ( -
-
- -
-

Dashboard

-
- - {createNewProjectOpen && ( - - )} -
-
- Projects: -
    - {projects.map((project) => ( -
  • - -

    {project.name}

    - -
    • - ))} -
-
-
- ); -} diff --git a/src/app/dashboard/projects/[projectId]/page.tsx b/src/app/dashboard/projects/[projectId]/page.tsx index 9300537..f4c3047 100644 --- a/src/app/dashboard/projects/[projectId]/page.tsx +++ b/src/app/dashboard/projects/[projectId]/page.tsx @@ -41,7 +41,7 @@ export default function Project({ params }: { params: { projectId: string } }) { }; useEffect(() => { - getData(); + // getData(); }, []); const toggleIsAddingIndex = () => setIsAddingIndex(!isAddingIndex); diff --git a/src/app/dashboard/projects/page.tsx b/src/app/dashboard/projects/page.tsx new file mode 100644 index 0000000..296df54 --- /dev/null +++ b/src/app/dashboard/projects/page.tsx @@ -0,0 +1,107 @@ +'use client'; + +import { Database } from '@/types/supabase'; +import { formatDistance } from 'date-fns'; +import Link from 'next/link'; +import { useEffect, useState } from 'react'; +import { createClientComponentClient } from '@supabase/auth-helpers-nextjs'; +import NewProject from '@/components/NewProject'; +import { Project } from '@/types/supabase-entities'; +import { Button } from '@/components/Button'; +import { + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from '../../../components/ui/card'; +import { DollarSignIcon, MoreHorizontalIcon } from 'lucide-react'; + +export default function Dashboard() { + const supabase = createClientComponentClient(); + const [projects, setProjects] = useState([ + { + id: '1', + name: 'Test', + api_key: null, + created_at: '2023-11-01 08:36:40.221753+00', + user_id: null, + }, + ]); + const [createNewProjectOpen, setCreateNewProjectOpen] = useState(false); + + useEffect(() => { + // getData(); + }); + + const getData = async () => { + const { data: projects, error: projectsError } = await supabase + .from('projects') + .select('*'); + + if (projectsError) { + alert(`Error fetching data: projects: ${projectsError?.message}`); + } + setProjects(projects || []); + }; + + const toggleNewProjectOpen = () => + setCreateNewProjectOpen(!createNewProjectOpen); + + return ( +
+
+
+

Overview

+

+ Your projects will be shown here. +

+
+
+
+
+ {projects.map((project, i) => { + const dateWithDistance = formatDistance( + new Date(project.created_at), + new Date(), + { + includeSeconds: true, + addSuffix: true, + } + ); + return ( + + + +
+
+ {project.name} + + +
+ + + Add a nice description here. @Mega add a field in the + database please. + +
+ + +
+
{dateWithDistance}
+
+ + + + ); + })} +
+
+ ); +} diff --git a/src/app/globals.css b/src/app/globals.css index 00b08e3..8abdb15 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -6,46 +6,63 @@ :root { --background: 0 0% 100%; --foreground: 222.2 84% 4.9%; + --card: 0 0% 100%; --card-foreground: 222.2 84% 4.9%; + --popover: 0 0% 100%; --popover-foreground: 222.2 84% 4.9%; - --primary: 221.2 83.2% 53.3%; + + --primary: 222.2 47.4% 11.2%; --primary-foreground: 210 40% 98%; + --secondary: 210 40% 96.1%; --secondary-foreground: 222.2 47.4% 11.2%; + --muted: 210 40% 96.1%; --muted-foreground: 215.4 16.3% 46.9%; + --accent: 210 40% 96.1%; --accent-foreground: 222.2 47.4% 11.2%; + --destructive: 0 84.2% 60.2%; --destructive-foreground: 210 40% 98%; + --border: 214.3 31.8% 91.4%; --input: 214.3 31.8% 91.4%; - --ring: 221.2 83.2% 53.3%; + --ring: 222.2 84% 4.9%; + --radius: 0.5rem; } .dark { --background: 222.2 84% 4.9%; --foreground: 210 40% 98%; + --card: 222.2 84% 4.9%; --card-foreground: 210 40% 98%; + --popover: 222.2 84% 4.9%; --popover-foreground: 210 40% 98%; - --primary: 217.2 91.2% 59.8%; + + --primary: 210 40% 98%; --primary-foreground: 222.2 47.4% 11.2%; + --secondary: 217.2 32.6% 17.5%; --secondary-foreground: 210 40% 98%; + --muted: 217.2 32.6% 17.5%; --muted-foreground: 215 20.2% 65.1%; + --accent: 217.2 32.6% 17.5%; --accent-foreground: 210 40% 98%; + --destructive: 0 62.8% 30.6%; --destructive-foreground: 210 40% 98%; + --border: 217.2 32.6% 17.5%; --input: 217.2 32.6% 17.5%; - --ring: 224.3 76.3% 48%; + --ring: 212.7 26.8% 83.9%; } } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 68d0549..601e7f4 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -25,7 +25,7 @@ export default function RootLayout({ > diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx new file mode 100644 index 0000000..283467c --- /dev/null +++ b/src/components/ui/dropdown-menu.tsx @@ -0,0 +1,200 @@ +'use client'; + +import * as React from 'react'; +import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'; +import { Check, ChevronRight, Circle } from 'lucide-react'; + +import { cn } from '@/lib/utils'; + +const DropdownMenu = DropdownMenuPrimitive.Root; + +const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger; + +const DropdownMenuGroup = DropdownMenuPrimitive.Group; + +const DropdownMenuPortal = DropdownMenuPrimitive.Portal; + +const DropdownMenuSub = DropdownMenuPrimitive.Sub; + +const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup; + +const DropdownMenuSubTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + } +>(({ className, inset, children, ...props }, ref) => ( + + {children} + + +)); +DropdownMenuSubTrigger.displayName = + DropdownMenuPrimitive.SubTrigger.displayName; + +const DropdownMenuSubContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +DropdownMenuSubContent.displayName = + DropdownMenuPrimitive.SubContent.displayName; + +const DropdownMenuContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, sideOffset = 4, ...props }, ref) => ( + + + +)); +DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName; + +const DropdownMenuItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + } +>(({ className, inset, ...props }, ref) => ( + +)); +DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName; + +const DropdownMenuCheckboxItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, checked, ...props }, ref) => ( + + + + + + + {children} + +)); +DropdownMenuCheckboxItem.displayName = + DropdownMenuPrimitive.CheckboxItem.displayName; + +const DropdownMenuRadioItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + + + + + {children} + +)); +DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName; + +const DropdownMenuLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + } +>(({ className, inset, ...props }, ref) => ( + +)); +DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName; + +const DropdownMenuSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName; + +const DropdownMenuShortcut = ({ + className, + ...props +}: React.HTMLAttributes) => { + return ( + + ); +}; +DropdownMenuShortcut.displayName = 'DropdownMenuShortcut'; + +export { + DropdownMenu, + DropdownMenuTrigger, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuCheckboxItem, + DropdownMenuRadioItem, + DropdownMenuLabel, + DropdownMenuSeparator, + DropdownMenuShortcut, + DropdownMenuGroup, + DropdownMenuPortal, + DropdownMenuSub, + DropdownMenuSubContent, + DropdownMenuSubTrigger, + DropdownMenuRadioGroup, +}; diff --git a/tailwind.config.ts b/tailwind.config.ts index 04be50b..721bee4 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -1,12 +1,11 @@ /** @type {import('tailwindcss').Config} */ -const { fontFamily } = require('tailwindcss/defaultTheme'); - module.exports = { darkMode: ['class'], content: [ - './src/pages/**/*.{js,ts,jsx,tsx,mdx}', - './src/components/**/*.{js,ts,jsx,tsx,mdx}', - './src/app/**/*.{js,ts,jsx,tsx,mdx}', + './pages/**/*.{ts,tsx}', + './components/**/*.{ts,tsx}', + './app/**/*.{ts,tsx}', + './src/**/*.{ts,tsx}', ], theme: { container: { @@ -17,9 +16,6 @@ module.exports = { }, }, extend: { - fontFamily: { - sans: ['var(--font-sans)', ...fontFamily.sans], - }, colors: { border: 'hsl(var(--border))', input: 'hsl(var(--input))', diff --git a/tsconfig.json b/tsconfig.json index a4d8a3c..cc152b5 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -23,6 +23,15 @@ } }, "types": ["cypress", "node"], - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], + "include": [ + "next-env.d.ts", + "**/*.ts", + "**/*.tsx", + ".next/types/**/*.ts", + "src/app/dashboard/(projects)/page.tsx_", + "src/app/dashboard/(projects)/page.tsx", + "src/app/page.tsx_", + "src/app/dashboard/projects/[projectId]/layout.tsx_" + ], "exclude": ["node_modules"] }