mirror/fosrl.pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2025-07-21 11:15:13 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Fix small issues

Browse source
This commit is contained in:
Owen Schwartz 2024-10-19 21:50:00 -04:00
parent bf106c221e
commit 1c9d90bca4
No known key found for this signature in database
GPG key ID: 8271FDFFD9E0CCBD
4 changed files with 106 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/app/[orgId]/resources/[resourceId]/components/ClientLayout.tsx
View file

@ -5,7 +5,7 @@ import { useResourceContext } from "@app/hooks/useResourceContext";
const sidebarNavItems = [ const sidebarNavItems = [
{ {
title: "Create", title: "General",
href: "/{orgId}/resources/{resourceId}", href: "/{orgId}/resources/{resourceId}",
}, },
{ {

4
src/app/[orgId]/resources/[resourceId]/components/CreateResource.tsx
View file

@ -182,7 +182,7 @@ export function CreateResourceForm() {
variant="outline" variant="outline"
role="combobox" role="combobox"
className={cn( className={cn(
"w-[200px] justify-between", "w-[350px] justify-between",
!field.value && "text-muted-foreground" !field.value && "text-muted-foreground"
)} )}
> >
@ -195,7 +195,7 @@ export function CreateResourceForm() {
</Button> </Button>
</FormControl> </FormControl>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent className="w-[200px] p-0"> <PopoverContent className="w-[350px] p-0">
<Command> <Command>
<CommandInput placeholder="Search site..." /> <CommandInput placeholder="Search site..." />
<CommandList> <CommandList>

120
src/app/[orgId]/resources/[resourceId]/components/GeneralForm.tsx
View file

@ -18,6 +18,8 @@ import {
FormLabel, FormLabel,
FormMessage, FormMessage,
} from "@/components/ui/form" } from "@/components/ui/form"
import { CalendarIcon, CaretSortIcon, CheckIcon, ChevronDownIcon } from "@radix-ui/react-icons"
import { Input } from "@/components/ui/input" import { Input } from "@/components/ui/input"
import { import {
Select, Select,
@ -27,45 +29,66 @@ import {
SelectValue, SelectValue,
} from "@/components/ui/select" } from "@/components/ui/select"
import { Textarea } from "@/components/ui/textarea" import { Textarea } from "@/components/ui/textarea"
import {
Command,
CommandEmpty,
CommandGroup,
CommandInput,
CommandItem,
CommandList,
} from "@/components/ui/command"
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover"
import { useResourceContext } from "@app/hooks/useResourceContext" import { useResourceContext } from "@app/hooks/useResourceContext"
import { ListSitesResponse } from "@server/routers/site"
import { useEffect, useState } from "react"
import { AxiosResponse } from "axios"
import api from "@app/api"
import { useParams } from "next/navigation";
const GeneralFormSchema = z.object({ const GeneralFormSchema = z.object({
name: z.string() name: z.string(),
// email: z siteId: z.number()
// .string({
// required_error: "Please select an email to display.",
// })
// .email(),
// bio: z.string().max(160).min(4),
// urls: z
// .array(
// z.object({
// value: z.string().url({ message: "Please enter a valid URL." }),
// })
// )
// .optional(),
}) })
type GeneralFormValues = z.infer<typeof GeneralFormSchema> type GeneralFormValues = z.infer<typeof GeneralFormSchema>
export function GeneralForm() { export function GeneralForm() {
const params = useParams();
const orgId = params.orgId;
const { resource, updateResource } = useResourceContext(); const { resource, updateResource } = useResourceContext();
const [sites, setSites] = useState<ListSitesResponse["sites"]>([]);
const form = useForm<GeneralFormValues>({ const form = useForm<GeneralFormValues>({
resolver: zodResolver(GeneralFormSchema), resolver: zodResolver(GeneralFormSchema),
defaultValues: { defaultValues: {
name: resource?.name name: resource?.name,
siteId: resource?.siteId
}, },
mode: "onChange", mode: "onChange",
}) })
useEffect(() => {
if (typeof window !== "undefined") {
const fetchSites = async () => {
const res = await api.get<AxiosResponse<ListSitesResponse>>(`/org/${orgId}/sites/`);
setSites(res.data.data.sites);
};
fetchSites();
}
}, []);
// const { fields, append } = useFieldArray({ // const { fields, append } = useFieldArray({
// name: "urls", // name: "urls",
// control: form.control, // control: form.control,
// }) // })
async function onSubmit(data: GeneralFormValues) { async function onSubmit(data: GeneralFormValues) {
await updateResource({ name: data.name }); await updateResource({ name: data.name, siteId: data.siteId });
} }
return ( return (
@ -87,6 +110,69 @@ export function GeneralForm() {
</FormItem> </FormItem>
)} )}
/> />
<FormField
control={form.control}
name="siteId"
render={({ field }) => (
<FormItem className="flex flex-col">
<FormLabel>Site</FormLabel>
<Popover>
<PopoverTrigger asChild>
<FormControl>
<Button
variant="outline"
role="combobox"
className={cn(
"w-[350px] justify-between",
!field.value && "text-muted-foreground"
)}
>
{field.value
? sites.find(
(site) => site.siteId === field.value
)?.name
: "Select site"}
<CaretSortIcon className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[350px] p-0">
<Command>
<CommandInput placeholder="Search site..." />
<CommandList>
<CommandEmpty>No site found.</CommandEmpty>
<CommandGroup>
{sites.map((site) => (
<CommandItem
value={site.name}
key={site.siteId}
onSelect={() => {
form.setValue("siteId", site.siteId)
}}
>
<CheckIcon
className={cn(
"mr-2 h-4 w-4",
site.siteId === field.value
? "opacity-100"
: "opacity-0"
)}
/>
{site.name}
</CommandItem>
))}
</CommandGroup>
</CommandList>
</Command>
</PopoverContent>
</Popover>
<FormDescription>
This is the site that will be used in the dashboard.
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
{/* <FormField {/* <FormField
control={form.control} control={form.control}
name="email" name="email"

0
src/components/SiteSearch.tsx Normal file
View file