feat: add command (#337)

apps/web/src/app/(home)/_components/stack-builder.tsx

@@ -1465,7 +1465,6 @@ const StackBuilder = () => {
 									</button>
 								)}
 								<button
-									id="save-stack-button"
 									type="button"
 									onClick={saveCurrentStack}
 									className="flex items-center gap-1 rounded border border-border bg-background px-2 py-1 text-muted-foreground text-xs transition-colors hover:bg-muted"

apps/web/src/app/(home)/showcase/_components/ShowcaseItem.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { ExternalLink, File, Github, Monitor } from "lucide-react";
-import { motion } from "motion/react";
 import Image from "next/image";
 import Link from "next/link";
 
@@ -24,26 +23,10 @@ export default function ShowcaseItem({
 	tags,
 	index = 0,
 }: ShowcaseItemProps) {
-	const itemVariants = {
-		hidden: { opacity: 0, y: 20 },
-		visible: {
-			opacity: 1,
-			y: 0,
-			transition: {
-				duration: 0.5,
-				ease: "easeOut",
-			},
-		},
-	};
-
 	const projectId = `PROJECT_${String(index + 1).padStart(3, "0")}`;
 
 	return (
-		<motion.div
-			variants={itemVariants}
-			className="terminal-block-hover flex h-full flex-col overflow-hidden rounded border border-border bg-background"
-			style={{ animationDelay: `${index * 100}ms` }}
-		>
+		<div className="terminal-block-hover flex h-full flex-col overflow-hidden rounded border border-border bg-background">
 			<div className="border-border border-b bg-muted/20 px-3 py-2">
 				<div className="flex items-center gap-2">
 					<File className="h-3 w-3 text-primary" />
@@ -137,6 +120,6 @@ export default function ShowcaseItem({
 					</div>
 				</div>
 			</div>
-		</motion.div>
+		</div>
 	);
 }

apps/web/src/app/(home)/showcase/page.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { FolderOpen, Terminal } from "lucide-react";
-import { motion } from "motion/react";
 import Navbar from "../_components/navbar";
 import ShowcaseItem from "./_components/ShowcaseItem";
 
@@ -17,40 +16,12 @@ const showcaseProjects = [
 ];
 
 export default function ShowcasePage() {
-	const containerVariants = {
-		hidden: { opacity: 0 },
-		visible: {
-			opacity: 1,
-			transition: {
-				staggerChildren: 0.1,
-				delayChildren: 0.2,
-			},
-		},
-	};
-
-	const itemVariants = {
-		hidden: { opacity: 0, y: 20 },
-		visible: {
-			opacity: 1,
-			y: 0,
-			transition: {
-				duration: 0.5,
-				ease: "easeOut",
-			},
-		},
-	};
-
 	return (
 		<>
 			<Navbar />
 			<main className="flex min-h-svh flex-col items-center bg-background px-4 pt-24 pb-10 sm:px-6 md:px-8 md:pt-28 lg:pt-32">
-				<motion.div
-					className="mx-auto w-full max-w-6xl"
-					initial="hidden"
-					animate="visible"
-					variants={containerVariants}
-				>
-					<motion.div className="mb-8" variants={itemVariants}>
+				<div className="mx-auto w-full max-w-6xl">
+					<div className="mb-8">
 						<div className="mb-6 flex items-center gap-2">
 							<Terminal className="h-4 w-4 text-primary" />
 							<span className="font-bold font-mono text-lg">
@@ -92,18 +63,15 @@ export default function ShowcasePage() {
 								</div>
 							</div>
 						</div>
-					</motion.div>
+					</div>
 
-					<motion.div
-						className="grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3"
-						variants={containerVariants}
-					>
+					<div className="grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3">
 						{showcaseProjects.map((project, index) => (
 							<ShowcaseItem key={project.title} {...project} index={index} />
 						))}
-					</motion.div>
+					</div>
 
-					<motion.div className="mt-8" variants={itemVariants}>
+					<div className="mt-8">
 						<div className="terminal-block-hover rounded border border-border bg-muted/20 p-4">
 							<div className="flex items-center gap-2 text-sm">
 								<span className="text-primary">$</span>
@@ -119,8 +87,8 @@ export default function ShowcasePage() {
 								</span>
 							</div>
 						</div>
-					</motion.div>
-				</motion.div>
+					</div>
+				</div>
 			</main>
 		</>
 	);