@tscircuit/fake-snippets 0.0.107 → 0.0.109

package/src/components/ShippingInformationForm.tsx

@@ -1,423 +0,0 @@
-import React, { useReducer, useEffect, useState } from "react"
-import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
-import { useToast } from "@/hooks/use-toast"
-import { useAxios } from "@/hooks/use-axios"
-import { useQuery, useMutation, useQueryClient } from "react-query"
-import { Loader2 } from "lucide-react"
-import { getNames } from "country-list"
-import states from "states-us"
-import { Alert, AlertDescription } from "@/components/ui/alert"
-import { SearchableSelect } from "@/components/ui/searchable-select"
-
-const USA = "United States of America"
-
-type ShippingInfo = {
-  firstName: string
-  lastName: string
-  companyName: string
-  address: string
-  apartment: string
-  city: string
-  state: string
-  zipCode: string
-  country: string
-  phone: string
-}
-
-type Action =
-  | { type: "SET_FIELD"; field: keyof ShippingInfo; value: string }
-  | { type: "SET_ALL"; payload: ShippingInfo }
-
-const initialState: ShippingInfo = {
-  firstName: "",
-  lastName: "",
-  companyName: "",
-  address: "",
-  apartment: "",
-  zipCode: "",
-  country: USA,
-  city: "",
-  state: "",
-  phone: "",
-}
-
-const shippingPlaceholders: ShippingInfo = {
-  firstName: "Enter your first name",
-  lastName: "Enter your last name",
-  companyName: "Enter company name (optional)",
-  address: "Enter your street address",
-  apartment: "Apartment, suite, unit etc. (optional)",
-  zipCode: "Enter your zip code",
-  country: "Select your country",
-  city: "Enter your city",
-  state: "Enter your state",
-  phone: "Enter your phone number",
-}
-
-const ShippingInformationForm: React.FC = () => {
-  const [form, setField] = useReducer(
-    (state: ShippingInfo, action: Action): ShippingInfo => {
-      switch (action.type) {
-        case "SET_FIELD":
-          return { ...state, [action.field]: action.value }
-        case "SET_ALL":
-          return action.payload
-        default:
-          return state
-      }
-    },
-    initialState,
-  )
-  const { toast } = useToast()
-  const axios = useAxios()
-  const queryClient = useQueryClient()
-  const [countries] = useState(getNames())
-  const [isPhoneValid, setIsPhoneValid] = useState(true)
-
-  const { data: account, isLoading: isLoadingAccount } = useQuery(
-    "account",
-    async () => {
-      const response = await axios.get("/accounts/get")
-      return response.data.account
-    },
-  )
-
-  const updateShippingMutation = useMutation(
-    (shippingInfo: ShippingInfo) =>
-      axios.post("/accounts/update", { shippingInfo }),
-    {
-      onSuccess: () => {
-        queryClient.invalidateQueries("account")
-        toast({
-          title: "Success",
-          description: "Shipping information updated successfully",
-        })
-      },
-      onError: () => {
-        toast({
-          title: "Error",
-          description: "Failed to update shipping information",
-          variant: "destructive",
-        })
-      },
-    },
-  )
-
-  useEffect(() => {
-    if (account?.shippingInfo) {
-      setField({
-        type: "SET_ALL",
-        payload: {
-          ...account.shippingInfo,
-          country: account.shippingInfo.country || USA,
-        },
-      })
-    }
-  }, [account])
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
-    updateShippingMutation.mutate(form)
-  }
-
-  if (isLoadingAccount) {
-    return (
-      <div className="flex justify-center items-center h-64">
-        <Loader2 className="w-8 h-8 animate-spin" />
-      </div>
-    )
-  }
-
-  return (
-    <div className="space-y-4">
-      <div>
-        <label
-          htmlFor="country"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Country <span className="text-red-500">*</span>
-        </label>
-        <SearchableSelect
-          options={countries.map((country) => ({
-            value: country,
-            label: country,
-          }))}
-          value={form.country}
-          onChange={(value) =>
-            setField({ type: "SET_FIELD", field: "country", value })
-          }
-          resourceType="country"
-        />
-        {form.country !== USA && (
-          <Alert variant="destructive" className="mt-2">
-            <AlertDescription>
-              Currently, only shipping to the US is supported.{" "}
-              <a
-                href={`https://github.com/tscircuit/tscircuit.com/issues/new?title=${encodeURIComponent("Shipping to " + form.country)}&body=${encodeURIComponent("Please add support for shipping to " + form.country + ".")}`}
-                target="_blank"
-                rel="noopener noreferrer"
-                className="font-medium underline"
-              >
-                Create an Issue
-              </a>
-            </AlertDescription>
-          </Alert>
-        )}
-      </div>
-      <div>
-        <label
-          htmlFor="companyName"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Company Name
-        </label>
-        <Input
-          id="companyName"
-          value={form.companyName}
-          onChange={(e) =>
-            setField({
-              type: "SET_FIELD",
-              field: "companyName",
-              value: e.target.value,
-            })
-          }
-          placeholder={shippingPlaceholders.companyName}
-          disabled={updateShippingMutation.isLoading}
-        />
-      </div>
-      <div className="flex gap-4">
-        <div className="flex-1">
-          <label
-            htmlFor="firstName"
-            className="block text-sm font-medium text-gray-700"
-          >
-            First Name <span className="text-red-500">*</span>
-          </label>
-          <Input
-            id="firstName"
-            value={form.firstName}
-            onChange={(e) =>
-              setField({
-                type: "SET_FIELD",
-                field: "firstName",
-                value: e.target.value,
-              })
-            }
-            placeholder={shippingPlaceholders.firstName}
-            disabled={updateShippingMutation.isLoading}
-            required
-          />
-        </div>
-        <div className="flex-1">
-          <label
-            htmlFor="lastName"
-            className="block text-sm font-medium text-gray-700"
-          >
-            Last Name <span className="text-red-500">*</span>
-          </label>
-          <Input
-            id="lastName"
-            value={form.lastName}
-            onChange={(e) =>
-              setField({
-                type: "SET_FIELD",
-                field: "lastName",
-                value: e.target.value,
-              })
-            }
-            placeholder={shippingPlaceholders.lastName}
-            disabled={updateShippingMutation.isLoading}
-            required
-          />
-        </div>
-      </div>
-      <div>
-        <label
-          htmlFor="address"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Address <span className="text-red-500">*</span>
-        </label>
-        <Input
-          id="address"
-          value={form.address}
-          onChange={(e) =>
-            setField({
-              type: "SET_FIELD",
-              field: "address",
-              value: e.target.value,
-            })
-          }
-          placeholder={shippingPlaceholders.address}
-          disabled={updateShippingMutation.isLoading}
-          required
-        />
-      </div>
-      <div>
-        <label
-          htmlFor="apartment"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Apartment, suite, unit etc.
-        </label>
-        <Input
-          id="apartment"
-          value={form.apartment}
-          onChange={(e) =>
-            setField({
-              type: "SET_FIELD",
-              field: "apartment",
-              value: e.target.value,
-            })
-          }
-          placeholder={shippingPlaceholders.apartment}
-          disabled={updateShippingMutation.isLoading}
-        />
-      </div>
-      <div className="flex gap-4">
-        <div className="flex-1">
-          <label
-            htmlFor="city"
-            className="block text-sm font-medium text-gray-700"
-          >
-            Town / City <span className="text-red-500">*</span>
-          </label>
-          <Input
-            id="city"
-            value={form.city}
-            onChange={(e) =>
-              setField({
-                type: "SET_FIELD",
-                field: "city",
-                value: e.target.value,
-              })
-            }
-            placeholder={shippingPlaceholders.city}
-            disabled={updateShippingMutation.isLoading}
-            required
-          />
-        </div>
-        <div className="flex-1">
-          <label
-            htmlFor="state"
-            className="block text-sm font-medium text-gray-700"
-          >
-            State{" "}
-            {form.country === USA && <span className="text-red-500">*</span>}
-          </label>
-          {form.country === USA ? (
-            <SearchableSelect
-              options={states.map((state) => ({
-                value: state.name,
-                label: state.name,
-              }))}
-              value={form.state}
-              onChange={(value) =>
-                setField({ type: "SET_FIELD", field: "state", value })
-              }
-              resourceType="state"
-            />
-          ) : (
-            <Input
-              id="state"
-              value={form.state}
-              onChange={(e) =>
-                setField({
-                  type: "SET_FIELD",
-                  field: "state",
-                  value: e.target.value,
-                })
-              }
-              placeholder={shippingPlaceholders.state}
-              disabled={updateShippingMutation.isLoading}
-            />
-          )}
-        </div>
-      </div>
-      <div>
-        <label
-          htmlFor="zipCode"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Postcode / Zip <span className="text-red-500">*</span>
-        </label>
-        <Input
-          id="zipCode"
-          value={form.zipCode}
-          onChange={(e) =>
-            setField({
-              type: "SET_FIELD",
-              field: "zipCode",
-              value: e.target.value,
-            })
-          }
-          placeholder={shippingPlaceholders.zipCode}
-          disabled={updateShippingMutation.isLoading}
-          required
-        />
-      </div>
-      <div>
-        <label
-          htmlFor="phone"
-          className="block text-sm font-medium text-gray-700"
-        >
-          Phone <span className="text-red-500">*</span>
-        </label>
-        <div>
-          <Input
-            id="phone"
-            type="tel"
-            value={form.phone}
-            onChange={(e) => {
-              setIsPhoneValid(true)
-              setField({
-                type: "SET_FIELD",
-                field: "phone",
-                value: e.target.value,
-              })
-            }}
-            onBlur={() => {
-              const phoneRegex =
-                /^(\+\d{1,2}\s?)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/
-              setIsPhoneValid(phoneRegex.test(form.phone))
-            }}
-            placeholder={shippingPlaceholders.phone}
-            disabled={updateShippingMutation.isLoading}
-            required
-          />
-          <p className="text-xs text-gray-500 mt-1">
-            Format: (123) 456-7890 or +1 123-456-7890
-          </p>
-          {!isPhoneValid && form.phone && (
-            <Alert variant="destructive" className="mt-2">
-              <AlertDescription>
-                Please enter a valid phone number.
-              </AlertDescription>
-            </Alert>
-          )}
-        </div>
-      </div>
-      <Button
-        type="submit"
-        disabled={
-          updateShippingMutation.isLoading ||
-          form.country !== USA ||
-          !isPhoneValid
-        }
-        onClick={handleSubmit}
-      >
-        {updateShippingMutation.isLoading ? (
-          <>
-            <Loader2 className="mr-2 h-4 w-4 animate-spin" />
-            Updating...
-          </>
-        ) : (
-          "Update"
-        )}
-      </Button>
-    </div>
-  )
-}
-
-export default ShippingInformationForm

