mirror of
https://github.com/fosrl/pangolin.git
synced 2025-07-21 11:15:13 +02:00
Fix small issues
This commit is contained in:
parent
bf106c221e
commit
1c9d90bca4
4 changed files with 106 additions and 20 deletions
|
@ -5,7 +5,7 @@ import { useResourceContext } from "@app/hooks/useResourceContext";
|
|||
|
||||
const sidebarNavItems = [
|
||||
{
|
||||
title: "Create",
|
||||
title: "General",
|
||||
href: "/{orgId}/resources/{resourceId}",
|
||||
},
|
||||
{
|
||||
|
|
|
@ -182,7 +182,7 @@ export function CreateResourceForm() {
|
|||
variant="outline"
|
||||
role="combobox"
|
||||
className={cn(
|
||||
"w-[200px] justify-between",
|
||||
"w-[350px] justify-between",
|
||||
!field.value && "text-muted-foreground"
|
||||
)}
|
||||
>
|
||||
|
@ -195,7 +195,7 @@ export function CreateResourceForm() {
|
|||
</Button>
|
||||
</FormControl>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="w-[200px] p-0">
|
||||
<PopoverContent className="w-[350px] p-0">
|
||||
<Command>
|
||||
<CommandInput placeholder="Search site..." />
|
||||
<CommandList>
|
||||
|
|
|
@ -18,6 +18,8 @@ import {
|
|||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@/components/ui/form"
|
||||
import { CalendarIcon, CaretSortIcon, CheckIcon, ChevronDownIcon } from "@radix-ui/react-icons"
|
||||
|
||||
import { Input } from "@/components/ui/input"
|
||||
import {
|
||||
Select,
|
||||
|
@ -27,45 +29,66 @@ import {
|
|||
SelectValue,
|
||||
} from "@/components/ui/select"
|
||||
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 { 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({
|
||||
name: z.string()
|
||||
// email: z
|
||||
// .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(),
|
||||
name: z.string(),
|
||||
siteId: z.number()
|
||||
})
|
||||
|
||||
type GeneralFormValues = z.infer<typeof GeneralFormSchema>
|
||||
|
||||
export function GeneralForm() {
|
||||
export function GeneralForm() {
|
||||
const params = useParams();
|
||||
const orgId = params.orgId;
|
||||
const { resource, updateResource } = useResourceContext();
|
||||
const [sites, setSites] = useState<ListSitesResponse["sites"]>([]);
|
||||
|
||||
const form = useForm<GeneralFormValues>({
|
||||
resolver: zodResolver(GeneralFormSchema),
|
||||
defaultValues: {
|
||||
name: resource?.name
|
||||
name: resource?.name,
|
||||
siteId: resource?.siteId
|
||||
},
|
||||
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({
|
||||
// name: "urls",
|
||||
// control: form.control,
|
||||
// })
|
||||
|
||||
async function onSubmit(data: GeneralFormValues) {
|
||||
await updateResource({ name: data.name });
|
||||
await updateResource({ name: data.name, siteId: data.siteId });
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -87,6 +110,69 @@ export function GeneralForm() {
|
|||
</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
|
||||
control={form.control}
|
||||
name="email"
|
||||
|
|
0
src/components/SiteSearch.tsx
Normal file
0
src/components/SiteSearch.tsx
Normal file
Loading…
Add table
Add a link
Reference in a new issue