@tscircuit/fake-snippets 0.0.121 → 0.0.122

package/src/components/preview/PackageReleasesDashboard.tsx

@@ -1,228 +0,0 @@
-import { Button } from "@/components/ui/button"
-import { Badge } from "@/components/ui/badge"
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu"
-import { MoreHorizontal, Clock, GitBranch, Eye } from "lucide-react"
-import { GitHubLogoIcon } from "@radix-ui/react-icons"
-import { BuildsList } from "./BuildsList"
-import Header from "../Header"
-import { formatTimeAgo } from "@/lib/utils/formatTimeAgo"
-import { getBuildStatus } from "."
-import { Link } from "wouter"
-import { PackageBreadcrumb } from "../PackageBreadcrumb"
-import {
-  Package,
-  PackageBuild,
-  PackageRelease,
-} from "fake-snippets-api/lib/db/schema"
-import { useDownloadZip } from "@/hooks/use-download-zip"
-import { useToast } from "@/hooks/use-toast"
-import { usePackageFiles } from "@/hooks/use-package-files"
-
-export const PackageReleasesDashboard = ({
-  latestRelease,
-  latestBuild,
-  pkg,
-}: {
-  latestRelease: PackageRelease
-  latestBuild: PackageBuild | null
-  pkg: Package
-}) => {
-  const { status, label } = getBuildStatus(latestBuild)
-  const { toastLibrary } = useToast()
-  const { downloadZip } = useDownloadZip()
-  const { data: packageFiles } = usePackageFiles(
-    latestRelease.package_release_id,
-  )
-  const handleDownloadZip = () => {
-    if (pkg && packageFiles) {
-      toastLibrary.promise(downloadZip(pkg, packageFiles ?? []), {
-        loading: "Downloading ZIP...",
-        success: "ZIP downloaded successfully!",
-        error: "Failed to download ZIP",
-      })
-    }
-  }
-  return (
-    <>
-      <Header />
-      <div className="min-h-screen bg-white">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-4">
-          <PackageBreadcrumb
-            author={pkg.name.split("/")[0]}
-            packageName={pkg.name}
-            unscopedName={pkg.unscoped_name}
-            currentPage="releases"
-          />
-        </div>
-        {/* Project Header */}
-        <div className="bg-gray-50 border-b md:py-10">
-          <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
-            <div className="flex flex-col md:justify-between md:flex-row lg:items-center lg:justify-between gap-6">
-              <div className="flex flex-col md:flex-row md:items-center gap-4">
-                <div className="w-12 hidden md:block h-12 rounded-lg overflow-hidden flex-shrink-0">
-                  <img
-                    src="https://github.com/tscircuit.png"
-                    alt="tscircuit logo"
-                    className="w-full h-full object-cover"
-                  />
-                </div>
-                <div className="min-w-0 flex-1">
-                  <div className="flex flex-col sm:flex-row sm:items-center gap-3">
-                    <Link
-                      href={"/" + pkg.name}
-                      className="text-2xl font-bold text-gray-900 truncate"
-                    >
-                      {pkg.name}
-                    </Link>
-                    <Badge
-                      variant={
-                        status === "success"
-                          ? "default"
-                          : status === "error"
-                            ? "destructive"
-                            : "secondary"
-                      }
-                      className="flex items-center gap-1 w-fit"
-                    >
-                      <div
-                        className={`w-2 h-2 rounded-full ${
-                          status === "success"
-                            ? "bg-green-500"
-                            : status === "error"
-                              ? "bg-red-500"
-                              : status === "building"
-                                ? "bg-blue-500 animate-pulse"
-                                : "bg-gray-500"
-                        }`}
-                      />
-                      {label}
-                    </Badge>
-                  </div>
-                  <div className="flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4 mt-2 text-sm text-gray-600">
-                    <div
-                      className={`flex items-center gap-1 ${pkg.github_repo_full_name ? "cursor-pointer" : ""}`}
-                      onClick={() =>
-                        pkg.github_repo_full_name &&
-                        window?.open(
-                          `https://github.com/${pkg.github_repo_full_name}/tree/${latestRelease?.branch_name || "main"}`,
-                          "_blank",
-                        )
-                      }
-                    >
-                      <GitBranch className="w-4 h-4 flex-shrink-0" />
-                      <span className="truncate">
-                        {latestRelease?.branch_name || "main"}
-                      </span>
-                    </div>
-                    <div className="flex items-center gap-1">
-                      <Clock className="w-4 h-4 flex-shrink-0" />
-                      <span>
-                        {latestBuild?.created_at ? (
-                          <time dateTime={latestBuild.created_at}>
-                            Last built {formatTimeAgo(latestBuild.created_at)}
-                          </time>
-                        ) : (
-                          "No builds yet"
-                        )}
-                      </span>
-                    </div>
-                  </div>
-                </div>
-              </div>
-
-              <div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-2">
-                {pkg.github_repo_full_name && (
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    className="flex items-center gap-2 justify-center min-w-[120px] h-9"
-                    onClick={() =>
-                      window.open(
-                        `https://github.com/${pkg.github_repo_full_name}`,
-                        "_blank",
-                      )
-                    }
-                  >
-                    <GitHubLogoIcon className="w-4 h-4" />
-                    <span className="hidden sm:inline">Repository</span>
-                    <span className="sm:hidden">Repository</span>
-                  </Button>
-                )}
-                {latestBuild && status !== "error" && (
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    className="flex items-center gap-2 justify-center min-w-[120px] h-9"
-                    onClick={() =>
-                      window.open(
-                        `/${pkg.name}/releases/${latestBuild?.package_release_id}/preview`,
-                        "_blank",
-                      )
-                    }
-                  >
-                    <Eye className="w-4 h-4" />
-                    <span className="hidden sm:inline">Preview</span>
-                    <span className="sm:hidden">Preview</span>
-                  </Button>
-                )}
-                <DropdownMenu>
-                  <DropdownMenuTrigger asChild>
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      className="w-full h-9 sm:w-9 p-0"
-                    >
-                      <MoreHorizontal className="w-4 h-4" />
-                    </Button>
-                  </DropdownMenuTrigger>
-                  <DropdownMenuContent align="end" className="ml-2">
-                    {pkg.github_repo_full_name && (
-                      <DropdownMenuItem asChild>
-                        <a
-                          href={`https://github.com/${pkg.github_repo_full_name}`}
-                          target="_blank"
-                          rel="noopener noreferrer"
-                        >
-                          View Source
-                        </a>
-                      </DropdownMenuItem>
-                    )}
-                    <DropdownMenuItem asChild onClick={handleDownloadZip}>
-                      <span>Download Zip</span>
-                    </DropdownMenuItem>
-                    <DropdownMenuItem
-                      onClick={() => {
-                        if (navigator.share) {
-                          navigator.share({
-                            title: pkg.unscoped_name,
-                            url: window.location.href,
-                          })
-                        } else {
-                          navigator.clipboard.writeText(window.location.href)
-                        }
-                      }}
-                    >
-                      Share Project
-                    </DropdownMenuItem>
-                  </DropdownMenuContent>
-                </DropdownMenu>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Main Content */}
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
-          <div className="space-y-6">
-            <BuildsList pkg={pkg} />
-          </div>
-        </div>
-      </div>
-    </>
-  )
-}