package/src/components/StaticViewSnippetHeader.tsx

@@ -1,70 +0,0 @@
-import React from "react"
-import { TypeBadge } from "@/components/TypeBadge"
-import { Button } from "@/components/ui/button"
-import { ChevronLeft, Eye, GitFork, Star } from "lucide-react"
-import { Link } from "wouter"
-
-export default function StaticViewSnippetHeader({
-  author,
-  snippetName,
-}: {
-  author: string
-  snippetName: string
-}) {
-  const snippet_data = {
-    owner_name: author,
-    unscoped_name: snippetName,
-    //sample values
-    snippet_type: "board",
-    is_starred: false,
-    star_count: 0,
-  }
-
-  return (
-    <header className="bg-white border-b border-gray-200 py-4 px-6">
-      <div className="flex items-center justify-between">
-        <div className="flex items-center">
-          <h1 className="text-xl font-bold mr-2">
-            <Link
-              href={`/${snippet_data.owner_name}`}
-              className="text-blue-600"
-            >
-              {snippet_data.owner_name}
-            </Link>
-            <span className="px-1 text-gray-500">/</span>
-            <Link
-              className="text-blue-600"
-              href={`/${snippet_data.owner_name}/${snippet_data.unscoped_name}`}
-            >
-              {snippet_data.unscoped_name}
-            </Link>
-          </h1>
-          {snippet_data.snippet_type && (
-            <TypeBadge type={snippet_data.snippet_type} />
-          )}
-        </div>
-        <div className="flex items-center space-x-2">
-          <Button
-            size="sm"
-            disabled
-            aria-label="Loading placeholder"
-            className="loading-placeholder"
-          >
-            <Star className="w-4 h-4 mr-2" />
-            Star
-          </Button>
-
-          <Button
-            size="sm"
-            disabled
-            aria-label="Loading placeholder"
-            className="loading-placeholder"
-          >
-            <GitFork className="w-4 h-4 mr-2" />
-            Fork
-          </Button>
-        </div>
-      </div>
-    </header>
-  )
-}

