Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-14 16:51:38 +10:00
Code Issues Packages Projects Releases Wiki Activity

chore: loading spinner

Browse Source
This commit is contained in:
Catalin Pit
2024-02-16 13:44:28 +02:00
parent a1459b41fd
commit cd240ae8a4
2 changed files with 15 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/web/src/app/(dashboard)/settings/webhooks/[id]/page.tsx
View File

@ -3,6 +3,7 @@
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { Loader } from 'lucide-react';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import type { z } from 'zod'; import type { z } from 'zod';
@ -39,7 +40,7 @@ export default function WebhookPage({ params }: WebhookPageOptions) {
const { toast } = useToast(); const { toast } = useToast();
const router = useRouter(); const router = useRouter();
const { data: webhook } = trpc.webhook.getWebhookById.useQuery( const { data: webhook, isLoading } = trpc.webhook.getWebhookById.useQuery(
{ {
id: Number(params.id), id: Number(params.id),
}, },
@ -87,6 +88,11 @@ export default function WebhookPage({ params }: WebhookPageOptions) {
title="Edit webhook" title="Edit webhook"
subtitle="On this page, you can edit the webhook and its settings." subtitle="On this page, you can edit the webhook and its settings."
/> />
{isLoading && (
<div className="absolute inset-0 z-50 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
</div>
)}
<Form {...form}> <Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)}> <form onSubmit={form.handleSubmit(onSubmit)}>
<fieldset className="flex h-full flex-col gap-y-6" disabled={form.formState.isSubmitting}> <fieldset className="flex h-full flex-col gap-y-6" disabled={form.formState.isSubmitting}>

9
apps/web/src/app/(dashboard)/settings/webhooks/page.tsx
View File

@ -4,6 +4,7 @@ import Link from 'next/link';
import { Zap } from 'lucide-react'; import { Zap } from 'lucide-react';
import { ToggleLeft, ToggleRight } from 'lucide-react'; import { ToggleLeft, ToggleRight } from 'lucide-react';
import { Loader } from 'lucide-react';
import { trpc } from '@documenso/trpc/react'; import { trpc } from '@documenso/trpc/react';
import { Button } from '@documenso/ui/primitives/button'; import { Button } from '@documenso/ui/primitives/button';
@ -13,7 +14,7 @@ import { CreateWebhookDialog } from '~/components/(dashboard)/settings/webhooks/
import { DeleteWebhookDialog } from '~/components/(dashboard)/settings/webhooks/delete-webhook-dialog'; import { DeleteWebhookDialog } from '~/components/(dashboard)/settings/webhooks/delete-webhook-dialog';
export default function WebhookPage() { export default function WebhookPage() {
const { data: webhooks } = trpc.webhook.getWebhooks.useQuery(); const { data: webhooks, isLoading } = trpc.webhook.getWebhooks.useQuery();
return ( return (
<div> <div>
@ -24,6 +25,12 @@ export default function WebhookPage() {
<CreateWebhookDialog /> <CreateWebhookDialog />
</SettingsHeader> </SettingsHeader>
{isLoading && (
<div className="absolute inset-0 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
</div>
)}
{webhooks && webhooks.length === 0 && ( {webhooks && webhooks.length === 0 && (
// TODO: Perhaps add some illustrations here to make the page more engaging // TODO: Perhaps add some illustrations here to make the page more engaging
<div className="mb-4"> <div className="mb-4">