@tscircuit/fake-snippets 0.0.108 → 0.0.109
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bun.lock +62 -19
- package/dist/bundle.js +3 -2
- package/dist/index.d.ts +5 -0
- package/dist/index.js +2 -1
- package/dist/schema.d.ts +8 -0
- package/dist/schema.js +2 -1
- package/fake-snippets-api/lib/db/schema.ts +1 -0
- package/package.json +7 -8
- package/src/App.tsx +0 -2
- package/src/components/DownloadButtonAndMenu.tsx +133 -35
- package/src/components/FileSidebar.tsx +31 -34
- package/src/components/Footer.tsx +0 -1
- package/src/components/HeaderLogin.tsx +1 -1
- package/src/components/HiddenFilesDropdown.tsx +0 -2
- package/src/components/PackageBuildsPage/PackageBuildDetailsPage.tsx +0 -2
- package/src/components/PackageBuildsPage/build-preview-content.tsx +34 -5
- package/src/components/PackageCard.tsx +0 -1
- package/src/components/ViewPackagePage/components/ShikiCodeViewer.tsx +20 -11
- package/src/components/ViewPackagePage/components/important-files-view.tsx +75 -59
- package/src/components/ViewPackagePage/components/main-content-header.tsx +4 -4
- package/src/components/ViewPackagePage/components/main-content-view-selector.tsx +0 -1
- package/src/components/ViewPackagePage/components/mobile-sidebar.tsx +0 -1
- package/src/components/ViewPackagePage/components/package-header.tsx +14 -17
- package/src/components/ViewPackagePage/components/preview-image-squares.tsx +0 -1
- package/src/components/ViewPackagePage/components/repo-page-content.tsx +21 -20
- package/src/components/ViewPackagePage/components/sidebar.tsx +0 -2
- package/src/components/ViewPackagePage/components/tab-views/files-view.tsx +18 -17
- package/src/components/ViewPackagePage/components/theme-toggle.tsx +0 -2
- package/src/components/ViewPackagePage/hooks/use-toast.tsx +0 -1
- package/src/components/package-port/CodeAndPreview.tsx +23 -40
- package/src/components/package-port/CodeEditor.tsx +24 -1
- package/src/components/package-port/CodeEditorHeader.tsx +5 -2
- package/src/components/preview/PackageReleasesDashboard.tsx +30 -25
- package/src/hooks/use-current-package-id.ts +5 -30
- package/src/hooks/use-current-package-info.ts +29 -5
- package/src/hooks/use-global-store.ts +1 -1
- package/src/hooks/useFileManagement.ts +153 -34
- package/src/hooks/useOptimizedPackageFilesLoader.ts +149 -0
- package/src/hooks/useUpdatePackageFilesMutation.ts +2 -0
- package/src/lib/download-fns/download-circuit-png.ts +11 -3
- package/src/lib/download-fns/download-gltf-from-circuit-json.ts +44 -0
- package/src/lib/utils/isComponentExported.ts +9 -0
- package/src/pages/authorize.tsx +0 -2
- package/src/pages/landing.tsx +0 -1
- package/src/pages/preview-release.tsx +14 -4
- package/src/pages/view-package.tsx +14 -13
- package/src/components/Footer2.tsx +0 -100
- package/src/components/ShippingInformationForm.tsx +0 -423
- package/src/components/StaticViewSnippetHeader.tsx +0 -70
- package/src/components/ViewPackagePage/components/file-explorer.tsx +0 -67
- package/src/components/ViewPackagePage/components/readme-view.tsx +0 -58
- package/src/components/ViewPackagePage/components/repo-header-button.tsx +0 -36
- package/src/components/ViewPackagePage/components/repo-header.tsx +0 -4
- package/src/components/ViewPackagePage/components/sidebar-contributors-section.tsx +0 -31
- package/src/components/ViewSnippetHeader.tsx +0 -181
- package/src/components/ui/input-otp.tsx +0 -69
- package/src/pages/settings.tsx +0 -25
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
import { Button } from "@/components/ui/button"
|
|
2
|
-
import { Card, CardContent } from "@/components/ui/card"
|
|
3
|
-
import { Badge } from "@/components/ui/badge"
|
|
4
|
-
import {
|
|
5
|
-
Accordion,
|
|
6
|
-
AccordionContent,
|
|
7
|
-
AccordionItem,
|
|
8
|
-
AccordionTrigger,
|
|
9
|
-
} from "@/components/ui/accordion"
|
|
10
|
-
import {
|
|
11
|
-
CircuitBoard,
|
|
12
|
-
Cpu,
|
|
13
|
-
Layers,
|
|
14
|
-
CloudLightningIcon as Lightning,
|
|
15
|
-
Maximize2,
|
|
16
|
-
Zap,
|
|
17
|
-
} from "lucide-react"
|
|
18
|
-
import { Link } from "wouter"
|
|
19
|
-
import { Header2 } from "@/components/Header2"
|
|
20
|
-
|
|
21
|
-
export const Footer2 = () => (
|
|
22
|
-
<footer className="w-full py-6 bg-background">
|
|
23
|
-
<div className="container px-4 md:px-6 mx-auto">
|
|
24
|
-
<div className="grid gap-8 md:grid-cols-2 lg:grid-cols-4">
|
|
25
|
-
<div className="space-y-4">
|
|
26
|
-
<div className="flex items-center gap-2">
|
|
27
|
-
<CircuitBoard className="h-6 w-6" />
|
|
28
|
-
<span className="text-lg font-bold">tscircuit</span>
|
|
29
|
-
</div>
|
|
30
|
-
<p className="text-sm text-muted-foreground">
|
|
31
|
-
Transforming electronic design with AI-powered tools.
|
|
32
|
-
</p>
|
|
33
|
-
</div>
|
|
34
|
-
<div className="space-y-4">
|
|
35
|
-
<h4 className="text-sm font-bold">Product</h4>
|
|
36
|
-
<ul className="space-y-2 text-sm">
|
|
37
|
-
<li>
|
|
38
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
39
|
-
Features
|
|
40
|
-
</Link>
|
|
41
|
-
</li>
|
|
42
|
-
<li>
|
|
43
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
44
|
-
Pricing
|
|
45
|
-
</Link>
|
|
46
|
-
</li>
|
|
47
|
-
<li>
|
|
48
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
49
|
-
Tutorials
|
|
50
|
-
</Link>
|
|
51
|
-
</li>
|
|
52
|
-
</ul>
|
|
53
|
-
</div>
|
|
54
|
-
<div className="space-y-4">
|
|
55
|
-
<h4 className="text-sm font-bold">Company</h4>
|
|
56
|
-
<ul className="space-y-2 text-sm">
|
|
57
|
-
<li>
|
|
58
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
59
|
-
About
|
|
60
|
-
</Link>
|
|
61
|
-
</li>
|
|
62
|
-
<li>
|
|
63
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
64
|
-
Blog
|
|
65
|
-
</Link>
|
|
66
|
-
</li>
|
|
67
|
-
<li>
|
|
68
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
69
|
-
Careers
|
|
70
|
-
</Link>
|
|
71
|
-
</li>
|
|
72
|
-
</ul>
|
|
73
|
-
</div>
|
|
74
|
-
<div className="space-y-4">
|
|
75
|
-
<h4 className="text-sm font-bold">Legal</h4>
|
|
76
|
-
<ul className="space-y-2 text-sm">
|
|
77
|
-
<li>
|
|
78
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
79
|
-
Privacy
|
|
80
|
-
</Link>
|
|
81
|
-
</li>
|
|
82
|
-
<li>
|
|
83
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
84
|
-
Terms
|
|
85
|
-
</Link>
|
|
86
|
-
</li>
|
|
87
|
-
<li>
|
|
88
|
-
<Link className="text-muted-foreground hover:underline" href="#">
|
|
89
|
-
Cookie Policy
|
|
90
|
-
</Link>
|
|
91
|
-
</li>
|
|
92
|
-
</ul>
|
|
93
|
-
</div>
|
|
94
|
-
</div>
|
|
95
|
-
<div className="mt-8 border-t pt-8 text-center text-sm text-muted-foreground">
|
|
96
|
-
© {new Date().getFullYear()} tscircuit. All rights reserved.
|
|
97
|
-
</div>
|
|
98
|
-
</div>
|
|
99
|
-
</footer>
|
|
100
|
-
)
|
|
@@ -1,423 +0,0 @@
|
|
|
1
|
-
import React, { useReducer, useEffect, useState } from "react"
|
|
2
|
-
import { Button } from "@/components/ui/button"
|
|
3
|
-
import { Input } from "@/components/ui/input"
|
|
4
|
-
import { useToast } from "@/hooks/use-toast"
|
|
5
|
-
import { useAxios } from "@/hooks/use-axios"
|
|
6
|
-
import { useQuery, useMutation, useQueryClient } from "react-query"
|
|
7
|
-
import { Loader2 } from "lucide-react"
|
|
8
|
-
import { getNames } from "country-list"
|
|
9
|
-
import states from "states-us"
|
|
10
|
-
import { Alert, AlertDescription } from "@/components/ui/alert"
|
|
11
|
-
import { SearchableSelect } from "@/components/ui/searchable-select"
|
|
12
|
-
|
|
13
|
-
const USA = "United States of America"
|
|
14
|
-
|
|
15
|
-
type ShippingInfo = {
|
|
16
|
-
firstName: string
|
|
17
|
-
lastName: string
|
|
18
|
-
companyName: string
|
|
19
|
-
address: string
|
|
20
|
-
apartment: string
|
|
21
|
-
city: string
|
|
22
|
-
state: string
|
|
23
|
-
zipCode: string
|
|
24
|
-
country: string
|
|
25
|
-
phone: string
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
type Action =
|
|
29
|
-
| { type: "SET_FIELD"; field: keyof ShippingInfo; value: string }
|
|
30
|
-
| { type: "SET_ALL"; payload: ShippingInfo }
|
|
31
|
-
|
|
32
|
-
const initialState: ShippingInfo = {
|
|
33
|
-
firstName: "",
|
|
34
|
-
lastName: "",
|
|
35
|
-
companyName: "",
|
|
36
|
-
address: "",
|
|
37
|
-
apartment: "",
|
|
38
|
-
zipCode: "",
|
|
39
|
-
country: USA,
|
|
40
|
-
city: "",
|
|
41
|
-
state: "",
|
|
42
|
-
phone: "",
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
const shippingPlaceholders: ShippingInfo = {
|
|
46
|
-
firstName: "Enter your first name",
|
|
47
|
-
lastName: "Enter your last name",
|
|
48
|
-
companyName: "Enter company name (optional)",
|
|
49
|
-
address: "Enter your street address",
|
|
50
|
-
apartment: "Apartment, suite, unit etc. (optional)",
|
|
51
|
-
zipCode: "Enter your zip code",
|
|
52
|
-
country: "Select your country",
|
|
53
|
-
city: "Enter your city",
|
|
54
|
-
state: "Enter your state",
|
|
55
|
-
phone: "Enter your phone number",
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
const ShippingInformationForm: React.FC = () => {
|
|
59
|
-
const [form, setField] = useReducer(
|
|
60
|
-
(state: ShippingInfo, action: Action): ShippingInfo => {
|
|
61
|
-
switch (action.type) {
|
|
62
|
-
case "SET_FIELD":
|
|
63
|
-
return { ...state, [action.field]: action.value }
|
|
64
|
-
case "SET_ALL":
|
|
65
|
-
return action.payload
|
|
66
|
-
default:
|
|
67
|
-
return state
|
|
68
|
-
}
|
|
69
|
-
},
|
|
70
|
-
initialState,
|
|
71
|
-
)
|
|
72
|
-
const { toast } = useToast()
|
|
73
|
-
const axios = useAxios()
|
|
74
|
-
const queryClient = useQueryClient()
|
|
75
|
-
const [countries] = useState(getNames())
|
|
76
|
-
const [isPhoneValid, setIsPhoneValid] = useState(true)
|
|
77
|
-
|
|
78
|
-
const { data: account, isLoading: isLoadingAccount } = useQuery(
|
|
79
|
-
"account",
|
|
80
|
-
async () => {
|
|
81
|
-
const response = await axios.get("/accounts/get")
|
|
82
|
-
return response.data.account
|
|
83
|
-
},
|
|
84
|
-
)
|
|
85
|
-
|
|
86
|
-
const updateShippingMutation = useMutation(
|
|
87
|
-
(shippingInfo: ShippingInfo) =>
|
|
88
|
-
axios.post("/accounts/update", { shippingInfo }),
|
|
89
|
-
{
|
|
90
|
-
onSuccess: () => {
|
|
91
|
-
queryClient.invalidateQueries("account")
|
|
92
|
-
toast({
|
|
93
|
-
title: "Success",
|
|
94
|
-
description: "Shipping information updated successfully",
|
|
95
|
-
})
|
|
96
|
-
},
|
|
97
|
-
onError: () => {
|
|
98
|
-
toast({
|
|
99
|
-
title: "Error",
|
|
100
|
-
description: "Failed to update shipping information",
|
|
101
|
-
variant: "destructive",
|
|
102
|
-
})
|
|
103
|
-
},
|
|
104
|
-
},
|
|
105
|
-
)
|
|
106
|
-
|
|
107
|
-
useEffect(() => {
|
|
108
|
-
if (account?.shippingInfo) {
|
|
109
|
-
setField({
|
|
110
|
-
type: "SET_ALL",
|
|
111
|
-
payload: {
|
|
112
|
-
...account.shippingInfo,
|
|
113
|
-
country: account.shippingInfo.country || USA,
|
|
114
|
-
},
|
|
115
|
-
})
|
|
116
|
-
}
|
|
117
|
-
}, [account])
|
|
118
|
-
|
|
119
|
-
const handleSubmit = async (e: React.FormEvent) => {
|
|
120
|
-
e.preventDefault()
|
|
121
|
-
updateShippingMutation.mutate(form)
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
if (isLoadingAccount) {
|
|
125
|
-
return (
|
|
126
|
-
<div className="flex justify-center items-center h-64">
|
|
127
|
-
<Loader2 className="w-8 h-8 animate-spin" />
|
|
128
|
-
</div>
|
|
129
|
-
)
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
return (
|
|
133
|
-
<div className="space-y-4">
|
|
134
|
-
<div>
|
|
135
|
-
<label
|
|
136
|
-
htmlFor="country"
|
|
137
|
-
className="block text-sm font-medium text-gray-700"
|
|
138
|
-
>
|
|
139
|
-
Country <span className="text-red-500">*</span>
|
|
140
|
-
</label>
|
|
141
|
-
<SearchableSelect
|
|
142
|
-
options={countries.map((country) => ({
|
|
143
|
-
value: country,
|
|
144
|
-
label: country,
|
|
145
|
-
}))}
|
|
146
|
-
value={form.country}
|
|
147
|
-
onChange={(value) =>
|
|
148
|
-
setField({ type: "SET_FIELD", field: "country", value })
|
|
149
|
-
}
|
|
150
|
-
resourceType="country"
|
|
151
|
-
/>
|
|
152
|
-
{form.country !== USA && (
|
|
153
|
-
<Alert variant="destructive" className="mt-2">
|
|
154
|
-
<AlertDescription>
|
|
155
|
-
Currently, only shipping to the US is supported.{" "}
|
|
156
|
-
<a
|
|
157
|
-
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 + ".")}`}
|
|
158
|
-
target="_blank"
|
|
159
|
-
rel="noopener noreferrer"
|
|
160
|
-
className="font-medium underline"
|
|
161
|
-
>
|
|
162
|
-
Create an Issue
|
|
163
|
-
</a>
|
|
164
|
-
</AlertDescription>
|
|
165
|
-
</Alert>
|
|
166
|
-
)}
|
|
167
|
-
</div>
|
|
168
|
-
<div>
|
|
169
|
-
<label
|
|
170
|
-
htmlFor="companyName"
|
|
171
|
-
className="block text-sm font-medium text-gray-700"
|
|
172
|
-
>
|
|
173
|
-
Company Name
|
|
174
|
-
</label>
|
|
175
|
-
<Input
|
|
176
|
-
id="companyName"
|
|
177
|
-
value={form.companyName}
|
|
178
|
-
onChange={(e) =>
|
|
179
|
-
setField({
|
|
180
|
-
type: "SET_FIELD",
|
|
181
|
-
field: "companyName",
|
|
182
|
-
value: e.target.value,
|
|
183
|
-
})
|
|
184
|
-
}
|
|
185
|
-
placeholder={shippingPlaceholders.companyName}
|
|
186
|
-
disabled={updateShippingMutation.isLoading}
|
|
187
|
-
/>
|
|
188
|
-
</div>
|
|
189
|
-
<div className="flex gap-4">
|
|
190
|
-
<div className="flex-1">
|
|
191
|
-
<label
|
|
192
|
-
htmlFor="firstName"
|
|
193
|
-
className="block text-sm font-medium text-gray-700"
|
|
194
|
-
>
|
|
195
|
-
First Name <span className="text-red-500">*</span>
|
|
196
|
-
</label>
|
|
197
|
-
<Input
|
|
198
|
-
id="firstName"
|
|
199
|
-
value={form.firstName}
|
|
200
|
-
onChange={(e) =>
|
|
201
|
-
setField({
|
|
202
|
-
type: "SET_FIELD",
|
|
203
|
-
field: "firstName",
|
|
204
|
-
value: e.target.value,
|
|
205
|
-
})
|
|
206
|
-
}
|
|
207
|
-
placeholder={shippingPlaceholders.firstName}
|
|
208
|
-
disabled={updateShippingMutation.isLoading}
|
|
209
|
-
required
|
|
210
|
-
/>
|
|
211
|
-
</div>
|
|
212
|
-
<div className="flex-1">
|
|
213
|
-
<label
|
|
214
|
-
htmlFor="lastName"
|
|
215
|
-
className="block text-sm font-medium text-gray-700"
|
|
216
|
-
>
|
|
217
|
-
Last Name <span className="text-red-500">*</span>
|
|
218
|
-
</label>
|
|
219
|
-
<Input
|
|
220
|
-
id="lastName"
|
|
221
|
-
value={form.lastName}
|
|
222
|
-
onChange={(e) =>
|
|
223
|
-
setField({
|
|
224
|
-
type: "SET_FIELD",
|
|
225
|
-
field: "lastName",
|
|
226
|
-
value: e.target.value,
|
|
227
|
-
})
|
|
228
|
-
}
|
|
229
|
-
placeholder={shippingPlaceholders.lastName}
|
|
230
|
-
disabled={updateShippingMutation.isLoading}
|
|
231
|
-
required
|
|
232
|
-
/>
|
|
233
|
-
</div>
|
|
234
|
-
</div>
|
|
235
|
-
<div>
|
|
236
|
-
<label
|
|
237
|
-
htmlFor="address"
|
|
238
|
-
className="block text-sm font-medium text-gray-700"
|
|
239
|
-
>
|
|
240
|
-
Address <span className="text-red-500">*</span>
|
|
241
|
-
</label>
|
|
242
|
-
<Input
|
|
243
|
-
id="address"
|
|
244
|
-
value={form.address}
|
|
245
|
-
onChange={(e) =>
|
|
246
|
-
setField({
|
|
247
|
-
type: "SET_FIELD",
|
|
248
|
-
field: "address",
|
|
249
|
-
value: e.target.value,
|
|
250
|
-
})
|
|
251
|
-
}
|
|
252
|
-
placeholder={shippingPlaceholders.address}
|
|
253
|
-
disabled={updateShippingMutation.isLoading}
|
|
254
|
-
required
|
|
255
|
-
/>
|
|
256
|
-
</div>
|
|
257
|
-
<div>
|
|
258
|
-
<label
|
|
259
|
-
htmlFor="apartment"
|
|
260
|
-
className="block text-sm font-medium text-gray-700"
|
|
261
|
-
>
|
|
262
|
-
Apartment, suite, unit etc.
|
|
263
|
-
</label>
|
|
264
|
-
<Input
|
|
265
|
-
id="apartment"
|
|
266
|
-
value={form.apartment}
|
|
267
|
-
onChange={(e) =>
|
|
268
|
-
setField({
|
|
269
|
-
type: "SET_FIELD",
|
|
270
|
-
field: "apartment",
|
|
271
|
-
value: e.target.value,
|
|
272
|
-
})
|
|
273
|
-
}
|
|
274
|
-
placeholder={shippingPlaceholders.apartment}
|
|
275
|
-
disabled={updateShippingMutation.isLoading}
|
|
276
|
-
/>
|
|
277
|
-
</div>
|
|
278
|
-
<div className="flex gap-4">
|
|
279
|
-
<div className="flex-1">
|
|
280
|
-
<label
|
|
281
|
-
htmlFor="city"
|
|
282
|
-
className="block text-sm font-medium text-gray-700"
|
|
283
|
-
>
|
|
284
|
-
Town / City <span className="text-red-500">*</span>
|
|
285
|
-
</label>
|
|
286
|
-
<Input
|
|
287
|
-
id="city"
|
|
288
|
-
value={form.city}
|
|
289
|
-
onChange={(e) =>
|
|
290
|
-
setField({
|
|
291
|
-
type: "SET_FIELD",
|
|
292
|
-
field: "city",
|
|
293
|
-
value: e.target.value,
|
|
294
|
-
})
|
|
295
|
-
}
|
|
296
|
-
placeholder={shippingPlaceholders.city}
|
|
297
|
-
disabled={updateShippingMutation.isLoading}
|
|
298
|
-
required
|
|
299
|
-
/>
|
|
300
|
-
</div>
|
|
301
|
-
<div className="flex-1">
|
|
302
|
-
<label
|
|
303
|
-
htmlFor="state"
|
|
304
|
-
className="block text-sm font-medium text-gray-700"
|
|
305
|
-
>
|
|
306
|
-
State{" "}
|
|
307
|
-
{form.country === USA && <span className="text-red-500">*</span>}
|
|
308
|
-
</label>
|
|
309
|
-
{form.country === USA ? (
|
|
310
|
-
<SearchableSelect
|
|
311
|
-
options={states.map((state) => ({
|
|
312
|
-
value: state.name,
|
|
313
|
-
label: state.name,
|
|
314
|
-
}))}
|
|
315
|
-
value={form.state}
|
|
316
|
-
onChange={(value) =>
|
|
317
|
-
setField({ type: "SET_FIELD", field: "state", value })
|
|
318
|
-
}
|
|
319
|
-
resourceType="state"
|
|
320
|
-
/>
|
|
321
|
-
) : (
|
|
322
|
-
<Input
|
|
323
|
-
id="state"
|
|
324
|
-
value={form.state}
|
|
325
|
-
onChange={(e) =>
|
|
326
|
-
setField({
|
|
327
|
-
type: "SET_FIELD",
|
|
328
|
-
field: "state",
|
|
329
|
-
value: e.target.value,
|
|
330
|
-
})
|
|
331
|
-
}
|
|
332
|
-
placeholder={shippingPlaceholders.state}
|
|
333
|
-
disabled={updateShippingMutation.isLoading}
|
|
334
|
-
/>
|
|
335
|
-
)}
|
|
336
|
-
</div>
|
|
337
|
-
</div>
|
|
338
|
-
<div>
|
|
339
|
-
<label
|
|
340
|
-
htmlFor="zipCode"
|
|
341
|
-
className="block text-sm font-medium text-gray-700"
|
|
342
|
-
>
|
|
343
|
-
Postcode / Zip <span className="text-red-500">*</span>
|
|
344
|
-
</label>
|
|
345
|
-
<Input
|
|
346
|
-
id="zipCode"
|
|
347
|
-
value={form.zipCode}
|
|
348
|
-
onChange={(e) =>
|
|
349
|
-
setField({
|
|
350
|
-
type: "SET_FIELD",
|
|
351
|
-
field: "zipCode",
|
|
352
|
-
value: e.target.value,
|
|
353
|
-
})
|
|
354
|
-
}
|
|
355
|
-
placeholder={shippingPlaceholders.zipCode}
|
|
356
|
-
disabled={updateShippingMutation.isLoading}
|
|
357
|
-
required
|
|
358
|
-
/>
|
|
359
|
-
</div>
|
|
360
|
-
<div>
|
|
361
|
-
<label
|
|
362
|
-
htmlFor="phone"
|
|
363
|
-
className="block text-sm font-medium text-gray-700"
|
|
364
|
-
>
|
|
365
|
-
Phone <span className="text-red-500">*</span>
|
|
366
|
-
</label>
|
|
367
|
-
<div>
|
|
368
|
-
<Input
|
|
369
|
-
id="phone"
|
|
370
|
-
type="tel"
|
|
371
|
-
value={form.phone}
|
|
372
|
-
onChange={(e) => {
|
|
373
|
-
setIsPhoneValid(true)
|
|
374
|
-
setField({
|
|
375
|
-
type: "SET_FIELD",
|
|
376
|
-
field: "phone",
|
|
377
|
-
value: e.target.value,
|
|
378
|
-
})
|
|
379
|
-
}}
|
|
380
|
-
onBlur={() => {
|
|
381
|
-
const phoneRegex =
|
|
382
|
-
/^(\+\d{1,2}\s?)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/
|
|
383
|
-
setIsPhoneValid(phoneRegex.test(form.phone))
|
|
384
|
-
}}
|
|
385
|
-
placeholder={shippingPlaceholders.phone}
|
|
386
|
-
disabled={updateShippingMutation.isLoading}
|
|
387
|
-
required
|
|
388
|
-
/>
|
|
389
|
-
<p className="text-xs text-gray-500 mt-1">
|
|
390
|
-
Format: (123) 456-7890 or +1 123-456-7890
|
|
391
|
-
</p>
|
|
392
|
-
{!isPhoneValid && form.phone && (
|
|
393
|
-
<Alert variant="destructive" className="mt-2">
|
|
394
|
-
<AlertDescription>
|
|
395
|
-
Please enter a valid phone number.
|
|
396
|
-
</AlertDescription>
|
|
397
|
-
</Alert>
|
|
398
|
-
)}
|
|
399
|
-
</div>
|
|
400
|
-
</div>
|
|
401
|
-
<Button
|
|
402
|
-
type="submit"
|
|
403
|
-
disabled={
|
|
404
|
-
updateShippingMutation.isLoading ||
|
|
405
|
-
form.country !== USA ||
|
|
406
|
-
!isPhoneValid
|
|
407
|
-
}
|
|
408
|
-
onClick={handleSubmit}
|
|
409
|
-
>
|
|
410
|
-
{updateShippingMutation.isLoading ? (
|
|
411
|
-
<>
|
|
412
|
-
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
|
413
|
-
Updating...
|
|
414
|
-
</>
|
|
415
|
-
) : (
|
|
416
|
-
"Update"
|
|
417
|
-
)}
|
|
418
|
-
</Button>
|
|
419
|
-
</div>
|
|
420
|
-
)
|
|
421
|
-
}
|
|
422
|
-
|
|
423
|
-
export default ShippingInformationForm
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
import React from "react"
|
|
2
|
-
import { TypeBadge } from "@/components/TypeBadge"
|
|
3
|
-
import { Button } from "@/components/ui/button"
|
|
4
|
-
import { ChevronLeft, Eye, GitFork, Star } from "lucide-react"
|
|
5
|
-
import { Link } from "wouter"
|
|
6
|
-
|
|
7
|
-
export default function StaticViewSnippetHeader({
|
|
8
|
-
author,
|
|
9
|
-
snippetName,
|
|
10
|
-
}: {
|
|
11
|
-
author: string
|
|
12
|
-
snippetName: string
|
|
13
|
-
}) {
|
|
14
|
-
const snippet_data = {
|
|
15
|
-
owner_name: author,
|
|
16
|
-
unscoped_name: snippetName,
|
|
17
|
-
//sample values
|
|
18
|
-
snippet_type: "board",
|
|
19
|
-
is_starred: false,
|
|
20
|
-
star_count: 0,
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
return (
|
|
24
|
-
<header className="bg-white border-b border-gray-200 py-4 px-6">
|
|
25
|
-
<div className="flex items-center justify-between">
|
|
26
|
-
<div className="flex items-center">
|
|
27
|
-
<h1 className="text-xl font-bold mr-2">
|
|
28
|
-
<Link
|
|
29
|
-
href={`/${snippet_data.owner_name}`}
|
|
30
|
-
className="text-blue-600"
|
|
31
|
-
>
|
|
32
|
-
{snippet_data.owner_name}
|
|
33
|
-
</Link>
|
|
34
|
-
<span className="px-1 text-gray-500">/</span>
|
|
35
|
-
<Link
|
|
36
|
-
className="text-blue-600"
|
|
37
|
-
href={`/${snippet_data.owner_name}/${snippet_data.unscoped_name}`}
|
|
38
|
-
>
|
|
39
|
-
{snippet_data.unscoped_name}
|
|
40
|
-
</Link>
|
|
41
|
-
</h1>
|
|
42
|
-
{snippet_data.snippet_type && (
|
|
43
|
-
<TypeBadge type={snippet_data.snippet_type} />
|
|
44
|
-
)}
|
|
45
|
-
</div>
|
|
46
|
-
<div className="flex items-center space-x-2">
|
|
47
|
-
<Button
|
|
48
|
-
size="sm"
|
|
49
|
-
disabled
|
|
50
|
-
aria-label="Loading placeholder"
|
|
51
|
-
className="loading-placeholder"
|
|
52
|
-
>
|
|
53
|
-
<Star className="w-4 h-4 mr-2" />
|
|
54
|
-
Star
|
|
55
|
-
</Button>
|
|
56
|
-
|
|
57
|
-
<Button
|
|
58
|
-
size="sm"
|
|
59
|
-
disabled
|
|
60
|
-
aria-label="Loading placeholder"
|
|
61
|
-
className="loading-placeholder"
|
|
62
|
-
>
|
|
63
|
-
<GitFork className="w-4 h-4 mr-2" />
|
|
64
|
-
Fork
|
|
65
|
-
</Button>
|
|
66
|
-
</div>
|
|
67
|
-
</div>
|
|
68
|
-
</header>
|
|
69
|
-
)
|
|
70
|
-
}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import { Clock, FileText, Folder, Tag } from "lucide-react"
|
|
2
|
-
import { useCurrentPackageInfo } from "@/hooks/use-current-package-info"
|
|
3
|
-
import { usePackageReleaseById } from "@/hooks/use-package-release"
|
|
4
|
-
import { Skeleton } from "@/components/ui/skeleton"
|
|
5
|
-
import { timeAgo } from "@/lib/utils/timeAgo"
|
|
6
|
-
|
|
7
|
-
export default function FileExplorer() {
|
|
8
|
-
const { packageInfo } = useCurrentPackageInfo()
|
|
9
|
-
const { data: packageRelease } = usePackageReleaseById(
|
|
10
|
-
packageInfo?.latest_package_release_id,
|
|
11
|
-
)
|
|
12
|
-
|
|
13
|
-
return (
|
|
14
|
-
<div className="border border-gray-200 dark:border-[#30363d] rounded-md overflow-hidden">
|
|
15
|
-
<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]">
|
|
16
|
-
{/* Desktop view */}
|
|
17
|
-
<div className="hidden md:flex items-center text-xs">
|
|
18
|
-
<Tag className="h-4 w-4 mr-1 text-gray-500 dark:text-[#8b949e]" />
|
|
19
|
-
{packageRelease?.version ? (
|
|
20
|
-
<span className="text-gray-500 dark:text-[#8b949e]">
|
|
21
|
-
v{packageRelease.version}
|
|
22
|
-
</span>
|
|
23
|
-
) : (
|
|
24
|
-
<Skeleton className="h-4 w-16" />
|
|
25
|
-
)}
|
|
26
|
-
<div className="ml-2 text-green-500 dark:text-[#3fb950]">✓</div>
|
|
27
|
-
</div>
|
|
28
|
-
<div className="hidden md:flex ml-auto items-center text-xs text-gray-500 dark:text-[#8b949e]">
|
|
29
|
-
<Clock className="h-4 w-4 mr-1" />
|
|
30
|
-
{packageRelease?.created_at ? (
|
|
31
|
-
<span>{timeAgo(new Date(packageRelease.created_at))}</span>
|
|
32
|
-
) : (
|
|
33
|
-
<Skeleton className="h-4 w-16" />
|
|
34
|
-
)}
|
|
35
|
-
<div className="ml-4 flex items-center">
|
|
36
|
-
<Tag className="h-4 w-4 mr-1" />
|
|
37
|
-
{packageRelease ? (
|
|
38
|
-
<span>v{packageRelease.version}</span>
|
|
39
|
-
) : (
|
|
40
|
-
<Skeleton className="h-4 w-16" />
|
|
41
|
-
)}
|
|
42
|
-
</div>
|
|
43
|
-
</div>
|
|
44
|
-
|
|
45
|
-
{/* Mobile view */}
|
|
46
|
-
<div className="md:hidden flex items-center justify-between w-full">
|
|
47
|
-
<div className="flex items-center">
|
|
48
|
-
<span className="text-xs text-gray-500 dark:text-[#8b949e]">
|
|
49
|
-
v{packageRelease?.version}
|
|
50
|
-
</span>
|
|
51
|
-
<div className="ml-1 text-green-500 dark:text-[#3fb950]">✓</div>
|
|
52
|
-
</div>
|
|
53
|
-
<div className="flex items-center space-x-3 text-xs text-gray-500 dark:text-[#8b949e]">
|
|
54
|
-
<div className="flex items-center">
|
|
55
|
-
<Clock className="h-3 w-3 mr-0.5" />
|
|
56
|
-
<span>2d</span>
|
|
57
|
-
</div>
|
|
58
|
-
<div className="flex items-center">
|
|
59
|
-
<Tag className="h-3 w-3 mr-0.5" />
|
|
60
|
-
<span>12</span>
|
|
61
|
-
</div>
|
|
62
|
-
</div>
|
|
63
|
-
</div>
|
|
64
|
-
</div>
|
|
65
|
-
</div>
|
|
66
|
-
)
|
|
67
|
-
}
|