package/src/components/preview/index.tsx

@@ -1,54 +0,0 @@
-export { ConnectedRepoOverview } from "./ConnectedRepoOverview"
-export { BuildsList } from "./BuildsList"
-export { PackageReleasesDashboard } from "./PackageReleasesDashboard"
-import { PackageBuild } from "fake-snippets-api/lib/db/schema"
-import { Clock, CheckCircle, AlertCircle, Loader2 } from "lucide-react"
-export const getBuildStatus = (
-  build?: PackageBuild | null,
-): {
-  status: "pending" | "building" | "success" | "error" | "queued"
-  label: string
-} => {
-  if (!build) {
-    return { status: "pending", label: "No builds" }
-  }
-  if (
-    build?.build_error ||
-    build?.transpilation_error ||
-    build?.circuit_json_build_error
-  ) {
-    return { status: "error", label: "Failed" }
-  }
-  if (
-    build?.build_in_progress ||
-    build?.transpilation_in_progress ||
-    build?.circuit_json_build_in_progress
-  ) {
-    return { status: "building", label: "Building" }
-  }
-  if (
-    !build?.build_error &&
-    !build?.transpilation_error &&
-    !build?.circuit_json_build_error &&
-    !build?.build_in_progress &&
-    !build?.transpilation_in_progress &&
-    !build?.circuit_json_build_in_progress &&
-    build?.transpilation_completed_at
-  ) {
-    return { status: "success", label: "Ready" }
-  }
-  return { status: "queued", label: "Queued" }
-}
-
-export const StatusIcon = ({ status }: { status: string }) => {
-  switch (status) {
-    case "success":
-      return <CheckCircle className="w-4 h-4 text-green-500" />
-    case "error":
-      return <AlertCircle className="w-4 h-4 text-red-500" />
-    case "building":
-      return <Loader2 className="w-4 h-4 text-blue-500 animate-spin" />
-    default:
-      return <Clock className="w-4 h-4 text-gray-500" />
-  }
-}

