+5 -12

apps/web/src/app/app/(dashboard)/[workspaceId]/monitors/_components/action-button.tsx

··· 37 37 DropdownMenuTrigger, 38 38 } from "@/components/ui/dropdown-menu"; 39 39 import { wait } from "@/lib/utils"; 40 40 + import { api } from "@/trpc/client"; 40 41 41 42 type Schema = z.infer<typeof insertMonitorSchema>; 42 43 43 43 - interface Props { 44 44 - // TODO: use type instead! 45 45 - workspaceId: number; 46 46 - url: string; 47 47 - name: string; 48 48 - description: string; 49 49 - } 50 50 - 51 51 - // TODO: add correct types 52 52 - export function ActionButton({ workspaceId, ...props }: Props) { 44 44 + export function ActionButton(props: Schema) { 53 45 const router = useRouter(); 54 46 const [dialogOpen, setDialogOpen] = React.useState(false); 55 47 const [alertOpen, setAlertOpen] = React.useState(false); ··· 57 49 58 50 async function onUpdate(values: Schema) { 59 51 setSaving(true); 60 60 - await wait(1000); // TODO: update monitor 52 52 + await api.monitor.updateMonitor.mutate({ id: props.id, ...values }); 61 53 router.refresh(); 62 54 setSaving(false); 63 55 setDialogOpen(false); ··· 65 57 66 58 async function onDelete() { 67 59 setSaving(true); 68 68 - await wait(1000); // TODO: delete monitor 60 60 + await api.monitor.deleteMonitor.mutate({ monitorId: Number(props.id) }); 61 61 + router.refresh(); 69 62 setSaving(false); 70 63 setAlertOpen(false); 71 64 }

+1 -1

apps/web/src/app/app/(dashboard)/[workspaceId]/monitors/page.tsx

··· 23 23 </Header> 24 24 {monitors.map((monitor, index) => ( 25 25 <Container key={index} title={monitor.name} description={monitor.url}> 26 26 - <ActionButton {...{ ...monitor, workspaceId }} /> 26 26 + <ActionButton {...monitor} /> 27 27 </Container> 28 28 ))} 29 29 </div>

+4 -3

apps/web/src/components/forms/montitor-form.tsx

··· 43 43 url: defaultValues?.url || "", 44 44 name: defaultValues?.name || "", 45 45 description: defaultValues?.description || "", 46 46 + periodicity: defaultValues?.periodicity || undefined, 46 47 }, 47 48 }); 48 49 ··· 103 104 name="periodicity" 104 105 render={({ field }) => ( 105 106 <FormItem> 106 106 - <FormLabel>Email</FormLabel> 107 107 + <FormLabel>Periodicity</FormLabel> 107 108 <Select 108 109 onValueChange={(value) => 109 110 field.onChange(periodicityEnum.parse(value)) ··· 112 113 > 113 114 <FormControl> 114 115 <SelectTrigger> 115 115 - <SelectValue placeholder="How often it should check" /> 116 116 + <SelectValue placeholder="How often should it check your endpoint?" /> 116 117 </SelectTrigger> 117 118 </FormControl> 118 119 <SelectContent> ··· 132 133 </SelectContent> 133 134 </Select> 134 135 <FormDescription> 135 135 - You can manage email addresses in your{" "} 136 136 + How often your endpoint will be checked 136 137 </FormDescription> 137 138 <FormMessage /> 138 139 </FormItem>

+13 -2

packages/api/src/router/monitor.ts

··· 34 34 .where(eq(monitor.id, opts.input.monitorId)) 35 35 .execute(); 36 36 }), 37 37 - 37 37 + updateMonitor: protectedProcedure 38 38 + .input(insertMonitorSchema) 39 39 + .mutation(async (opts) => { 40 40 + console.log(opts.input); 41 41 + const r = await opts.ctx.db 42 42 + .update(monitor) 43 43 + .set(opts.input) 44 44 + .where(eq(monitor.id, Number(opts.input.id))) 45 45 + .execute(); 46 46 + console.log(r); 47 47 + return r; 48 48 + }), 38 49 updateMonitorStatus: protectedProcedure 39 50 .input( 40 51 z.object({ ··· 43 54 }), 44 55 ) 45 56 .mutation(async (opts) => { 46 46 - await opts.ctx.db 57 57 + return await opts.ctx.db 47 58 .update(monitor) 48 59 .set(opts.input.status) 49 60 .where(eq(monitor.id, opts.input.id))