vibefast-cli 0.6.2 → 0.7.1

package/2/apps/web/app/globals.css

@@ -1,122 +0,0 @@
-@import "tailwindcss";
-@import "tw-animate-css";
-
-@custom-variant dark (&:is(.dark *));
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-  --color-sidebar-ring: var(--sidebar-ring);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar: var(--sidebar);
-  --color-chart-5: var(--chart-5);
-  --color-chart-4: var(--chart-4);
-  --color-chart-3: var(--chart-3);
-  --color-chart-2: var(--chart-2);
-  --color-chart-1: var(--chart-1);
-  --color-ring: var(--ring);
-  --color-input: var(--input);
-  --color-border: var(--border);
-  --color-destructive: var(--destructive);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-accent: var(--accent);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-muted: var(--muted);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-secondary: var(--secondary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-primary: var(--primary);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-popover: var(--popover);
-  --color-card-foreground: var(--card-foreground);
-  --color-card: var(--card);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-}
-
-:root {
-  --radius: 0.625rem;
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.145 0 0);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.145 0 0);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.922 0 0);
-  --input: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.205 0 0);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.97 0 0);
-  --sidebar-accent-foreground: oklch(0.205 0 0);
-  --sidebar-border: oklch(0.922 0 0);
-  --sidebar-ring: oklch(0.708 0 0);
-}
-
-.dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.205 0 0);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.205 0 0);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.922 0 0);
-  --primary-foreground: oklch(0.205 0 0);
-  --secondary: oklch(0.269 0 0);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.556 0 0);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.205 0 0);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.269 0 0);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.556 0 0);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}

package/2/apps/web/app/layout.tsx

@@ -1,38 +0,0 @@
-import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
-import { ThemeProvider } from "next-themes";
-import { ConvexProvider } from "@/lib/convex-provider";
-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: "VibeFast Web",
-  description: "VibeFast web application",
-};
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-  return (
-    <html lang="en" suppressHydrationWarning>
-      <body
-        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
-      >
-        <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-          <ConvexProvider>{children}</ConvexProvider>
-        </ThemeProvider>
-      </body>
-    </html>
-  );
-}

package/2/apps/web/app/page.tsx

@@ -1,35 +0,0 @@
-"use client"
-
-import { Layout } from "@/components/Layout";
-import { SignInFormsShowcase } from "@/components/auth/SignInFormsShowcase";
-import { UserMenu } from "@/components/UserMenu";
-import { AdminDashboard } from "@/components/AdminDashboard";
-import { api } from "@vibefast/backend/_generated/api";
-import { Authenticated, Unauthenticated, useQuery } from "convex/react";
-
-export default function Home() {
-  const user = useQuery(api.sharedUsers.viewer);
-  return (
-    <Layout
-      menu={
-        <>
-          <Authenticated>
-            <UserMenu favoriteColor={undefined}>
-              {user?.name ?? user?.email ?? user?.phone ?? "Anonymous"}
-            </UserMenu>
-          </Authenticated>
-          <Unauthenticated>{null}</Unauthenticated>
-        </>
-      }
-    >
-      <>
-        <Authenticated>
-          <AdminDashboard user={user} />
-        </Authenticated>
-        <Unauthenticated>
-          <SignInFormsShowcase />
-        </Unauthenticated>
-      </>
-    </Layout>
-  );
-}

package/2/apps/web/app/users/page.tsx