package/src/components/ViewPackagePage/components/file-explorer.tsx

@@ -1,67 +0,0 @@
-import { Clock, FileText, Folder, Tag } from "lucide-react"
-import { useCurrentPackageInfo } from "@/hooks/use-current-package-info"
-import { usePackageReleaseById } from "@/hooks/use-package-release"
-import { Skeleton } from "@/components/ui/skeleton"
-import { timeAgo } from "@/lib/utils/timeAgo"
-
-export default function FileExplorer() {
-  const { packageInfo } = useCurrentPackageInfo()
-  const { data: packageRelease } = usePackageReleaseById(
-    packageInfo?.latest_package_release_id,
-  )
-
-  return (
-    <div className="border border-gray-200 dark:border-[#30363d] rounded-md overflow-hidden">
-      <div className="flex items-center px-4 py-2 md:py-3 bg-gray-100 dark:bg-[#161b22] border-b border-gray-200 dark:border-[#30363d]">
-        {/* Desktop view */}
-        <div className="hidden md:flex items-center text-xs">
-          <Tag className="h-4 w-4 mr-1 text-gray-500 dark:text-[#8b949e]" />
-          {packageRelease?.version ? (
-            <span className="text-gray-500 dark:text-[#8b949e]">
-              v{packageRelease.version}
-            </span>
-          ) : (
-            <Skeleton className="h-4 w-16" />
-          )}
-          <div className="ml-2 text-green-500 dark:text-[#3fb950]">✓</div>
-        </div>
-        <div className="hidden md:flex ml-auto items-center text-xs text-gray-500 dark:text-[#8b949e]">
-          <Clock className="h-4 w-4 mr-1" />
-          {packageRelease?.created_at ? (
-            <span>{timeAgo(new Date(packageRelease.created_at))}</span>
-          ) : (
-            <Skeleton className="h-4 w-16" />
-          )}
-          <div className="ml-4 flex items-center">
-            <Tag className="h-4 w-4 mr-1" />
-            {packageRelease ? (
-              <span>v{packageRelease.version}</span>
-            ) : (
-              <Skeleton className="h-4 w-16" />
-            )}
-          </div>
-        </div>
-
-        {/* Mobile view */}
-        <div className="md:hidden flex items-center justify-between w-full">
-          <div className="flex items-center">
-            <span className="text-xs text-gray-500 dark:text-[#8b949e]">
-              v{packageRelease?.version}
-            </span>
-            <div className="ml-1 text-green-500 dark:text-[#3fb950]">✓</div>
-          </div>
-          <div className="flex items-center space-x-3 text-xs text-gray-500 dark:text-[#8b949e]">
-            <div className="flex items-center">
-              <Clock className="h-3 w-3 mr-0.5" />
-              <span>2d</span>
-            </div>
-            <div className="flex items-center">
-              <Tag className="h-3 w-3 mr-0.5" />
-              <span>12</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}

package/src/components/ViewPackagePage/components/readme-view.tsx

@@ -1,58 +0,0 @@
-import { Edit, FileText, List } from "lucide-react"
-
-export default function ReadmeView() {
-  return (
-    <div className="mt-4 border border-gray-200 dark:border-[#30363d] rounded-md overflow-hidden">
-      <div className="flex items-center px-4 py-2 bg-gray-100 dark:bg-[#161b22] border-b border-gray-200 dark:border-[#30363d]">
-        <div className="flex items-center">
-          <FileText className="h-4 w-4 mr-2" />
-          <span className="font-semibold">README</span>
-        </div>
-        <div className="ml-4 px-2 py-0.5 bg-gray-200 dark:bg-[#30363d] rounded-md text-xs">
-          MIT license
-        </div>
-        <div className="ml-auto flex items-center">
-          <Edit className="h-4 w-4 mr-1" />
-          <List className="h-4 w-4 ml-2" />
-        </div>
-      </div>
-      <div className="p-4 bg-white dark:bg-[#0d1117]">
-        <h2 className="text-2xl font-bold mb-4">@tscircuit/core</h2>
-        <p className="mb-4">
-          The core logic used to build Circuit JSON from tscircuit React
-          elements.
-        </p>
-        <div className="mb-4">
-          <a
-            href="#"
-            className="text-blue-600 dark:text-[#58a6ff] hover:underline"
-          >
-            tscircuit
-          </a>
-          <span className="mx-2">•</span>
-          <a
-            href="#"
-            className="text-blue-600 dark:text-[#58a6ff] hover:underline"
-          >
-            Development Guide
-          </a>
-          <span className="mx-2">•</span>
-          <a
-            href="#"
-            className="text-blue-600 dark:text-[#58a6ff] hover:underline"
-          >
-            Core Benchmarks
-          </a>
-        </div>
-        <p>
-          You can use{" "}
-          <code className="bg-gray-100 dark:bg-[#161b22] px-1 py-0.5 rounded">
-            core
-          </code>{" "}
-          to create Circuit JSON, which can then be converted into Gerbers,
-          viewed online, and much
-        </p>
-      </div>
-    </div>
-  )
-}

package/src/components/ViewPackagePage/components/repo-header-button.tsx

@@ -1,36 +0,0 @@
-import { Badge } from "@/components/ui/badge"
-import { Button } from "@/components/ui/button"
-import { ChevronDown } from "lucide-react"
-import type { ReactNode } from "react"
-
-interface RepoHeaderButtonProps {
-  icon: ReactNode
-  label: string
-  count?: number
-}
-
-export default function RepoHeaderButton({
-  icon,
-  label,
-  count,
-}: RepoHeaderButtonProps) {
-  return (
-    <Button
-      variant="outline"
-      size="sm"
-      className="border-gray-300 dark:border-[#30363d] bg-gray-100 hover:bg-gray-200 dark:bg-[#21262d] dark:hover:bg-[#30363d] text-gray-700 dark:text-[#c9d1d9]"
-    >
-      {icon}
-      {label}
-      {count !== undefined && (
-        <Badge
-          variant="outline"
-          className="ml-2 text-xs rounded-full px-2 py-0.5 bg-transparent border-gray-300 dark:border-[#30363d]"
-        >
-          {count}
-        </Badge>
-      )}
-      <ChevronDown className="h-4 w-4 ml-1" />
-    </Button>
-  )
-}

package/src/components/ViewPackagePage/components/repo-header.tsx

@@ -1,4 +0,0 @@
-export default function RepoHeader() {
-  // This component is being handled by a different team
-  return null
-}

package/src/components/ViewPackagePage/components/sidebar-contributors-section.tsx

@@ -1,31 +0,0 @@
-import { Badge } from "@/components/ui/badge"
-
-export default function SidebarContributorsSection() {
-  return (
-    <div>
-      <div className="flex items-center justify-between mb-2">
-        <h2 className="text-lg font-semibold">Contributors</h2>
-        <Badge
-          variant="outline"
-          className="text-xs rounded-full px-2 py-0.5 bg-transparent border-gray-300 dark:border-[#30363d]"
-        >
-          18
-        </Badge>
-      </div>
-      <div className="flex flex-wrap gap-1 mb-2">
-        {[...Array(10)].map((_, i) => (
-          <div
-            key={i}
-            className="w-8 h-8 rounded-full bg-gradient-to-br from-blue-500 to-purple-500"
-          ></div>
-        ))}
-      </div>
-      <a
-        href="#"
-        className="text-blue-600 dark:text-[#58a6ff] hover:underline text-sm"
-      >
-        + 4 contributors
-      </a>
-    </div>
-  )
-}