betterstart-cli 0.0.98 → 0.0.100

package/dist/assets/adapters/next/templates/init/lib/actions/users/change-user-password.ts

@@ -7,6 +7,7 @@ import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { user } from '@admin/db/schema'
 import { runAdminEventHooks } from '@admin/lib/lifecycle-hooks'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { headers } from 'next/headers'
@@ -71,7 +72,7 @@ export async function changeUserPassword(
   } catch (error) {
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to change user password'
+      error: toActionError(error, 'Failed to change user password')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/users/create-user.ts

@@ -8,6 +8,7 @@ import db from '@admin/db'
 import { user } from '@admin/db/schema'
 import { runAdminEventHooks } from '@admin/lib/lifecycle-hooks'
 import { getTouchedFieldNames } from '@admin/utils/audit/audit'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { usersCacheTags } from './types'
@@ -67,7 +68,7 @@ export async function createUser(input: CreateUserInput): Promise<CreateUserResu
   } catch (error) {
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to create user'
+      error: toActionError(error, 'Failed to create user')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/users/delete-user.ts

@@ -6,6 +6,7 @@ import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { user } from '@admin/db/schema'
 import { runAdminEventHooks } from '@admin/lib/lifecycle-hooks'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { usersCacheTags } from './types'
@@ -40,7 +41,7 @@ export async function deleteUser(userId: string): Promise<DeleteUserResult> {
   } catch (error) {
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to delete user'
+      error: toActionError(error, 'Failed to delete user')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/users/update-user-role.ts

@@ -6,6 +6,7 @@ import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { user } from '@admin/db/schema'
 import { runAdminEventHooks } from '@admin/lib/lifecycle-hooks'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { usersCacheTags } from './types'
@@ -44,7 +45,7 @@ export async function updateUserRole(
   } catch (error) {
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to update user role'
+      error: toActionError(error, 'Failed to update user role')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/create-webhook.ts

@@ -4,6 +4,7 @@ import type { CreateWebhookInput, WebhookResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhookSubscriptions, webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { generateWebhookSecret } from '@admin/utils/webhook/signature'
 import { updateTag } from 'next/cache'
 import { webhooksCacheTags } from './types'
@@ -49,7 +50,7 @@ export async function createWebhook(input: CreateWebhookInput): Promise<WebhookR
     console.error('Error creating webhook:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to create webhook'
+      error: toActionError(error, 'Failed to create webhook')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/delete-webhook.ts

@@ -4,6 +4,7 @@ import type { WebhookResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { webhooksCacheTags } from './types'
@@ -20,7 +21,7 @@ export async function deleteWebhook(id: string): Promise<WebhookResult> {
     console.error('Error deleting webhook:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to delete webhook'
+      error: toActionError(error, 'Failed to delete webhook')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/get-webhook-secret.ts

@@ -4,6 +4,7 @@ import type { WebhookSecretResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { eq } from 'drizzle-orm'
 
 export async function getWebhookSecret(id: string): Promise<WebhookSecretResult> {
@@ -22,7 +23,7 @@ export async function getWebhookSecret(id: string): Promise<WebhookSecretResult>
     console.error('Error fetching webhook secret:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to fetch webhook secret'
+      error: toActionError(error, 'Failed to fetch webhook secret')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/regenerate-webhook-secret.ts

@@ -4,6 +4,7 @@ import type { WebhookSecretResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { generateWebhookSecret } from '@admin/utils/webhook/signature'
 import { eq } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
@@ -29,7 +30,7 @@ export async function regenerateWebhookSecret(id: string): Promise<WebhookSecret
     console.error('Error regenerating webhook secret:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to regenerate webhook secret'
+      error: toActionError(error, 'Failed to regenerate webhook secret')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/send-test-webhook.ts

@@ -4,6 +4,7 @@ import type { SendTestWebhookResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { createWebhookEventId, signWebhookPayload } from '@admin/utils/webhook/signature'
 import { eq } from 'drizzle-orm'
 import { recordWebhookDelivery } from './dispatch'
@@ -75,7 +76,7 @@ export async function sendTestWebhook(id: string): Promise<SendTestWebhookResult
     console.error('Error sending test webhook:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to send test webhook'
+      error: toActionError(error, 'Failed to send test webhook')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/lib/actions/webhooks/update-webhook.ts

@@ -4,6 +4,7 @@ import type { UpdateWebhookInput, WebhookResult } from './types'
 import { requireRole, UserRole } from '@admin/auth/middleware'
 import db from '@admin/db'
 import { webhookSubscriptions, webhooks } from '@admin/db/schema'
+import { toActionError } from '@admin/utils/error/action-error'
 import { and, eq, notInArray } from 'drizzle-orm'
 import { updateTag } from 'next/cache'
 import { webhooksCacheTags } from './types'
@@ -66,7 +67,7 @@ export async function updateWebhook(id: string, input: UpdateWebhookInput): Prom
     console.error('Error updating webhook:', error)
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Failed to update webhook'
+      error: toActionError(error, 'Failed to update webhook')
     }
   }
 }

package/dist/assets/adapters/next/templates/init/pages/forgot-password-form.tsx

@@ -7,8 +7,8 @@ import { Button } from '@admin/components/ui/button'
 import { Card, CardContent } from '@admin/components/ui/card'
 import { Field, FieldGroup, FieldLabel } from '@admin/components/ui/field'
 import { Input } from '@admin/components/ui/input'
+import { Spinner } from '@admin/components/ui/spinner'
 import { cn } from '@admin/utils/shared/cn'
-import { LoaderCircle } from 'lucide-react'
 import Image from 'next/image'
 import Link from 'next/link'
 
@@ -39,7 +39,7 @@ export function ForgotPasswordForm({ className, ...props }: React.ComponentProps
         }
         setSuccess(true)
       } catch {
-        setError('An error occurred. Please try again.')
+        setError('Failed to send the reset link. Try again.')
       }
     })
   }
@@ -68,7 +68,7 @@ export function ForgotPasswordForm({ className, ...props }: React.ComponentProps
                   </p>
                 </div>
                 <Link href="/admin/login" className="text-sm underline-offset-4 hover:underline">
-                  Back to login
+                  Back to sign in
                 </Link>
               </FieldGroup>
             ) : (
@@ -101,16 +101,16 @@ export function ForgotPasswordForm({ className, ...props }: React.ComponentProps
                       />
                     </Field>
                     <Field className="pt-4">
-                      <Button type="submit" disabled={isPending}>
-                        {isPending && <LoaderCircle className="animate-spin" />}
-                        {isPending ? 'Sending...' : 'Send Reset Link'}
+                      <Button type="submit" disabled={isPending} aria-busy={isPending}>
+                        {isPending && <Spinner />}
+                        {isPending ? 'Sending…' : 'Send Reset Link'}
                       </Button>
                     </Field>
                     <Link
                       href="/admin/login"
                       className="text-center text-sm underline-offset-4 hover:underline"
                     >
-                      Back to login
+                      Back to sign in
                     </Link>
                   </div>
                 </FieldGroup>

package/dist/assets/adapters/next/templates/init/pages/login-form.tsx

@@ -6,9 +6,9 @@ import { Button } from '@admin/components/ui/button'
 import { Card, CardContent } from '@admin/components/ui/card'
 import { Field, FieldGroup, FieldLabel } from '@admin/components/ui/field'
 import { Input } from '@admin/components/ui/input'
+import { Spinner } from '@admin/components/ui/spinner'
 import { getAdminPostLoginPath } from '@admin/utils/auth/roles'
 import { cn } from '@admin/utils/shared/cn'
-import { LoaderCircle } from 'lucide-react'
 import Image from 'next/image'
 import Link from 'next/link'
 import { useRouter } from 'next/navigation'
@@ -45,7 +45,7 @@ export function LoginForm({ className, ...props }: React.ComponentProps<'div'>)
         router.replace(getAdminPostLoginPath(role))
         router.refresh()
       } catch {
-        setError('An error occurred. Please try again.')
+        setError('Failed to sign you in. Try again.')
       }
     })
   }
@@ -67,11 +67,11 @@ export function LoginForm({ className, ...props }: React.ComponentProps<'div'>)
             <FieldGroup className="gap-10 pb-12">
               <div className="flex flex-col items-start">
                 <h1 className="text-xl font-medium">Welcome back</h1>
-                <p className="text-balance text-muted-foreground">Login to your account</p>
+                <p className="text-balance text-muted-foreground">Sign in to your account</p>
               </div>
               {resetSuccess ? (
                 <div className="rounded-md bg-emerald-500/10 p-3 text-sm text-emerald-700 dark:text-emerald-400">
-                  Password reset successfully. Please log in with your new password.
+                  Password reset. Sign in with your new password.
                 </div>
               ) : null}
               {error ? (
@@ -116,9 +116,9 @@ export function LoginForm({ className, ...props }: React.ComponentProps<'div'>)
                   />
                 </Field>
                 <Field className="pt-4">
-                  <Button type="submit" disabled={isPending}>
-                    {isPending && <LoaderCircle className="animate-spin" />}
-                    {isPending ? 'Signing in...' : 'Login'}
+                  <Button type="submit" disabled={isPending} aria-busy={isPending}>
+                    {isPending && <Spinner />}
+                    {isPending ? 'Signing in…' : 'Sign in'}
                   </Button>
                 </Field>
               </div>

package/dist/assets/adapters/next/templates/init/pages/login-page.tsx

@@ -4,7 +4,7 @@ import { LoginPageRsc } from './login-page-rsc'
 import { LoginPageSkeleton } from './login-page-skeleton'
 
 export const metadata: Metadata = {
-  title: 'Admin Login',
+  title: 'Admin sign in',
   robots: { index: false, follow: false }
 }
 

package/dist/assets/adapters/next/templates/init/pages/media/media-page-content.tsx

@@ -156,12 +156,13 @@ export function MediaPageContent() {
     mutationFn: (ids: string[]) => deleteMediaBulk(ids),
     onSuccess: (result, ids) => {
       if (result.success) {
-        const suffix = ids.length === 1 ? '' : 's'
-        toast.success(`Deleted ${ids.length} file${suffix}`)
+        toast.success(
+          ids.length === 1 ? '1 media item deleted' : `${ids.length} media items deleted`
+        )
         void setSelectedIds([])
         queryClient.invalidateQueries({ queryKey: ['media'] })
       } else {
-        toast.error(result.error ?? 'Failed to delete files')
+        toast.error(result.error ?? 'Failed to delete the selected media')
       }
     }
   })
@@ -169,7 +170,7 @@ export function MediaPageContent() {
   return (
     <React.Fragment>
       <PageHeader
-        title="Media Gallery"
+        title="Media"
         actions={
           <Tabs defaultValue="upload">
             <TabsList>

package/dist/assets/adapters/next/templates/init/pages/profile/profile-form.tsx

@@ -29,8 +29,8 @@ import {
   FormMessage
 } from '@admin/components/ui/form'
 import { Input } from '@admin/components/ui/input'
+import { Spinner } from '@admin/components/ui/spinner'
 import { standardSchemaResolver } from '@hookform/resolvers/standard-schema'
-import { LoaderCircle } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import { useForm } from 'react-hook-form'
 import { toast } from 'sonner'
@@ -139,7 +139,7 @@ export function ProfileForm({ user }: ProfileFormProps) {
         })
         router.refresh()
       } catch {
-        toast.error('An error occurred while updating your profile')
+        toast.error('Failed to update your profile. Try again.')
       }
     })
   }
@@ -164,7 +164,7 @@ export function ProfileForm({ user }: ProfileFormProps) {
           confirmPassword: ''
         })
       } catch {
-        toast.error('An error occurred while changing your password')
+        toast.error('Failed to change your password. Try again.')
       }
     })
   }