@@ -1,301 +0,0 @@
-"use client"
-
-import { useMemo, useState } from "react";
-import Link from "next/link";
-import { Layout } from "@/components/Layout";
-import { SignInFormsShowcase } from "@/components/auth/SignInFormsShowcase";
-import { UserMenu } from "@/components/UserMenu";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
-import { api } from "@vibefast/backend/_generated/api";
-import type { FunctionReference, Id } from "@vibefast/backend";
-import {
-  Authenticated,
-  Unauthenticated,
-  useMutation,
-  useQuery,
-} from "convex/react";
-
-const adminListUsersQuery = (
-  api.reportFunctions as unknown as {
-    adminListUsers: FunctionReference<"query", "public", never, AdminUserListResponse>;
-  }
-).adminListUsers;
-
-const adminDeleteUserMutation = (
-  api.reportFunctions as unknown as {
-    adminDeleteUser: FunctionReference<
-      "mutation",
-      "public",
-      { userId: Id<"users"> },
-      boolean
-    >;
-  }
-).adminDeleteUser;
-
-type AdminUserStatus = "premium" | "attention" | "free";
-
-type AdminUserListResponse = {
-  users: Array<{
-    _id: Id<"users">;
-    name: string | null;
-    email: string | null;
-    phone: string | null;
-    credits: number;
-    joinedAt: number | null;
-    verified: boolean;
-    purchaseCount: number;
-    reportCount: number;
-    status: AdminUserStatus;
-    lastPurchaseAt: number | null;
-    recentReport?: {
-      reason: string;
-      status: "open" | "resolved" | "dismissed";
-      reportTimestamp: number;
-    };
-  }>;
-  summaryTime: number;
-};
-
-const statusFilters: Array<{ label: string; value: "all" | AdminUserStatus }> = [
-  { label: "All", value: "all" },
-  { label: "Premium", value: "premium" },
-  { label: "Needs attention", value: "attention" },
-  { label: "Free tier", value: "free" },
-];
-
-const statusBadge: Record<AdminUserStatus, string> = {
-  premium: "bg-emerald-100 text-emerald-700",
-  attention: "bg-amber-100 text-amber-700",
-  free: "bg-muted/80 text-muted-foreground",
-};
-
-const dateFormatter = new Intl.DateTimeFormat("en-US", {
-  month: "short",
-  day: "numeric",
-});
-
-function formatDate(timestamp?: number | null) {
-  if (!timestamp) return "—";
-  return dateFormatter.format(new Date(timestamp));
-}
-
-export default function UsersPage() {
-  const viewer = useQuery(api.sharedUsers.viewer);
-
-  return (
-    <Layout
-      menu={
-        <>
-          <Authenticated>
-            <UserMenu favoriteColor={undefined}>
-              {viewer?.name ?? viewer?.email ?? "Admin"}
-            </UserMenu>
-          </Authenticated>
-          <Unauthenticated>{null}</Unauthenticated>
-        </>
-      }
-    >
-      <>
-        <Authenticated>
-          <UsersConsole />
-        </Authenticated>
-        <Unauthenticated>
-          <SignInFormsShowcase />
-        </Unauthenticated>
-      </>
-    </Layout>
-  );
-}
-
-function UsersConsole() {
-  const summary = useQuery<AdminUserListResponse>(adminListUsersQuery);
-  const deleteUser = useMutation(adminDeleteUserMutation);
-  const [search, setSearch] = useState("");
-  const [statusFilter, setStatusFilter] = useState<"all" | AdminUserStatus>("all");
-  const [selectedUserId, setSelectedUserId] = useState<Id<"users"> | null>(null);
-
-  const filteredUsers = useMemo(() => {
-    if (!summary) return [];
-    const term = search.trim().toLowerCase();
-    return summary.users.filter((user) => {
-      const matchesStatus =
-        statusFilter === "all" || user.status === statusFilter;
-      const values = [
-        user.name,
-        user.email,
-        user.phone,
-        user._id.toString(),
-      ].flatMap((value) => (value ? [value.toLowerCase()] : []));
-      const matchesSearch =
-        term === "" || values.some((value) => value.includes(term));
-      return matchesStatus && matchesSearch;
-    });
-  }, [search, statusFilter, summary]);
-
-  const activeUserId =
-    selectedUserId && filteredUsers.some((user) => user._id === selectedUserId)
-      ? selectedUserId
-      : filteredUsers[0]?._id ?? null;
-  const selectedUser =
-    filteredUsers.find((user) => user._id === activeUserId) ??
-    filteredUsers[0];
-
-  const handleDelete = async () => {
-    if (!selectedUser) return;
-    if (
-      !window.confirm(
-        `Delete ${selectedUser.name ?? selectedUser.email ?? "user"}? This removes their data.`,
-      )
-    ) {
-      return;
-    }
-    await deleteUser({ userId: selectedUser._id });
-    window.location.reload();
-  };
-
-  return (
-    <section className="space-y-8">
-      <div className="rounded-2xl border bg-card/80 p-6 shadow-lg">
-        <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
-          <div>
-            <p className="text-xs font-semibold uppercase tracking-[0.3em] text-muted-foreground">
-              People operations
-            </p>
-            <h1 className="text-2xl font-semibold text-foreground">User directory</h1>
-            <p className="text-sm text-muted-foreground">
-              Filter, inspect, and take action on every VibeFast account. All of the data flows through Convex so you can reuse it across apps.
-            </p>
-          </div>
-          <div className="flex flex-col gap-2">
-            <Input
-              placeholder="Search by name, email, or id"
-              value={search}
-              onChange={(event) => setSearch(event.target.value)}
-            />
-            <Tabs value={statusFilter} onValueChange={(value) => setStatusFilter(value as "all" | AdminUserStatus)}>
-              <TabsList>
-                {statusFilters.map((filter) => (
-                  <TabsTrigger key={filter.value} value={filter.value}>
-                    {filter.label}
-                  </TabsTrigger>
-                ))}
-              </TabsList>
-            </Tabs>
-          </div>
-        </div>
-      </div>
-
-      <div className="grid gap-6 lg:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]">
-        <div className="rounded-2xl border bg-background/60 p-6 shadow-sm">
-          <div className="flex items-center justify-between">
-            <div>
-              <p className="text-sm font-semibold text-foreground">Roster</p>
-              <p className="text-xs text-muted-foreground">
-                Showing {filteredUsers.length} of {summary?.users.length ?? "..."}
-              </p>
-            </div>
-            <p className="text-xs uppercase tracking-[0.3em] text-muted-foreground">
-              Snapshot {summary ? formatDate(summary.summaryTime) : "—"}
-            </p>
-          </div>
-          <div className="mt-4 space-y-2">
-            {filteredUsers.length === 0 && (
-              <p className="text-sm text-muted-foreground">No accounts match this filter.</p>
-            )}
-            {filteredUsers.map((user) => {
-              const isSelected = activeUserId === user._id;
-              return (
-                <button
-                  type="button"
-                  key={user._id.toString()}
-                  onClick={() => setSelectedUserId(user._id)}
-                  className={`flex w-full items-center justify-between rounded-2xl border px-4 py-3 text-left transition hover:border-primary ${
-                    isSelected
-                      ? "border-primary bg-primary/5"
-                      : "border-border/60 bg-card"
-                  }`}
-                >
-                  <div>
-                    <div className="flex items-center gap-2">
-                      <p className="text-sm font-semibold text-foreground">
-                        {user.name ?? "Anonymous"}
-                      </p>
-                      <span
-                        className={`text-[0.65rem] font-semibold uppercase tracking-[0.3em] ${statusBadge[user.status]}`}
-                      >
-                        {user.status}
-                      </span>
-                    </div>
-                    <p className="text-[0.75rem] text-muted-foreground">
-                      {user.email ?? user.phone ?? user._id.toString()}
-                    </p>
-                  </div>
-                  <div className="text-right text-xs font-semibold text-muted-foreground">
-                    <p>{user.credits} credits</p>
-                    <p>{user.purchaseCount} purchases</p>
-                  </div>
-                </button>
-              );
-            })}
-          </div>
-        </div>
-
-        <div className="rounded-2xl border bg-card/60 p-6 shadow-sm">
-          {selectedUser ? (
-            <div className="space-y-5">
-              <div className="flex items-center justify-between">
-                <div>
-                  <p className="text-sm font-semibold text-foreground">User details</p>
-                  <p className="text-xs text-muted-foreground">Track status + feedback</p>
-                </div>
-                <span
-                  className={`rounded-full px-3 py-1 text-[0.65rem] font-semibold uppercase tracking-[0.3em] ${statusBadge[selectedUser.status]}`}
-                >
-                  {selectedUser.status}
-                </span>
-              </div>
-              <div className="grid gap-3 text-sm text-muted-foreground">
-                <p>Name: {selectedUser.name ?? "(Unnamed)"}</p>
-                <p>Email: {selectedUser.email ?? "—"}</p>
-                <p>Phone: {selectedUser.phone ?? "—"}</p>
-                <p>Joined: {formatDate(selectedUser.joinedAt)}</p>
-                <p>Credits: {selectedUser.credits}</p>
-                <p>Purchases: {selectedUser.purchaseCount}</p>
-                <p>Verified: {selectedUser.verified ? "Yes" : "No"}</p>
-                <p>Last purchase: {formatDate(selectedUser.lastPurchaseAt)}</p>
-              </div>
-              <div className="space-y-2 border-t border-border/80 pt-4 text-sm">
-                <p className="text-xs uppercase tracking-[0.3em] text-muted-foreground">Feedback</p>
-                {selectedUser.reportCount === 0 && (
-                  <p className="text-sm text-muted-foreground">No reports yet.</p>
-                )}
-                {selectedUser.reportCount > 0 && (
-                  <div className="space-y-2">
-                    <p className="text-sm font-semibold text-foreground">
-                      {selectedUser.reportCount} report{selectedUser.reportCount > 1 ? "s" : ""}
-                    </p>
-                    {selectedUser.recentReport && (
-                      <p className="text-xs text-muted-foreground">
-                        {selectedUser.recentReport.reason} · {selectedUser.recentReport.status} · {formatDate(selectedUser.recentReport.reportTimestamp)}
-                      </p>
-                    )}
-                  </div>
-                )}
-              </div>
-              <div className="flex flex-wrap items-center gap-3">
-                <Button variant="destructive" size="sm" onClick={handleDelete}>
-                  Delete user
-                </Button>
-                <Link href="/">Back to dashboard</Link>
-              </div>
-            </div>
-          ) : (
-            <p className="text-sm text-muted-foreground">Select a user to view details.</p>
-          )}
-        </div>
-      </div>
-    </section>
-  );
-}