package/src/components/ui/accordion.tsx

@@ -1,55 +0,0 @@
-import * as React from "react"
-import * as AccordionPrimitive from "@radix-ui/react-accordion"
-import { ChevronDownIcon } from "@radix-ui/react-icons"
-
-import { cn } from "@/lib/utils"
-
-const Accordion = AccordionPrimitive.Root
-
-const AccordionItem = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
->(({ className, ...props }, ref) => (
-  <AccordionPrimitive.Item
-    ref={ref}
-    className={cn("border-b", className)}
-    {...props}
-  />
-))
-AccordionItem.displayName = "AccordionItem"
-
-const AccordionTrigger = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
->(({ className, children, ...props }, ref) => (
-  <AccordionPrimitive.Header className="flex">
-    <AccordionPrimitive.Trigger
-      ref={ref}
-      className={cn(
-        "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
-        className,
-      )}
-      {...props}
-    >
-      {children}
-      <ChevronDownIcon className="h-4 w-4 shrink-0 text-slate-500 transition-transform duration-200 dark:text-slate-400" />
-    </AccordionPrimitive.Trigger>
-  </AccordionPrimitive.Header>
-))
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
-
-const AccordionContent = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
->(({ className, children, ...props }, ref) => (
-  <AccordionPrimitive.Content
-    ref={ref}
-    className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
-    {...props}
-  >
-    <div className={cn("pb-4 pt-0", className)}>{children}</div>
-  </AccordionPrimitive.Content>
-))
-AccordionContent.displayName = AccordionPrimitive.Content.displayName
-
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }

package/src/components/ui/alert-dialog.tsx

@@ -1,139 +0,0 @@
-import * as React from "react"
-import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"
-
-import { cn } from "@/lib/utils"
-import { buttonVariants } from "@/components/ui/button"
-
-const AlertDialog = AlertDialogPrimitive.Root
-
-const AlertDialogTrigger = AlertDialogPrimitive.Trigger
-
-const AlertDialogPortal = AlertDialogPrimitive.Portal
-
-const AlertDialogOverlay = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Overlay
-    className={cn(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className,
-    )}
-    {...props}
-    ref={ref}
-  />
-))
-AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName
-
-const AlertDialogContent = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <AlertDialogPortal>
-    <AlertDialogOverlay />
-    <AlertDialogPrimitive.Content
-      ref={ref}
-      className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-slate-200 bg-white p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-slate-800 dark:bg-slate-950",
-        className,
-      )}
-      {...props}
-    />
-  </AlertDialogPortal>
-))
-AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName
-
-const AlertDialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className,
-    )}
-    {...props}
-  />
-)
-AlertDialogHeader.displayName = "AlertDialogHeader"
-
-const AlertDialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className,
-    )}
-    {...props}
-  />
-)
-AlertDialogFooter.displayName = "AlertDialogFooter"
-
-const AlertDialogTitle = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Title
-    ref={ref}
-    className={cn("text-lg font-semibold", className)}
-    {...props}
-  />
-))
-AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName
-
-const AlertDialogDescription = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Description
-    ref={ref}
-    className={cn("text-sm text-slate-500 dark:text-slate-400", className)}
-    {...props}
-  />
-))
-AlertDialogDescription.displayName =
-  AlertDialogPrimitive.Description.displayName
-
-const AlertDialogAction = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Action>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Action
-    ref={ref}
-    className={cn(buttonVariants(), className)}
-    {...props}
-  />
-))
-AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName
-
-const AlertDialogCancel = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Cancel>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Cancel
-    ref={ref}
-    className={cn(
-      buttonVariants({ variant: "outline" }),
-      "mt-2 sm:mt-0",
-      className,
-    )}
-    {...props}
-  />
-))
-AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName
-
-export {
-  AlertDialog,
-  AlertDialogPortal,
-  AlertDialogOverlay,
-  AlertDialogTrigger,
-  AlertDialogContent,
-  AlertDialogHeader,
-  AlertDialogFooter,
-  AlertDialogTitle,
-  AlertDialogDescription,
-  AlertDialogAction,
-  AlertDialogCancel,
-}