@@ -187,7 +187,7 @@ export function ProfileForm({ user }: ProfileFormProps) {
         }
         toast.success('Check your email for a password reset link')
       } catch {
-        toast.error('An error occurred while sending the reset link')
+        toast.error('Failed to send the reset link. Try again.')
       }
     })
   }
@@ -297,10 +297,11 @@ export function ProfileForm({ user }: ProfileFormProps) {
               <Button
                 type="submit"
                 disabled={profilePending || !profileForm.formState.isDirty}
+                aria-busy={profilePending}
                 className="ml-auto min-w-25"
               >
-                {profilePending && <LoaderCircle className="animate-spin" />}
-                {profilePending ? 'Saving...' : 'Save'}
+                {profilePending && <Spinner />}
+                {profilePending ? 'Saving…' : 'Save'}
               </Button>
             </CardFooter>
           </Card>
@@ -375,10 +376,11 @@ export function ProfileForm({ user }: ProfileFormProps) {
               <Button
                 type="submit"
                 disabled={passwordPending || !passwordForm.formState.isDirty}
+                aria-busy={passwordPending}
                 className="ml-auto min-w-25"
               >
-                {passwordPending && <LoaderCircle className="animate-spin" />}
-                {passwordPending ? 'Changing...' : 'Change Password'}
+                {passwordPending && <Spinner />}
+                {passwordPending ? 'Changing…' : 'Change Password'}
               </Button>
             </CardFooter>
           </Card>
@@ -401,10 +403,11 @@ export function ProfileForm({ user }: ProfileFormProps) {
             type="button"
             className="ml-auto min-w-25"
             disabled={resetPending}
+            aria-busy={resetPending}
             onClick={handleResetPassword}
           >
-            {resetPending && <LoaderCircle className="animate-spin" />}
-            {resetPending ? 'Sending...' : 'Reset Password'}
+            {resetPending && <Spinner />}
+            {resetPending ? 'Sending…' : 'Reset Password'}
           </Button>
         </CardFooter>
       </Card>

package/dist/assets/adapters/next/templates/init/pages/reset-password-form.tsx

@@ -6,8 +6,8 @@ import { Button } from '@admin/components/ui/button'
 import { Card, CardContent } from '@admin/components/ui/card'
 import { Field, FieldGroup, FieldLabel } from '@admin/components/ui/field'
 import { Input } from '@admin/components/ui/input'
+import { Spinner } from '@admin/components/ui/spinner'
 import { cn } from '@admin/utils/shared/cn'
-import { LoaderCircle } from 'lucide-react'
 import Image from 'next/image'
 import Link from 'next/link'
 import { useRouter } from 'next/navigation'
@@ -89,7 +89,7 @@ export function ResetPasswordForm({ className, ...props }: React.ComponentProps<
         await authClient.getSession({ query: { disableCookieCache: true } })
         router.push(serializeLoginUrl('/admin/login', { reset: 'success' }))
       } catch {
-        setError('An error occurred. Please try again.')
+        setError('Failed to reset your password. Try again.')
       }
     })
   }
