franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(web): update deps

Browse Source
This commit is contained in:
Aman Varshney
2025-08-29 17:04:24 +05:30
parent 33a08d6791
commit 28c4e97477
13 changed files with 232 additions and 494 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/web/next.config.mjs
View File

@@ -5,6 +5,7 @@ const withMDX = createMDX();
/** @type {import('next').NextConfig} */
const config = {
reactStrictMode: true,
typedRoutes: true,
images: {
remotePatterns: [
{ protocol: "https", hostname: "pbs.twimg.com" },

50
apps/web/package.json
View File

@@ -18,27 +18,27 @@
"@better-t-stack/backend": "workspace:*",
"@erquhart/convex-oss-stats": "^0.8.1",
"@number-flow/react": "^0.5.10",
"@opennextjs/cloudflare": "^1.6.3",
"@orama/orama": "^3.1.11",
"@radix-ui/react-dropdown-menu": "^2.1.15",
"@radix-ui/react-hover-card": "^1.1.14",
"babel-plugin-react-compiler": "^19.1.0-rc.2",
"@opennextjs/cloudflare": "^1.6.5",
"@orama/orama": "^3.1.12",
"@radix-ui/react-dropdown-menu": "^2.1.16",
"@radix-ui/react-hover-card": "^1.1.15",
"babel-plugin-react-compiler": "^19.1.0-rc.3",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"convex": "^1.25.4",
"convex": "^1.26.2",
"convex-helpers": "^0.1.104",
"date-fns": "^4.1.0",
"fumadocs-core": "15.6.7",
"fumadocs-mdx": "11.7.3",
"fumadocs-ui": "15.6.7",
"lucide-react": "^0.536.0",
"fumadocs-core": "15.7.5",
"fumadocs-mdx": "11.8.1",
"fumadocs-ui": "15.7.5",
"lucide-react": "^0.542.0",
"motion": "^12.23.12",
"next": "15.3.5",
"next": "15.5.2",
"next-themes": "^0.4.6",
"nuqs": "^2.4.3",
"nuqs": "^2.5.1",
"papaparse": "^5.5.3",
"posthog-js": "^1.258.5",
"radix-ui": "^1.4.2",
"posthog-js": "^1.261.0",
"radix-ui": "^1.4.3",
"react": "^19.1.1",
"react-dom": "^19.1.1",
"react-tweet": "^3.2.2",
@@ -46,23 +46,23 @@
"remark": "^15.0.1",
"remark-gfm": "^4.0.1",
"remark-mdx": "^3.1.0",
"shiki": "^3.9.1",
"sonner": "^2.0.6",
"shiki": "^3.12.0",
"sonner": "^2.0.7",
"tailwind-merge": "^3.3.1"
},
"devDependencies": {
"@tailwindcss/postcss": "^4.1.11",
"@tailwindcss/postcss": "^4.1.12",
"@types/mdx": "^2.0.13",
"@types/node": "24.1.0",
"@types/node": "24.3.0",
"@types/papaparse": "^5.3.16",
"@types/react": "^19.1.9",
"@types/react-dom": "^19.1.7",
"eslint": "^9.32.0",
"eslint-config-next": "15.4.5",
"@types/react": "^19.1.12",
"@types/react-dom": "^19.1.9",
"eslint": "^9.34.0",
"eslint-config-next": "15.5.2",
"postcss": "^8.5.6",
"tailwindcss": "^4.1.11",
"tw-animate-css": "^1.3.6",
"tailwindcss": "^4.1.12",
"tw-animate-css": "^1.3.7",
"typescript": "^5.9.2",
"wrangler": "^4.27.0"
"wrangler": "^4.33.1"
}
}

261
apps/web/src/app/(home)/_components/navbar.tsx
View File

@@ -1,261 +0,0 @@
"use client";
import { Github, Heart, Maximize2, Menu, X } from "lucide-react";
import { AnimatePresence, motion } from "motion/react";
import Image from "next/image";
import Link from "next/link";
import { useEffect, useState } from "react";
import { ThemeToggle } from "@/components/theme-toggle";
import { cn } from "@/lib/utils";
import PackageIcon from "./icons";
export default function Navbar() {
const [scrolled, setScrolled] = useState(false);
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
useEffect(() => {
const handleScroll = () => {
setScrolled(window.scrollY > 10);
};
window.addEventListener("scroll", handleScroll);
handleScroll();
return () => window.removeEventListener("scroll", handleScroll);
}, []);
useEffect(() => {
if (mobileMenuOpen) {
document.body.style.overflow = "hidden";
} else {
document.body.style.overflow = "";
}
return () => {
document.body.style.overflow = "";
};
}, [mobileMenuOpen]);
const closeMobileMenu = () => setMobileMenuOpen(false);
const desktopNavLinks = [
{
href: "/",
label: "Home",
icon: <span className="text-primary">~/</span>,
},
{
href: "https://my-better-t-app-client.pages.dev/",
label: "Demo",
target: "_blank",
},
{ href: "/showcase", label: "Showcase" },
{
href: "/analytics",
label: "Analytics",
},
{ href: "/docs", label: "Docs" },
{
href: "https://www.npmjs.com/package/create-better-t-stack",
label: "NPM",
icon: <PackageIcon pm="npm" className="h-4 w-4" />,
target: "_blank",
},
];
const mobileNavLinks = [
{
href: "/",
label: "Home",
icon: <span className="text-primary">~/</span>,
},
{
href: "https://my-better-t-app-client.pages.dev/",
label: "Demo",
target: "_blank",
},
{ href: "/showcase", label: "Showcase" },
{
href: "/analytics",
label: "Analytics",
},
{ href: "/docs", label: "Docs" },
{
href: "https://www.npmjs.com/package/create-better-t-stack",
label: "NPM",
icon: <PackageIcon pm="npm" className="h-4 w-4" />,
target: "_blank",
},
{
href: "https://www.github.com/AmanVarshney01/create-better-t-stack",
label: "GitHub",
icon: <Github className="size-4" />,
target: "_blank",
},
];
return (
<>
<nav
className={cn(
"fixed top-0 z-[100] w-full transition-all duration-300 ease-in-out",
scrolled
? "border- border-border shadow-sm backdrop-blur-md"
: "border-transparent border-b bg-transparent",
)}
>
<div className="mx-auto flex h-16 items-center justify-between px-4 sm:px-6 lg:px-8">
<Link href="/" className="flex flex-shrink-0 items-center gap-2">
<Image
src="/logo.svg"
alt="Better-T Stack"
width={32}
height={32}
unoptimized
/>
<span className="hidden font-semibold text-foreground text-md sm:inline-block">
Better-T Stack
</span>
</Link>
<div className="hidden items-center gap-4 lg:flex">
<div className="flex items-center gap-1">
{desktopNavLinks.map((link) => (
<Link
key={link.href}
href={link.href}
target={link.target}
className="relative flex items-center gap-1.5 rounded-md px-3 py-1.5 text-muted-foreground text-sm transition-colors hover:bg-muted hover:text-primary"
>
{link.icon}
<span>{link.label}</span>
</Link>
))}
</div>
<div className="h-5 w-px bg-border" />
<div className="flex items-center gap-2">
<Link
href="https://github.com/sponsors/AmanVarshney01"
target="_blank"
className="inline-flex items-center gap-1.5 rounded-md border border-border bg-muted/90 px-3 py-1.5 text-muted-foreground text-xs backdrop-blur-sm transition-colors hover:bg-muted hover:text-foreground"
title="Sponsor on GitHub"
>
<Heart className="size-3.5" />
Sponsor
</Link>
<Link
href="/new"
className="inline-flex items-center gap-1.5 rounded-md border border-primary/50 bg-primary/10 px-3 py-1.5 text-primary text-xs transition-colors hover:bg-primary/20"
title="Stack Builder"
>
<Maximize2 className="size-3.5" />
Builder
</Link>
</div>
<ThemeToggle />
</div>
<div className="flex items-center gap-2 lg:hidden">
<ThemeToggle />
<button
type="button"
onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
className="flex items-center justify-center rounded-md p-1.5 text-foreground transition-colors hover:bg-muted"
aria-expanded={mobileMenuOpen}
aria-label="Toggle menu"
>
{mobileMenuOpen ? (
<X className="size-5" />
) : (
<Menu className="size-5" />
)}
</button>
</div>
</div>
</nav>
<AnimatePresence>
{mobileMenuOpen && (
<>
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
transition={{ duration: 0.2, ease: "easeInOut" }}
className="fixed inset-0 z-[98 backdrop-blur-sm lg:hidden"
onClick={closeMobileMenu}
aria-hidden="true"
/>
<motion.div
initial={{ x: "100%" }}
animate={{ x: 0 }}
exit={{ x: "100%" }}
transition={{ type: "spring", stiffness: 300, damping: 30 }}
className="fixed top-0 right-0 bottom-0 z-[99] h-full w-full max-w-xs overflow-y-auto border-border border-l shadow-lg lg:hidden"
aria-modal="true"
>
<div className="flex h-16 items-center justify-between border-border border-b px-4">
<span className="font-semibold text-foreground text-md">
Navigation
</span>
<button
type="button"
onClick={closeMobileMenu}
className="rounded-md p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
aria-label="Close menu"
>
<X className="size-5" />
</button>
</div>
<div className="flex flex-col p-4">
<nav className="flex flex-col space-y-1">
{mobileNavLinks.map((link) => (
<Link
key={link.href}
href={link.href}
target={link.target}
onClick={closeMobileMenu}
className="flex items-center gap-3 rounded-md px-3 py-3 text-base text-muted-foreground transition-colors hover:bg-muted hover:text-primary"
>
{link.icon ? (
<span className="flex w-5 items-center justify-center">
{link.icon}
</span>
) : (
<span className="w-5" />
)}
<span>{link.label}</span>
</Link>
))}
</nav>
<div className="mt-6 space-y-3 border-border border-t pt-6">
<Link
href="/new"
onClick={closeMobileMenu}
className="flex w-full items-center justify-center gap-2 rounded-md border border-primary/50 bg-primary/10 px-4 py-2.5 text-primary text-sm transition-colors hover:bg-primary/20"
>
<Maximize2 className="size-4" />
Stack Builder
</Link>
<Link
href="https://github.com/sponsors/AmanVarshney01"
target="_blank"
onClick={closeMobileMenu}
className="flex w-full items-center justify-center gap-2 rounded-md border border-border bg-muted/90 px-4 py-2.5 text-muted-foreground text-sm backdrop-blur-sm transition-colors hover:bg-muted hover:text-foreground"
>
<Heart className="size-4" />
Sponsor on GitHub
</Link>
</div>
</div>
</motion.div>
</>
)}
</AnimatePresence>
</>
);
}

2
apps/web/src/app/(home)/page.tsx
View File

@@ -1,3 +1,5 @@
export const dynamic = "force-static";
import { api } from "@better-t-stack/backend/convex/_generated/api";
import { fetchQuery } from "convex/nextjs";
import CommandSection from "./_components/command-section";

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

@@ -1,19 +1,10 @@
"use client";
import { ExternalLink, File, Github, Monitor } from "lucide-react";
import type { Route } from "next";
import Image from "next/image";
import Link from "next/link";
export interface ShowcaseItemProps {
title: string;
description: string;
imageUrl: string;
liveUrl?: string;
sourceUrl?: string;
tags: string[];
index?: number;
}
export default function ShowcaseItem({
title,
description,
@@ -22,7 +13,15 @@ export default function ShowcaseItem({
sourceUrl,
tags,
index = 0,
}: ShowcaseItemProps) {
}: {
title: string;
description: string;
imageUrl: string;
liveUrl?: string;
sourceUrl?: string;
tags: string[];
index?: number;
}) {
const projectId = `PROJECT_${String(index + 1).padStart(3, "0")}`;
return (
@@ -78,7 +77,7 @@ export default function ShowcaseItem({
<div className="grid gap-2">
{liveUrl && (
<Link
href={liveUrl}
href={liveUrl as Route}
target="_blank"
rel="noopener noreferrer"
className="flex items-center gap-2 rounded border border-border bg-primary/10 px-3 py-2 text-primary text-sm transition-all hover:bg-primary/20 hover:text-primary"
@@ -90,7 +89,7 @@ export default function ShowcaseItem({
)}
{sourceUrl && (
<Link
href={sourceUrl}
href={sourceUrl as Route}
target="_blank"
rel="noopener noreferrer"
className="flex items-center gap-2 rounded border border-border px-3 py-2 text-muted-foreground text-sm transition-all hover:bg-muted/40 hover:text-foreground"

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

@@ -1,3 +1,5 @@
export const dynamic = "force-static";
import { api } from "@better-t-stack/backend/convex/_generated/api";
import { fetchQuery } from "convex/nextjs";
import ShowcasePage from "./_components/showcase-page";

24
apps/web/src/components/ui/button.tsx
View File

@@ -1,6 +1,6 @@
import { cva, type VariantProps } from "class-variance-authority";
import { Slot as SlotPrimitive } from "radix-ui";
import type * as React from "react";
import * as React from "react";
import { cn } from "@/lib/utils";
@@ -35,25 +35,25 @@ const buttonVariants = cva(
},
);
function Button({
className,
variant,
size,
asChild = false,
...props
}: React.ComponentProps<"button"> &
VariantProps<typeof buttonVariants> & {
asChild?: boolean;
}) {
const Button = React.forwardRef<
HTMLButtonElement,
React.ComponentProps<"button"> &
VariantProps<typeof buttonVariants> & {
asChild?: boolean;
}
>(({ className, variant, size, asChild = false, ...props }, ref) => {
const Comp = asChild ? SlotPrimitive.Slot : "button";
return (
<Comp
data-slot="button"
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
{...props}
/>
);
}
});
Button.displayName = "Button";
export { Button, buttonVariants };

2
apps/web/src/components/ui/chart.tsx
View File

@@ -80,7 +80,7 @@ const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
return (
<style
// biome-ignore lint/security/noDangerouslySetInnerHtml: This is safe as we control the content.
// biome-ignore lint/security/noDangerouslySetInnerHtml: its fine
dangerouslySetInnerHTML={{
__html: Object.entries(THEMES)
.map(

21
apps/web/src/components/ui/dialog.tsx
View File

@@ -1,7 +1,8 @@
"use client";
import * as DialogPrimitive from "@radix-ui/react-dialog";
import { XIcon } from "lucide-react";
import { Dialog as DialogPrimitive } from "radix-ui";
import type * as React from "react";
import { cn } from "@/lib/utils";
@@ -48,8 +49,11 @@ function DialogOverlay({
function DialogContent({
className,
children,
showCloseButton = true,
...props
}: React.ComponentProps<typeof DialogPrimitive.Content>) {
}: React.ComponentProps<typeof DialogPrimitive.Content> & {
showCloseButton?: boolean;
}) {
return (
<DialogPortal data-slot="dialog-portal">
<DialogOverlay />
@@ -62,10 +66,15 @@ function DialogContent({
{...props}
>
{children}
<DialogPrimitive.Close className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0">
<XIcon />
<span className="sr-only">Close</span>
</DialogPrimitive.Close>
{showCloseButton && (
<DialogPrimitive.Close
data-slot="dialog-close"
className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0"
>
<XIcon />
<span className="sr-only">Close</span>
</DialogPrimitive.Close>
)}
</DialogPrimitive.Content>
</DialogPortal>
);

2
apps/web/src/components/ui/scroll-area.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { ScrollArea as ScrollAreaPrimitive } from "radix-ui";
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
import type * as React from "react";
import { cn } from "@/lib/utils";

2
apps/web/src/components/ui/switch.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { Switch as SwitchPrimitive } from "radix-ui";
import * as SwitchPrimitive from "@radix-ui/react-switch";
import type * as React from "react";
import { cn } from "@/lib/utils";

2
apps/web/src/components/ui/tooltip.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { Tooltip as TooltipPrimitive } from "radix-ui";
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
import type * as React from "react";
import { cn } from "@/lib/utils";