commit 5b1719057b1ad118eb7b00578826417b4aea4240 Author: Emir Karabeg Date: Sun Jan 5 14:48:01 2025 -0800 first commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..5ef6a52078 --- /dev/null +++ b/.gitignore @@ -0,0 +1,41 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.* +.yarn/* +!.yarn/patches +!.yarn/plugins +!.yarn/releases +!.yarn/versions + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# env files (can opt-in for committing if needed) +.env* + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/README.md b/README.md new file mode 100644 index 0000000000..e215bc4ccf --- /dev/null +++ b/README.md @@ -0,0 +1,36 @@ +This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +# or +pnpm dev +# or +bun dev +``` + +Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. + +You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. + +This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. + +## Learn More + +To learn more about Next.js, take a look at the following resources: + +- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. +- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. + +You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! + +## Deploy on Vercel + +The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. + +Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. diff --git a/app/(workspace)/components/nav-item.tsx b/app/(workspace)/components/nav-item.tsx new file mode 100644 index 0000000000..a06e1b72ea --- /dev/null +++ b/app/(workspace)/components/nav-item.tsx @@ -0,0 +1,42 @@ +'use client' + +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from '@/components/ui/tooltip' +import clsx from 'clsx' +import Link from 'next/link' +import { usePathname } from 'next/navigation' + +export function NavItem({ + href, + label, + children, +}: { + href: string + label: string + children: React.ReactNode +}) { + const pathname = usePathname() + + return ( + + + + {children} + {label} + + + {label} + + ) +} diff --git a/app/(workspace)/components/search.tsx b/app/(workspace)/components/search.tsx new file mode 100644 index 0000000000..8326723300 --- /dev/null +++ b/app/(workspace)/components/search.tsx @@ -0,0 +1,33 @@ +'use client' + +import { useTransition } from 'react' +import { useRouter } from 'next/navigation' +import { Input } from '@/components/ui/input' +import { Spinner } from '@/components/icons' +import { Search } from 'lucide-react' + +export function SearchInput() { + const router = useRouter() + const [isPending, startTransition] = useTransition() + + function searchAction(formData: FormData) { + let value = formData.get('q') as string + let params = new URLSearchParams({ q: value }) + startTransition(() => { + router.replace(`/?${params.toString()}`) + }) + } + + return ( +
+ + + {isPending && } + + ) +} diff --git a/app/(workspace)/components/user.tsx b/app/(workspace)/components/user.tsx new file mode 100644 index 0000000000..e9ac21e817 --- /dev/null +++ b/app/(workspace)/components/user.tsx @@ -0,0 +1,64 @@ +import { Button } from '@/components/ui/button' +// import { auth, signOut } from '@/lib/auth' +import Image from 'next/image' +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuLabel, + DropdownMenuSeparator, + DropdownMenuTrigger, +} from '@/components/ui/dropdown-menu' +import Link from 'next/link' + +export async function User() { + // let session = await auth() + // let user = session?.user + + return ( + + + + + + My Account + + Settings + Support + + {/* {user ? ( + +
{ + 'use server' + await signOut() + }} + > + +
+ + ) : ( + + Sign In + + )} */} + + Sign In + + + + ) +} diff --git a/app/(workspace)/layout.tsx b/app/(workspace)/layout.tsx new file mode 100644 index 0000000000..58ebd72e6b --- /dev/null +++ b/app/(workspace)/layout.tsx @@ -0,0 +1,188 @@ +import Providers from './providers' +import Link from 'next/link' +import { NavItem } from './components/nav-item' +import { + Home, + ShoppingCart, + Package, + Users2, + LineChart, + Settings, + PanelLeft, + Package2, +} from 'lucide-react' +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from '@/components/ui/tooltip' +import { Button } from '@/components/ui/button' +import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet' +import { + Breadcrumb, + BreadcrumbItem, + BreadcrumbLink, + BreadcrumbList, + BreadcrumbPage, + BreadcrumbSeparator, +} from '@/components/ui/breadcrumb' +import { SearchInput } from './components/search' +import { User } from './components/user' + +export default function WorkspaceLayout({ + children, +}: { + children: React.ReactNode +}) { + return ( + +
+ +
+
+ + + + +
+
+ {children} +
+
+
+ + ) +} + +function DesktopNav() { + return ( + + ) +} + +function MobileNav() { + return ( + + + + + + + + + ) +} + +function DashboardBreadcrumb() { + return ( + + + + + Dashboard + + + + + + Products + + + + + All Products + + + + ) +} diff --git a/app/(workspace)/providers.tsx b/app/(workspace)/providers.tsx new file mode 100644 index 0000000000..a4fb13d733 --- /dev/null +++ b/app/(workspace)/providers.tsx @@ -0,0 +1,7 @@ +'use client' + +import { TooltipProvider } from '@/components/ui/tooltip' + +export default function Providers({ children }: { children: React.ReactNode }) { + return {children} +} diff --git a/app/(workspace)/workflows/page.tsx b/app/(workspace)/workflows/page.tsx new file mode 100644 index 0000000000..d9bcf868ba --- /dev/null +++ b/app/(workspace)/workflows/page.tsx @@ -0,0 +1,3 @@ +import WorkFlow from './workflows' + +export default WorkFlow diff --git a/app/(workspace)/workflows/workflows.tsx b/app/(workspace)/workflows/workflows.tsx new file mode 100644 index 0000000000..7bdf1de4a3 --- /dev/null +++ b/app/(workspace)/workflows/workflows.tsx @@ -0,0 +1,7 @@ +export default function Workflows() { + return ( +
+

Workflows

+
+ ) +} diff --git a/app/globals.css b/app/globals.css new file mode 100644 index 0000000000..a23ac26b0e --- /dev/null +++ b/app/globals.css @@ -0,0 +1,72 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +body { + font-family: Arial, Helvetica, sans-serif; +} + +@layer base { + :root { + --background: 0 0% 100%; + --foreground: 0 0% 3.9%; + --card: 0 0% 100%; + --card-foreground: 0 0% 3.9%; + --popover: 0 0% 100%; + --popover-foreground: 0 0% 3.9%; + --primary: 0 0% 9%; + --primary-foreground: 0 0% 98%; + --secondary: 0 0% 96.1%; + --secondary-foreground: 0 0% 9%; + --muted: 0 0% 96.1%; + --muted-foreground: 0 0% 45.1%; + --accent: 0 0% 96.1%; + --accent-foreground: 0 0% 9%; + --destructive: 0 84.2% 60.2%; + --destructive-foreground: 0 0% 98%; + --border: 0 0% 89.8%; + --input: 0 0% 89.8%; + --ring: 0 0% 3.9%; + --chart-1: 12 76% 61%; + --chart-2: 173 58% 39%; + --chart-3: 197 37% 24%; + --chart-4: 43 74% 66%; + --chart-5: 27 87% 67%; + --radius: 0.5rem; + } + .dark { + --background: 0 0% 3.9%; + --foreground: 0 0% 98%; + --card: 0 0% 3.9%; + --card-foreground: 0 0% 98%; + --popover: 0 0% 3.9%; + --popover-foreground: 0 0% 98%; + --primary: 0 0% 98%; + --primary-foreground: 0 0% 9%; + --secondary: 0 0% 14.9%; + --secondary-foreground: 0 0% 98%; + --muted: 0 0% 14.9%; + --muted-foreground: 0 0% 63.9%; + --accent: 0 0% 14.9%; + --accent-foreground: 0 0% 98%; + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 0 0% 98%; + --border: 0 0% 14.9%; + --input: 0 0% 14.9%; + --ring: 0 0% 83.1%; + --chart-1: 220 70% 50%; + --chart-2: 160 60% 45%; + --chart-3: 30 80% 55%; + --chart-4: 280 65% 60%; + --chart-5: 340 75% 55%; + } +} + +@layer base { + * { + @apply border-border; + } + body { + @apply bg-background text-foreground; + } +} diff --git a/app/layout.tsx b/app/layout.tsx new file mode 100644 index 0000000000..f7fa87eb87 --- /dev/null +++ b/app/layout.tsx @@ -0,0 +1,34 @@ +import type { Metadata } from "next"; +import { Geist, Geist_Mono } from "next/font/google"; +import "./globals.css"; + +const geistSans = Geist({ + variable: "--font-geist-sans", + subsets: ["latin"], +}); + +const geistMono = Geist_Mono({ + variable: "--font-geist-mono", + subsets: ["latin"], +}); + +export const metadata: Metadata = { + title: "Create Next App", + description: "Generated by create next app", +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + {children} + + + ); +} diff --git a/components.json b/components.json new file mode 100644 index 0000000000..d9ef0ae537 --- /dev/null +++ b/components.json @@ -0,0 +1,21 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": true, + "tsx": true, + "tailwind": { + "config": "tailwind.config.ts", + "css": "app/globals.css", + "baseColor": "neutral", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "lib": "@/lib", + "hooks": "@/hooks" + }, + "iconLibrary": "lucide" +} \ No newline at end of file diff --git a/components/icons.tsx b/components/icons.tsx new file mode 100644 index 0000000000..59c28f3fd6 --- /dev/null +++ b/components/icons.tsx @@ -0,0 +1,126 @@ +export function UsersIcon(props: React.SVGProps) { + return ( + + + + + + + ) +} + +export function SettingsIcon(props: React.SVGProps) { + return ( + + + + + ) +} + +export function SearchIcon(props: React.SVGProps) { + return ( + + + + + ) +} + +export function Spinner() { + return ( +
+ + + + +
+ ) +} + +export function Logo() { + return ( + + + + + ) +} + +export function VercelLogo(props: React.SVGProps) { + return ( + + + + ) +} diff --git a/components/ui/breadcrumb.tsx b/components/ui/breadcrumb.tsx new file mode 100644 index 0000000000..60e6c96f72 --- /dev/null +++ b/components/ui/breadcrumb.tsx @@ -0,0 +1,115 @@ +import * as React from "react" +import { Slot } from "@radix-ui/react-slot" +import { ChevronRight, MoreHorizontal } from "lucide-react" + +import { cn } from "@/lib/utils" + +const Breadcrumb = React.forwardRef< + HTMLElement, + React.ComponentPropsWithoutRef<"nav"> & { + separator?: React.ReactNode + } +>(({ ...props }, ref) =>