package/src/components/ui/alert.tsx

@@ -1,59 +0,0 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "@/lib/utils"
-
-const alertVariants = cva(
-  "relative w-full rounded-lg border border-slate-200 px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-slate-950 [&>svg~*]:pl-7 dark:border-slate-800 dark:[&>svg]:text-slate-50",
-  {
-    variants: {
-      variant: {
-        default: "bg-white text-slate-950 dark:bg-slate-950 dark:text-slate-50",
-        destructive:
-          "border-red-500/50 text-red-500 dark:border-red-500 [&>svg]:text-red-500 dark:border-red-900/50 dark:text-red-900 dark:dark:border-red-900 dark:[&>svg]:text-red-900",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  },
-)
-
-const Alert = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
->(({ className, variant, ...props }, ref) => (
-  <div
-    ref={ref}
-    role="alert"
-    className={cn(alertVariants({ variant }), className)}
-    {...props}
-  />
-))
-Alert.displayName = "Alert"
-
-const AlertTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h5
-    ref={ref}
-    className={cn("mb-1 font-medium leading-none tracking-tight", className)}
-    {...props}
-  />
-))
-AlertTitle.displayName = "AlertTitle"
-
-const AlertDescription = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("text-sm [&_p]:leading-relaxed", className)}
-    {...props}
-  />
-))
-AlertDescription.displayName = "AlertDescription"
-
-export { Alert, AlertTitle, AlertDescription }

package/src/components/ui/aspect-ratio.tsx

@@ -1,5 +0,0 @@
-import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio"
-
-const AspectRatio = AspectRatioPrimitive.Root
-
-export { AspectRatio }

package/src/components/ui/avatar.tsx

@@ -1,48 +0,0 @@
-import * as React from "react"
-import * as AvatarPrimitive from "@radix-ui/react-avatar"
-
-import { cn } from "@/lib/utils"
-
-const Avatar = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Root
-    ref={ref}
-    className={cn(
-      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
-      className,
-    )}
-    {...props}
-  />
-))
-Avatar.displayName = AvatarPrimitive.Root.displayName
-
-const AvatarImage = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Image>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Image
-    ref={ref}
-    className={cn("aspect-square h-full w-full", className)}
-    {...props}
-  />
-))
-AvatarImage.displayName = AvatarPrimitive.Image.displayName
-
-const AvatarFallback = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Fallback>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Fallback
-    ref={ref}
-    className={cn(
-      "flex h-full w-full items-center justify-center rounded-full bg-slate-100 dark:bg-slate-800",
-      className,
-    )}
-    {...props}
-  />
-))
-AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName
-
-export { Avatar, AvatarImage, AvatarFallback }

package/src/components/ui/badge.tsx

@@ -1,36 +0,0 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "@/lib/utils"
-
-const badgeVariants = cva(
-  "inline-flex items-center rounded-md border border-slate-200 px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-slate-950 focus:ring-offset-2 dark:border-slate-800 dark:focus:ring-slate-300",
-  {
-    variants: {
-      variant: {
-        default:
-          "border-transparent bg-slate-900 text-slate-50 shadow hover:bg-slate-900/80 dark:bg-slate-50 dark:text-slate-900 dark:hover:bg-slate-50/80",
-        secondary:
-          "border-transparent bg-slate-100 text-slate-900 hover:bg-slate-100/80 dark:bg-slate-800 dark:text-slate-50 dark:hover:bg-slate-800/80",
-        destructive:
-          "border-transparent bg-red-500 text-slate-50 shadow hover:bg-red-500/80 dark:bg-red-900 dark:text-slate-50 dark:hover:bg-red-900/80",
-        outline: "text-slate-950 dark:text-slate-50",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  },
-)
-
-export interface BadgeProps
-  extends React.HTMLAttributes<HTMLDivElement>,
-    VariantProps<typeof badgeVariants> {}
-
-function Badge({ className, variant, ...props }: BadgeProps) {
-  return (
-    <div className={cn(badgeVariants({ variant }), className)} {...props} />
-  )
-}
-
-export { Badge, badgeVariants }