diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx index e69de29..0c20393 100644 --- a/app/dashboard/page.tsx +++ b/app/dashboard/page.tsx @@ -0,0 +1,29 @@ +import AppCard from "@/components/app-card"; + +export default function Dashboard() { + const mockService = { + id: crypto.randomUUID(), + name: "Redis", + address: "127.0.0.1:6379", + }; + + const mockServiceDesc = { + id: crypto.randomUUID(), + name: "Postgres", + address: "127.0.0.1:5432", + description: "An disk-based database, with full modularity.", + }; + + return ( +
+ {/* Heading */} +
+

Dashboard

+
+
+ + +
+
+ ); +} diff --git a/app/scripts/page.tsx b/app/scripts/page.tsx new file mode 100644 index 0000000..dfb0886 --- /dev/null +++ b/app/scripts/page.tsx @@ -0,0 +1,3 @@ +export default function ScriptPage() { + return

Script Page

; +} diff --git a/app/ssh/page.tsx b/app/ssh/page.tsx new file mode 100644 index 0000000..0420409 --- /dev/null +++ b/app/ssh/page.tsx @@ -0,0 +1,3 @@ +export default function SSHPage() { + return

SSH Page

; +} diff --git a/app/write/page.tsx b/app/write/page.tsx new file mode 100644 index 0000000..76e80ee --- /dev/null +++ b/app/write/page.tsx @@ -0,0 +1,3 @@ +export default function WritePage() { + return

Write Page

; +} diff --git a/bun.lock b/bun.lock index 3aa4972..1ec00e2 100644 --- a/bun.lock +++ b/bun.lock @@ -10,6 +10,7 @@ "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "lucide-react": "^1.21.0", + "motion": "^12.42.0", "next": "16.2.9", "radix-ui": "^1.6.0", "react": "19.2.4", @@ -577,6 +578,8 @@ "forwarded": ["forwarded@0.2.0", "", {}, "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow=="], + "framer-motion": ["framer-motion@12.42.0", "", { "dependencies": { "motion-dom": "^12.42.0", "motion-utils": "^12.39.0", "tslib": "^2.4.0" }, "peerDependencies": { "@emotion/is-prop-valid": "*", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@emotion/is-prop-valid", "react", "react-dom"] }, "sha512-wp7EJnfWaaEScVygKv3e20udoRz+LbtxScsuTkakAxfXmt+ReC6WyPW2nINRAGvd+hG9odwcjBLyOTPjH5pBRA=="], + "fresh": ["fresh@2.0.0", "", {}, "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A=="], "fs-extra": ["fs-extra@11.3.5", "", { "dependencies": { "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", "universalify": "^2.0.0" } }, "sha512-eKpRKAovdpZtR1WopLHxlBWvAgPny3c4gX1G5Jhwmmw4XJj0ifSD5qB5TOo8hmA0wlRKDAOAhEE1yVPgs6Fgcg=="], @@ -741,6 +744,12 @@ "minimist": ["minimist@1.2.8", "", {}, "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="], + "motion": ["motion@12.42.0", "", { "dependencies": { "framer-motion": "^12.42.0", "tslib": "^2.4.0" }, "peerDependencies": { "@emotion/is-prop-valid": "*", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@emotion/is-prop-valid", "react", "react-dom"] }, "sha512-Qhwvu9sVl5/URSq5CNzwMCpSKK8Uhnrwb6VO977kZyj/wOCS7mWebJUnBoHx5cZU1Zv8a9BD5CSICWKAlrLJgA=="], + + "motion-dom": ["motion-dom@12.42.0", "", { "dependencies": { "motion-utils": "^12.39.0" } }, "sha512-M63h4n8R+quJdNhBwuLlgxM+OLYa9+I/T2pzDRboB9fLXRdbou+Gw7Zury+SkpaCyACP1JHSjHgZ1EgTkBr30w=="], + + "motion-utils": ["motion-utils@12.39.0", "", {}, "sha512-8nadJAJjTtqRkmRF36FoJTrywK9nnFmnPwnSMyxaOCU7GDjN9RTMJIxx9De8ErM+vpPhMccr/6fo5WciyQLnMQ=="], + "ms": ["ms@2.1.3", "", {}, "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="], "nanoid": ["nanoid@3.3.15", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-y7Wygv/7mEOvxTuEQDB8StXdMRBWf1kR/tlhAzBRUFkB2jfcLOAxO/SHmOO2zgz1pVgK29/kyupn059/bCHdjA=="], diff --git a/components/action-menu.tsx b/components/action-menu.tsx new file mode 100644 index 0000000..46ba12e --- /dev/null +++ b/components/action-menu.tsx @@ -0,0 +1,83 @@ +import { Terminal, Pencil, FileTerminal } from "lucide-react"; +import { motion } from "motion/react"; + +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from "@/components/ui/tooltip"; + +type Props = { + id: string; +}; + +export default function ActionMenu({ id }: Props) { + const buttonClass = + "flex h-8 w-8 items-center justify-center rounded-lg text-muted-foreground transition-all duration-150 hover:bg-green-50 hover:text-green-600 active:scale-95"; + return ( + + +
+ + + + + +

SSH

+ + + + + + + + +

Create Blog

+ + + + + + + + +

Run Scripts

+ + +
+ + + ); +} diff --git a/components/app-card.tsx b/components/app-card.tsx new file mode 100644 index 0000000..3796a63 --- /dev/null +++ b/components/app-card.tsx @@ -0,0 +1,87 @@ +"use client"; + +import { motion, AnimatePresence } from "motion/react"; +import { useState } from "react"; +import ActionMenu from "./action-menu"; + +type App = { + id: string; + name: string; + description?: string; + address: string; + ssh_addr?: string; +}; + +interface Props { + app: App; +} + +export default function AppCard({ app }: Props) { + let pingStatus = true; + + const [hovered, setHovered] = useState(false); + + return ( +
setHovered(true)} + onMouseLeave={() => setHovered(false)} + className={` + relative + rounded-2xl + bg-gray-100 + p-3 + ${hovered && "border bg-white"} + transition-all + duration-200 + `} + > +
+
+
+
+
+
+ +

{app.name}

+ + {app.address} + + {/* + {hovered && ( + + {app.description && {app.description}} + + + )} + */} + + + {hovered && ( + + {app.description && ( + + {app.description} + + )} + + + )} + +
+ ); +} diff --git a/components/nav-main.tsx b/components/nav-main.tsx index 080d731..876e18e 100644 --- a/components/nav-main.tsx +++ b/components/nav-main.tsx @@ -1,10 +1,5 @@ "use client"; -import { - Collapsible, - CollapsibleContent, - CollapsibleTrigger, -} from "@/components/ui/collapsible"; import { SidebarGroup, SidebarGroupLabel, @@ -12,6 +7,7 @@ import { SidebarMenuButton, SidebarMenuItem, } from "@/components/ui/sidebar"; +import Link from "next/link"; export function NavMain({ items, @@ -25,18 +21,24 @@ export function NavMain({ }) { return ( - Platform + Aperture {items.map((item) => ( - - - {item.icon} - {item.title} - - + + + + {item.icon} + {item.title} + + + ))} diff --git a/components/sidebar.tsx b/components/sidebar.tsx index a783210..006606e 100644 --- a/components/sidebar.tsx +++ b/components/sidebar.tsx @@ -19,7 +19,7 @@ export default function Sidebar({ children }: Props) {
-
{children}
+
{children}
); diff --git a/package.json b/package.json index cf55719..1cebec1 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "lucide-react": "^1.21.0", + "motion": "^12.42.0", "next": "16.2.9", "radix-ui": "^1.6.0", "react": "19.2.4",