@svadmin/ui 0.88.1 → 0.92.0

package/dist/app.css

@@ -5830,6 +5830,9 @@
   .overflow-x-auto {
     overflow-x: auto;
   }
+  .rounded {
+    border-radius: 0.25rem;
+  }
   .rounded-lg {
     border-radius: var(--radius);
   }
@@ -8180,6 +8183,7 @@ main {
   position: fixed;
   z-index: 50;
   display: flex;
+  box-sizing: border-box;
   height: 100%;
   width: 75%;
   max-width: 24rem;

package/dist/app.theme.css

@@ -5830,6 +5830,9 @@
   .overflow-x-auto {
     overflow-x: auto;
   }
+  .rounded {
+    border-radius: 0.25rem;
+  }
   .rounded-lg {
     border-radius: var(--radius);
   }
@@ -8180,6 +8183,7 @@ main {
   position: fixed;
   z-index: 50;
   display: flex;
+  box-sizing: border-box;
   height: 100%;
   width: 75%;
   max-width: 24rem;

package/dist/component-registry.svelte.d.ts

@@ -4,7 +4,7 @@
  * Allows users to override any registered component via the `components`
  * prop on `AdminApp`, while providing sensible defaults.
  */
-import { type Component } from 'svelte';
+import { type Component, type ComponentProps } from 'svelte';
 import type Layout from './components/Layout.svelte';
 import type Sidebar from './components/Sidebar.svelte';
 import type Header from './components/Header.svelte';
@@ -25,7 +25,7 @@ export interface ComponentRegistry {
     Header: typeof Header;
     LoginPage: typeof LoginPage;
     AutoTable: typeof AutoTable;
-    AutoForm: typeof AutoForm;
+    AutoForm: Component<ComponentProps<typeof AutoForm>>;
     ShowPage: typeof ShowPage;
     ErrorPage?: typeof ErrorPage;
     Button: typeof Button;

package/dist/components/AboutSettings.svelte

@@ -8,7 +8,7 @@
 
   const i18n = useTranslation();
   const adminContext = captureAdminContext();
-  const resources = $derived(adminContext.resources);
+  const resources = $derived(adminContext.resources.filter((resource) => resource.meta?.['aboutVisible'] !== false));
   const providerNames = $derived(adminContext.getDataProviderNames());
   let { version: suppliedVersion, headingLevel = 'h1' }: { version?: string; headingLevel?: 'h1' | 'h2' } = $props();
   const buildVersion = '__SVADMIN_VERSION__';
@@ -17,6 +17,25 @@
       ? (i18n.locale === 'zh-CN' ? '开发构建（未提供版本）' : 'Development build (version unavailable)')
       : buildVersion
   ));
+  const themeLabelKeys: Record<string, string> = {
+    light: 'settings.light',
+    dark: 'settings.dark',
+    system: 'settings.systemTheme',
+  };
+  const accentLabelKeys: Record<string, string> = {
+    neutral: 'settings.accent.neutral',
+    indigo: 'settings.accent.indigo',
+    blue: 'settings.accent.blue',
+    green: 'settings.accent.green',
+    rose: 'settings.accent.rose',
+    orange: 'settings.accent.orange',
+    violet: 'settings.accent.violet',
+    stripe: 'settings.accent.stripe',
+  };
+  function environmentLabel(value: string, labelKeys: Record<string, string>): string {
+    const key = labelKeys[value];
+    return key ? i18n.t(key) : value;
+  }
 </script>
 
 <div class="svadmin-u-b3542e058833">
@@ -25,12 +44,12 @@
     <DescriptionList columns={2} items={[
       { label: i18n.t('settings.version'), value: version },
       { label: i18n.t('settings.language'), value: i18n.locale },
-      { label: i18n.t('settings.themeMode'), value: getResolvedTheme() },
-      { label: i18n.t('settings.colorAccent'), value: getColorTheme() },
+      { label: i18n.t('settings.themeMode'), value: environmentLabel(getResolvedTheme(), themeLabelKeys) },
+      { label: i18n.t('settings.colorAccent'), value: environmentLabel(getColorTheme(), accentLabelKeys) },
     ]} />
     <div class="svadmin-u-b950dda299d3 svadmin-u-18049387f0af svadmin-u-52be28846b5f">
       <h3 class="svadmin-u-fc7473ca09eb svadmin-u-2689f3958069 svadmin-u-d4108abe6359">{i18n.t('settings.registeredResources')}</h3>
-      <div class="svadmin-u-eccd13ef4f2f svadmin-u-60fbb7713999 svadmin-u-1eb5c6df38c1 svadmin-u-77a2a20e90d4">{#each resources as resource (resource.name)}<Badge variant="outline" class="svadmin-u-0e65706bcccd svadmin-u-359090c2d529">{resource.name}</Badge>{:else}<span class="svadmin-u-fc7473ca09eb svadmin-u-bfa603190748">—</span>{/each}</div>
+      <div class="svadmin-u-eccd13ef4f2f svadmin-u-60fbb7713999 svadmin-u-1eb5c6df38c1 svadmin-u-77a2a20e90d4">{#each resources as resource (resource.name)}<Badge variant="outline" class="svadmin-u-359090c2d529">{resource.label || resource.name}</Badge>{:else}<span class="svadmin-u-fc7473ca09eb svadmin-u-bfa603190748">—</span>{/each}</div>
     </div>
     <div class="svadmin-u-b950dda299d3 svadmin-u-18049387f0af svadmin-u-52be28846b5f">
       <h3 class="svadmin-u-fc7473ca09eb svadmin-u-2689f3958069 svadmin-u-d4108abe6359">{i18n.t('settings.dataProvider')}</h3>

package/dist/components/AdminApp.svelte

@@ -1,9 +1,9 @@
 <script module lang="ts">
-  import type { Component as SvelteComponent } from 'svelte';
+  import type { Component as PageComponent } from 'svelte';
 
   export interface AdminPageRoute {
     readonly path: string;
-    readonly component: SvelteComponent<{ route: string; params: Record<string, string | undefined> }>;
+    readonly component: PageComponent<{ route: string; params: Record<string, string | undefined> }>;
     readonly title?: string;
   }
 
@@ -215,7 +215,7 @@
   // Default component registry
   const defaultComponents: ComponentRegistry = {
     Layout, Sidebar, Header,
-    LoginPage, AutoTable, AutoForm, ShowPage,
+    LoginPage, AutoTable, AutoForm: AutoForm as unknown as ComponentRegistry['AutoForm'], ShowPage,
     TaskQueueDrawer, ErrorPage,
     Button, Input, Badge, Skeleton,
   };
@@ -406,7 +406,7 @@
     const resource = renderedParams['resource']
       ? resources.find((candidate) => candidate.name === renderedParams['resource'])
       : undefined;
-    let pageLabel = '';
+    let pageLabel: string;
 
     if (resource) {
       pageLabel = resource.label || resource.name;
@@ -432,6 +432,8 @@
       pageLabel = translation.t('auth.login');
     } else if (renderedRoute === '/' || renderedRoute === '/inventory-dashboard') {
       pageLabel = translation.t('common.dashboard');
+    } else {
+      pageLabel = translation.t('common.pageNotFound');
     }
 
     return pageLabel && pageLabel !== title ? `${pageLabel} - ${title}` : title;

package/dist/components/AdminApp.svelte.d.ts

@@ -1,7 +1,7 @@
-import { SvelteComponent } from "svelte";
+import type { Component as PageComponent } from 'svelte';
 export interface AdminPageRoute {
     readonly path: string;
-    readonly component: SvelteComponent<{
+    readonly component: PageComponent<{
         route: string;
         params: Record<string, string | undefined>;
     }>;
@@ -101,6 +101,6 @@ interface Props {
     /** Optional TanStack Query default options override when QueryClient is not supplied. */
     queryClientDefaultOptions?: DefaultOptions;
 }
-declare const AdminApp: Component<Props, {}, "locale">;
+declare const AdminApp: PageComponent<Props, {}, "locale">;
 type AdminApp = ReturnType<typeof AdminApp>;
 export default AdminApp;

package/dist/components/ApiSettings.svelte

@@ -20,6 +20,11 @@
   const adminContext = captureAdminContext();
   const credentialProvider = $derived(adminContext.credentialProvider);
   const isZh = $derived(i18n.locale === 'zh-CN');
+  function permissionLabel(permission: string): string {
+    const key = `api.permission.${permission.toLowerCase()}`;
+    const translated = i18n.t(key);
+    return translated === key ? permission : translated;
+  }
 
   let keys = $state.raw<ApiCredentialSummary[]>([]);
   let webhooks = $state.raw<WebhookSummary[]>([]);
@@ -32,7 +37,7 @@
   let newWebhookUrl = $state('');
   let newWebhookEvent = $state('resource.created');
   let loading = $state(false);
-  let error = $state<string | null>(null);
+  let error = $state(false);
   let submitting = $state(false);
   let requestId = 0;
   let pendingDanger = $state<{ label: string; run: () => Promise<void> } | null>(null);
@@ -46,8 +51,8 @@
     } };
   }
 
-  function message(error: unknown): string {
-    return error instanceof Error ? error.message : String(error);
+  function failureMessage(): string {
+    return i18n.t('common.operationFailed');
   }
 
   async function loadCredentials(): Promise<void> {
@@ -59,7 +64,7 @@
     generatedSecret = '';
     copied = false;
     copyError = '';
-    error = null;
+    error = false;
     pendingDanger = null;
     deleting = false;
     loading = false;
@@ -71,8 +76,8 @@
       if (currentRequest !== requestId) return;
       keys = nextKeys;
       webhooks = nextWebhooks;
-    } catch (caught) {
-      if (currentRequest === requestId) error = message(caught);
+    } catch {
+      if (currentRequest === requestId) error = true;
     } finally {
       if (currentRequest === requestId) loading = false;
     }
@@ -90,7 +95,7 @@
     const provider = credentialProvider;
     const currentRequest = requestId;
     const context = adminContext.enterpriseRequestContext;
-    if (!provider || !newWebhookName.trim() || !newWebhookUrl.trim()) return;
+    if (!provider || submitting || !newWebhookName.trim() || !newWebhookUrl.trim()) return;
     submitting = true;
     try {
       const webhook = await provider.createWebhook({ name: newWebhookName.trim(), url: newWebhookUrl.trim(), eventType: newWebhookEvent }, context);
@@ -98,9 +103,9 @@
       webhooks = [...webhooks, webhook];
       newWebhookName = '';
       newWebhookUrl = '';
-    } catch (caught) {
+    } catch {
       if (currentRequest !== requestId) return;
-      notifyWithProvider({ type: 'error', message: message(caught) }, adminContext.notificationProvider);
+      notifyWithProvider({ type: 'error', message: failureMessage() }, adminContext.notificationProvider);
     } finally {
       if (currentRequest === requestId) submitting = false;
     }
@@ -111,7 +116,7 @@
     const provider = credentialProvider;
     const currentRequest = requestId;
     const context = adminContext.enterpriseRequestContext;
-    if (!provider || !newKeyName.trim()) return;
+    if (!provider || submitting || !newKeyName.trim()) return;
     submitting = true;
     try {
       const permissions = Object.entries(newKeyPermissions).filter(([, enabled]) => enabled).map(([name]) => name);
@@ -123,9 +128,9 @@
       copyError = '';
       newKeyName = '';
       newKeyPermissions = { Read: true, Write: false, Delete: false, Admin: false };
-    } catch (caught) {
+    } catch {
       if (currentRequest !== requestId) return;
-      notifyWithProvider({ type: 'error', message: message(caught) }, adminContext.notificationProvider);
+      notifyWithProvider({ type: 'error', message: failureMessage() }, adminContext.notificationProvider);
     } finally {
       if (currentRequest === requestId) submitting = false;
     }
@@ -142,12 +147,12 @@
     if (!provider) return;
     try {
       const result = await provider.revokeApiCredential(id, context);
-      if (!result.success) throw new Error(result.error?.message ?? (isZh ? '密钥撤销失败' : 'Credential revocation failed'));
+      if (!result.success) throw new Error('Credential revocation failed');
       if (currentRequest !== requestId) return;
       keys = keys.filter((key) => key.id !== id);
-    } catch (caught) {
+    } catch {
       if (currentRequest !== requestId) return;
-      notifyWithProvider({ type: 'error', message: message(caught) }, adminContext.notificationProvider);
+      notifyWithProvider({ type: 'error', message: failureMessage() }, adminContext.notificationProvider);
     }
   }
 
@@ -162,12 +167,12 @@
     if (!provider) return;
     try {
       const result = await provider.deleteWebhook(id, context);
-      if (!result.success) throw new Error(result.error?.message ?? (isZh ? 'Webhook 删除失败' : 'Webhook deletion failed'));
+      if (!result.success) throw new Error('Webhook deletion failed');
       if (currentRequest !== requestId) return;
       webhooks = webhooks.filter((webhook) => webhook.id !== id);
-    } catch (caught) {
+    } catch {
       if (currentRequest !== requestId) return;
-      notifyWithProvider({ type: 'error', message: message(caught) }, adminContext.notificationProvider);
+      notifyWithProvider({ type: 'error', message: failureMessage() }, adminContext.notificationProvider);
     }
   }
 
@@ -200,13 +205,13 @@
       {/if}
     {/snippet}
     {#snippet primary()}
+      {#if loading}
+        <DataState state="loading" />
+      {:else if error}
+        <DataState state="error" description={failureMessage()} retry={loadCredentials} />
+      {:else}
       <div class="svadmin-u-b3542e058833">
         <SettingsGroup title={i18n.t('api.activeKeysTitle')} description={i18n.t('api.activeKeysDesc')} bodyClass="p-0">
-          {#if loading}
-            <DataState state="loading" />
-          {:else if error}
-            <DataState state="error" description={error} retry={loadCredentials} />
-          {:else}
             <ApiKeyList
               class="svadmin-u-0c5e9137c7de svadmin-u-119b2aa0b8f6"
               keys={keys.map((key) => definedOptions({
@@ -219,7 +224,6 @@
               stateDescription={credentialProvider ? i18n.t('api.generateDesc') : (isZh ? '配置 CredentialProvider 后可管理真实凭据。' : 'Configure CredentialProvider to manage real credentials.')}
               {...definedOptions({ onrevoke: credentialProvider ? (key: { id: string }) => revokeKey(key.id) : undefined })}
             />
-          {/if}
         </SettingsGroup>
         <SettingsGroup title={i18n.t('api.webhooks')} description={i18n.t('api.webhooksDesc')} bodyClass="space-y-5">
           <form class="svadmin-u-f3c543ad5fe9 svadmin-u-7e0b7cdf1a94 svadmin-u-0c3bc98565dd svadmin-u-e4d6f343b9ff" onsubmit={handleAddWebhook}>
@@ -244,23 +248,35 @@
               <Button type="submit" class="svadmin-u-6da6a3c3f741" disabled={!credentialProvider || submitting || !newWebhookName.trim() || !newWebhookUrl.trim()}><Plus class="svadmin-u-f7b5fa971871" />{i18n.t('api.addWebhook')}</Button>
             </div>
           </form>
-          {#if webhooks.length === 0}<DataState state="empty" title={i18n.t('api.noWebhooks')} description={credentialProvider ? i18n.t('api.webhooksDesc') : (isZh ? '配置 CredentialProvider 后可管理真实 Webhook。' : 'Configure CredentialProvider to manage real webhooks.')} />{:else}<div class="svadmin-u-fa6acbf81d74 svadmin-u-e783642739e3 svadmin-u-b950dda299d3 svadmin-u-18049387f0af">{#each webhooks as hook (hook.id)}<div class="svadmin-u-60fbb7713999 svadmin-u-8dddea0773ed svadmin-u-1004c0c3954c svadmin-u-cb11fec3bb46 svadmin-u-020ba687fa12 svadmin-u-9f76a62f4f44 svadmin-u-3b9871a0bf93"><div class="svadmin-u-7e0b7cdf1a94"><p class="svadmin-u-fc7473ca09eb svadmin-u-2689f3958069 svadmin-u-d4108abe6359">{hook.name}</p><p class="svadmin-u-f283ea9bea0e svadmin-u-0e65706bcccd svadmin-u-359090c2d529 svadmin-u-bfa603190748">{hook.url}</p></div><div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-8ef2268efbbc svadmin-u-1004c0c3954c svadmin-u-1f51d781e606"><span class="svadmin-u-07389a777c1f svadmin-u-2ef11f1cb219 svadmin-u-d5eab218aa34 svadmin-u-660d2effb880 svadmin-u-0e65706bcccd svadmin-u-359090c2d529 svadmin-u-bfa603190748">{hook.eventType}</span><Button variant="ghost" size="icon-sm" onclick={() => deleteWebhook(hook.id)} aria-label={i18n.t('common.delete') + ' ' + hook.name}><Trash2 class="svadmin-u-f7b5fa971871" /></Button></div></div>{/each}</div>{/if}
+          {#if webhooks.length === 0}
+            <DataState state="empty" title={i18n.t('api.noWebhooks')} description={credentialProvider ? i18n.t('api.webhooksDesc') : (isZh ? '配置 CredentialProvider 后可管理真实 Webhook。' : 'Configure CredentialProvider to manage real webhooks.')} />
+          {:else}
+            <div class="svadmin-u-fa6acbf81d74 svadmin-u-e783642739e3 svadmin-u-b950dda299d3 svadmin-u-18049387f0af">
+              {#each webhooks as hook (hook.id)}
+                <div class="svadmin-u-60fbb7713999 svadmin-u-8dddea0773ed svadmin-u-1004c0c3954c svadmin-u-cb11fec3bb46 svadmin-u-020ba687fa12 svadmin-u-9f76a62f4f44 svadmin-u-3b9871a0bf93">
+                  <div class="svadmin-u-7e0b7cdf1a94"><p class="svadmin-u-fc7473ca09eb svadmin-u-2689f3958069 svadmin-u-d4108abe6359">{hook.name}</p><p class="svadmin-u-f283ea9bea0e svadmin-u-0e65706bcccd svadmin-u-359090c2d529 svadmin-u-bfa603190748">{hook.url}</p></div>
+                  <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-8ef2268efbbc svadmin-u-1004c0c3954c svadmin-u-1f51d781e606"><span class="svadmin-u-07389a777c1f svadmin-u-2ef11f1cb219 svadmin-u-d5eab218aa34 svadmin-u-660d2effb880 svadmin-u-0e65706bcccd svadmin-u-359090c2d529 svadmin-u-bfa603190748">{hook.eventType}</span><Button variant="ghost" size="icon-sm" onclick={() => deleteWebhook(hook.id)} aria-label={i18n.t('common.delete') + ' ' + hook.name}><Trash2 class="svadmin-u-f7b5fa971871" /></Button></div>
+                </div>
+              {/each}
+            </div>
+          {/if}
         </SettingsGroup>
       </div>
+      {/if}
     {/snippet}
     {#snippet secondary()}
       <SettingsGroup title={i18n.t('api.generateTitle')} description={i18n.t('api.generateDesc')}>
         <form onsubmit={handleGenerateKey} class="svadmin-u-b43b4c086d9a">
           <div class="svadmin-u-6f7e013d6499">
             <Label for={`${controlId}-api-key-name`}>{i18n.t('api.keyName')}</Label>
-            <Input id={`${controlId}-api-key-name`} placeholder="CI deployment token" bind:value={newKeyName} required disabled={!credentialProvider || submitting} />
+            <Input id={`${controlId}-api-key-name`} placeholder={i18n.t('api.keyNamePlaceholder')} bind:value={newKeyName} required disabled={!credentialProvider || submitting} />
           </div>
           <fieldset class="svadmin-u-6ed543e2fbbb" disabled={!credentialProvider || submitting}>
             <legend class="svadmin-u-fc7473ca09eb svadmin-u-2689f3958069 svadmin-u-d4108abe6359">{i18n.t('api.permissions')}</legend>
             {#each Object.keys(newKeyPermissions) as permission (permission)}
               <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-77a2a20e90d4">
                 <Checkbox id={`${controlId}-perm-${permission}`} bind:checked={newKeyPermissions[permission as keyof typeof newKeyPermissions]} />
-                <Label for={`${controlId}-perm-${permission}`} class="svadmin-u-34516836730d svadmin-u-fc7473ca09eb svadmin-u-8ecebc9f80e6">{permission}</Label>
+                <Label for={`${controlId}-perm-${permission}`} class="svadmin-u-34516836730d svadmin-u-fc7473ca09eb svadmin-u-8ecebc9f80e6">{permissionLabel(permission)}</Label>
               </div>
             {/each}
           </fieldset>

package/dist/components/ApprovalActionCard.svelte

@@ -67,9 +67,8 @@
     }
   });
 
-  function failureMessage(caught: unknown): string {
-    if (caught instanceof Error && caught.message.trim()) return caught.message;
-    return isZh ? '操作失败，请检查输入后重试。' : 'Action failed. Check the input and retry.';
+  function failureMessage(): string {
+    return i18n.t('common.operationFailed');
   }
 
   async function handleApprove() {
@@ -79,8 +78,8 @@
       await onapprove?.(approveComment || undefined);
       approveDialogOpen = false;
       approveComment = '';
-    } catch (caught) {
-      errorMessage = failureMessage(caught);
+    } catch {
+      errorMessage = failureMessage();
     } finally {
       isSubmitting = false;
     }
@@ -94,8 +93,8 @@
       await onreject?.(rejectReason);
       rejectDialogOpen = false;
       rejectReason = '';
-    } catch (caught) {
-      errorMessage = failureMessage(caught);
+    } catch {
+      errorMessage = failureMessage();
     } finally {
       isSubmitting = false;
     }
@@ -109,8 +108,8 @@
       await ontransfer?.(transferTarget);
       transferDialogOpen = false;
       transferTarget = '';
-    } catch (caught) {
-      errorMessage = failureMessage(caught);
+    } catch {
+      errorMessage = failureMessage();
     } finally {
       isSubmitting = false;
     }

package/dist/components/ApprovalCenter.svelte

@@ -45,6 +45,7 @@
   let epoch = 0;
   let requestScope: EnterpriseProviderRequestContext | undefined;
   let generatedRequestContext: EnterpriseProviderRequestContext | undefined;
+  let lastTransition: ApprovalTransition | undefined;
   onDestroy(() => { mounted = false; clearTimeout(timer); });
 
   const activeRecord = $derived(records.find(record => record.id === selectedId));
@@ -73,9 +74,14 @@
   }
 
   async function load(): Promise<void> {
+    if (actionPending) return;
     const currentEpoch = ++epoch;
+    lastTransition = undefined;
     loading = true;
     error = undefined;
+    records = [];
+    actionDialog = undefined;
+    actionOpen = false;
     try {
       const scope = resolveRequestContext();
       requestScope = scope;
@@ -124,9 +130,11 @@
   }
 
   function openAction(action: string): void {
+    if (loading || actionPending) return;
     if (!activeRecord?.allowedActions.some(candidate => candidate.id === action)) return;
     actionDialog = action;
     actionOpen = true;
+    error = undefined;
     comment = '';
     targetId = '';
   }
@@ -135,21 +143,30 @@
     const record = activeRecord;
     const action = activeAction;
     const scope = requestScope;
-    if (!record || !action || !scope || !provider.transition || actionPending) return;
+    if (!record || !action || !scope || !provider.transition || actionPending || loading) return;
     let input: ApprovalTransition;
     try {
+      const target = targetId.trim() || undefined;
+      // 原样重试复用标识；不同载荷不能共用幂等键。
+      const previous = lastTransition;
+      const retry = previous?.id === record.id
+        && previous.expectedVersion === record.version
+        && previous.action === action.id
+        && previous.comment === comment
+        && previous.targetId === target;
       input = decodeApprovalTransition({
         id: record.id,
         expectedVersion: record.version,
         action: action.id,
         comment,
-        ...(targetId.trim() ? { targetId: targetId.trim() } : {}),
-        idempotencyKey: `${record.id}:${record.version}:${action.id}:${crypto.randomUUID()}`,
+        ...(target ? { targetId: target } : {}),
+        idempotencyKey: retry ? previous.idempotencyKey : `${record.id}:${record.version}:${action.id}:${crypto.randomUUID()}`,
       }, record);
     } catch {
       error = 'action';
       return;
     }
+    lastTransition = { ...input };
     actionPending = true;
     const actionEpoch = epoch;
     error = undefined;
@@ -160,6 +177,7 @@
         error = 'conflict';
         return;
       }
+      lastTransition = undefined;
       actionDialog = undefined;
       actionOpen = false;
       records = records.map(candidate => candidate.id === receipt.record.id ? receipt.record : candidate);
@@ -201,7 +219,7 @@
     <div>
       <h2>{title ?? i18n.t('approval.title')}</h2>
     </div>
-    <Button type="button" variant="outline" size="sm" aria-label={i18n.t('common.refresh')} onclick={() => void load()}>
+    <Button type="button" variant="outline" size="sm" aria-label={i18n.t('common.refresh')} disabled={loading || actionPending} onclick={() => void load()}>
       <RefreshCw class={loading ? 'svadmin-approval-center__spin' : ''} />
     </Button>
   </header>
@@ -213,7 +231,7 @@
       <Input value={search} oninput={scheduleSearch} placeholder={i18n.t('approval.search')} aria-label={i18n.t('approval.search')} />
     </label>
   </div>
-  {#if error && records.length > 0}
+  {#if error && records.length > 0 && !actionOpen}
     <div role="alert">{i18n.t(`approval.${error}`)}</div>
   {/if}
   <div class="svadmin-approval-center__body" data-svadmin-approval-body>
@@ -293,6 +311,7 @@
           <Input bind:value={targetId} required maxlength={200} />
         </label>
       {/if}
+      {#if error}<div role="alert">{i18n.t(`approval.${error}`)}</div>{/if}
       <Dialog.Footer>
         <Button type="button" variant="outline" onclick={() => { actionOpen = false; actionDialog = undefined; }}>{i18n.t('common.cancel')}</Button>
         <Button type="button" disabled={actionPending || !activeAction || !canSubmit(activeAction)} onclick={() => void submitAction()}>

package/dist/components/AuditLogViewer.svelte

@@ -56,9 +56,9 @@
       if (currentId !== requestId) return;
       logs = result.data;
       total = result.total;
-    } catch (e) {
+    } catch {
       if (currentId !== requestId) return;
-      error = e instanceof Error ? e.message : String(e);
+      error = i18n.t('common.error') ?? 'Something went wrong';
       toast.error(error);
     } finally {
       if (currentId === requestId) loading = false;