@@ -146,9 +146,9 @@ export function ResetPasswordForm({ className, ...props }: React.ComponentProps<
                   />
                 </Field>
                 <Field className="pt-4">
-                  <Button type="submit" disabled={isPending}>
-                    {isPending && <LoaderCircle className="animate-spin" />}
-                    {isPending ? 'Resetting...' : 'Reset Password'}
+                  <Button type="submit" disabled={isPending} aria-busy={isPending}>
+                    {isPending && <Spinner />}
+                    {isPending ? 'Resetting…' : 'Reset Password'}
                   </Button>
                 </Field>
               </div>

package/dist/assets/adapters/next/templates/init/pages/settings/audit-log/audit-log-table.tsx

@@ -238,7 +238,9 @@ export function AuditLogTable<TValue>({
                 className="flex h-24 items-center justify-center text-center"
                 style={{ gridColumn: '1 / -1' }}
               >
-                <div className="text-destructive">Error loading Audit Logs: {error.message}</div>
+                <div className="text-destructive">
+                  Failed to load audit logs. Refresh to try again.
+                </div>
               </DataGridCell>
             </DataGridRow>
           ) : table.getRowModel().rows.length ? (

package/dist/assets/adapters/next/templates/init/pages/settings/forms/form-notifications-drawer.tsx

@@ -22,10 +22,10 @@ import {
   FormMessage
 } from '@admin/components/ui/form'
 import { ScrollArea } from '@admin/components/ui/scroll-area'
+import { Spinner } from '@admin/components/ui/spinner'
 import { Textarea } from '@admin/components/ui/textarea'
 import { standardSchemaResolver } from '@hookform/resolvers/standard-schema'
 import { useMutation, useQueryClient } from '@tanstack/react-query'
-import { LoaderCircle } from 'lucide-react'
 import { useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 import { z } from 'zod/v3'
@@ -75,7 +75,7 @@ export function FormNotificationsDrawer({
       onOpenChange(false)
     },
     onError: (error: Error) => {
-      toast.error(error.message || 'An unexpected error occurred')
+      toast.error(error.message || 'Failed to save these notification settings')
     }
   })
 
@@ -133,9 +133,14 @@ export function FormNotificationsDrawer({
                   Cancel
                 </Button>
               </DrawerClose>
-              <Button type="submit" disabled={isPending || !form.formState.isDirty} size="lg">
-                {isPending && <LoaderCircle className="animate-spin" />}
-                Save
+              <Button
+                type="submit"
+                disabled={isPending || !form.formState.isDirty}
+                aria-busy={isPending}
+                size="lg"
+              >
+                {isPending && <Spinner />}
+                {isPending ? 'Saving…' : 'Save'}
               </Button>
             </DrawerFooter>
           </form>

package/dist/assets/adapters/next/templates/init/pages/settings/webhooks/delete-webhook-dialog.tsx

@@ -12,8 +12,8 @@ import {
   DialogHeader,
   DialogTitle
 } from '@admin/components/ui/dialog'
+import { Spinner } from '@admin/components/ui/spinner'
 import { useMutation, useQueryClient } from '@tanstack/react-query'
-import { LoaderCircle } from 'lucide-react'
 import { toast } from 'sonner'
 
 interface DeleteWebhookDialogProps {
@@ -27,16 +27,16 @@ export function DeleteWebhookDialog({ webhook, open, onOpenChange }: DeleteWebho
 
   const mutation = useMutation({
     mutationFn: async () => {
-      if (!webhook) throw new Error('No endpoint selected')
+      if (!webhook) throw new Error('No webhook selected')
       const result = await deleteWebhook(webhook.id)
       if (!result.success) {
-        throw new Error(result.error || 'Failed to delete endpoint')
+        throw new Error(result.error || 'Failed to delete this webhook')
       }
 
       return result
     },
     onSuccess: async () => {
-      toast.success('Endpoint deleted')
+      toast.success('Webhook deleted')
       await queryClient.invalidateQueries({ queryKey: ['webhooks'] })
       await queryClient.invalidateQueries({
         queryKey: ['webhook-subscriptions']
@@ -45,7 +45,7 @@ export function DeleteWebhookDialog({ webhook, open, onOpenChange }: DeleteWebho
       onOpenChange(false)
     },
     onError: (error: Error) => {
-      toast.error(error.message || 'An unexpected error occurred')
+      toast.error(error.message || 'Failed to delete this webhook')
     }
   })
 
@@ -55,25 +55,34 @@ export function DeleteWebhookDialog({ webhook, open, onOpenChange }: DeleteWebho
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-105">
         <DialogHeader>
-          <DialogTitle>Delete endpoint</DialogTitle>
+          <DialogTitle>Delete webhook?</DialogTitle>
           <DialogDescription>
             {webhook
-              ? `"${webhook.name}" will stop receiving events. Its subscriptions and delivery history are removed too.`
-              : 'This endpoint will stop receiving events.'}
+              ? `"${webhook.name}" stops receiving events. Its subscriptions and delivery history are deleted too.`
+              : 'This webhook stops receiving events.'}
           </DialogDescription>
         </DialogHeader>
         <DialogBody>
           <p className="text-sm text-muted-foreground">This action cannot be undone.</p>
         </DialogBody>
         <DialogFooter showCloseButton={true}>
+          <Button
+            variant="secondary"
+            size="lg"
+            disabled={isPending}
+            onClick={() => onOpenChange(false)}
+          >
+            Cancel
+          </Button>
           <Button
             variant="destructive"
             size="lg"
             disabled={isPending}
+            aria-busy={isPending}
             onClick={() => mutation.mutate()}
           >
-            {isPending && <LoaderCircle className="animate-spin" />}
-            Delete
+            {isPending && <Spinner />}
+            {isPending ? 'Deleting…' : 'Delete webhook'}
           </Button>
         </DialogFooter>
       </DialogContent>

package/dist/assets/adapters/next/templates/init/pages/settings/webhooks/webhook-actions.tsx

@@ -8,8 +8,9 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger
 } from '@admin/components/ui/dropdown-menu'
+import { Spinner } from '@admin/components/ui/spinner'
 import { useSendTestWebhook } from '@admin/hooks/use-webhooks'
-import { LoaderCircle, MoreHorizontal } from 'lucide-react'
+import { MoreHorizontal } from 'lucide-react'
 
 interface WebhookActionsProps {
   webhook: WebhookEndpointListItem
@@ -30,7 +31,7 @@ export function WebhookActions({ webhook, onEdit, onDelete }: WebhookActionsProp
         >
           <span className="sr-only">Open webhook actions</span>
           {sendTest.isPending ? (
-            <LoaderCircle className="size-4 animate-spin" />
+            <Spinner className="size-4" />
           ) : (
             <MoreHorizontal className="size-4" />
           )}
@@ -39,9 +40,13 @@ export function WebhookActions({ webhook, onEdit, onDelete }: WebhookActionsProp
       <DropdownMenuContent align="end">
         <DropdownMenuItem
           disabled={sendTest.isPending}
-          onSelect={() => sendTest.mutate(webhook.id)}
+          aria-busy={sendTest.isPending}
+          onSelect={(event) => {
+            event.preventDefault()
+            sendTest.mutate(webhook.id)
+          }}
         >
-          Test
+          {sendTest.isPending ? 'Testing…' : 'Test'}
         </DropdownMenuItem>
         <DropdownMenuItem onSelect={() => onEdit(webhook)}>Edit</DropdownMenuItem>
         <DropdownMenuItem variant="destructive" onSelect={() => onDelete(webhook)}>