@nocobase/app-template-default 1.0.0-beta.59 → 1.0.0-beta.61

package/client/pages/home/index.tsx

@@ -0,0 +1,190 @@
+import { useTranslation } from '@nocobase/i18n/client';
+import {
+  ArrowRightIcon,
+  CheckIcon,
+  CopyIcon,
+  MessageSquareTextIcon,
+  SparklesIcon,
+} from 'lucide-react';
+import { type ReactElement, useState } from 'react';
+
+import { PageContainer } from '#components/page-container';
+import { Button } from '#components/ui/button';
+import {
+  Card,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from '#components/ui/card';
+
+import { CAPABILITIES, type Capability } from './capabilities.js';
+import { PromptDialog } from './prompt-dialog.js';
+import { useCopy } from './use-copy.js';
+
+const STEPS = ['describe', 'build', 'review'] as const;
+
+export default function HomePage(): ReactElement {
+  const { t } = useTranslation();
+  const [selected, setSelected] = useState<Capability>();
+  const [open, setOpen] = useState(false);
+  // Changes on every opening, so the dialog remounts and drops the edits of the previous one.
+  const [openCount, setOpenCount] = useState(0);
+
+  const openCapability = (capability: Capability): void => {
+    setSelected(capability);
+    setOpenCount((count) => count + 1);
+    setOpen(true);
+  };
+
+  return (
+    <PageContainer className='mx-auto max-w-6xl'>
+      <AgentIntro />
+      <section
+        aria-labelledby='home-capabilities'
+        className='flex flex-col gap-4'
+      >
+        <div className='flex flex-col gap-1'>
+          <h2 id='home-capabilities' className='text-base font-medium'>
+            {t('home.capabilitiesTitle')}
+          </h2>
+          <p className='text-sm text-muted-foreground'>
+            {t('home.capabilitiesDescription')}
+          </p>
+        </div>
+        <ul className='grid gap-4 sm:grid-cols-2 xl:grid-cols-3'>
+          {CAPABILITIES.map((capability) => (
+            <li key={capability.id} className='flex'>
+              <CapabilityCard
+                capability={capability}
+                onOpen={() => openCapability(capability)}
+              />
+            </li>
+          ))}
+        </ul>
+      </section>
+      {selected ? (
+        <PromptDialog
+          key={openCount}
+          capability={selected}
+          open={open}
+          onOpenChange={setOpen}
+        />
+      ) : null}
+    </PageContainer>
+  );
+}
+
+/** The first part of the page: development here happens by asking a coding agent, which the steps and sample show. */
+function AgentIntro(): ReactElement {
+  const { t } = useTranslation();
+  const { copied, copy } = useCopy();
+  const example = t('home.example.text');
+
+  return (
+    <section className='grid gap-8 rounded-2xl border border-border bg-linear-to-br from-primary/5 via-card to-card p-6 md:p-10 lg:grid-cols-[minmax(0,1fr)_minmax(0,1fr)] lg:items-center'>
+      <div className='flex flex-col gap-6'>
+        <div className='flex flex-col gap-4'>
+          <p className='flex items-center gap-2 text-sm font-medium text-primary'>
+            <SparklesIcon className='size-4' aria-hidden />
+            {t('home.platform')}
+          </p>
+          <h1 className='font-heading text-3xl font-semibold tracking-[-0.035em] text-balance md:text-4xl'>
+            {t('home.title')}
+          </h1>
+          <p className='text-base leading-7 text-muted-foreground'>
+            {t('home.description')}
+          </p>
+        </div>
+        <ol className='flex flex-col gap-3'>
+          {STEPS.map((step, index) => (
+            <li key={step} className='flex gap-3'>
+              <span className='flex size-6 shrink-0 items-center justify-center rounded-full bg-primary/10 text-xs font-medium text-primary'>
+                {index + 1}
+              </span>
+              <div className='flex flex-col gap-0.5'>
+                <span className='text-sm font-medium'>
+                  {t(`home.steps.${step}.title`)}
+                </span>
+                <span className='text-sm text-muted-foreground'>
+                  {t(`home.steps.${step}.description`)}
+                </span>
+              </div>
+            </li>
+          ))}
+        </ol>
+      </div>
+      <figure className='flex flex-col overflow-hidden rounded-xl border border-primary/10 bg-card shadow-sm'>
+        <figcaption className='flex items-center justify-between gap-2 border-b border-primary/10 px-4 py-2.5'>
+          <span className='flex items-center gap-2 text-sm font-medium'>
+            <MessageSquareTextIcon
+              className='size-4 text-primary'
+              aria-hidden
+            />
+            {t('home.example.title')}
+          </span>
+          <Button variant='ghost' size='sm' onClick={() => void copy(example)}>
+            {copied ? (
+              <CheckIcon data-icon='inline-start' />
+            ) : (
+              <CopyIcon data-icon='inline-start' />
+            )}
+            {copied ? t('home.prompt.copiedShort') : t('home.prompt.copy')}
+          </Button>
+        </figcaption>
+        <p className='bg-primary/5 px-4 py-4 text-sm leading-7 whitespace-pre-line'>
+          {example}
+        </p>
+        <p className='border-t border-primary/10 px-4 py-2.5 text-xs text-muted-foreground'>
+          {t('home.example.hint')}
+        </p>
+      </figure>
+    </section>
+  );
+}
+
+function CapabilityCard({
+  capability,
+  onOpen,
+}: {
+  readonly capability: Capability;
+  readonly onOpen: () => void;
+}): ReactElement {
+  const { t } = useTranslation();
+  const prefix = `home.capabilities.${capability.id}`;
+  const Icon = capability.icon;
+
+  return (
+    <button
+      type='button'
+      onClick={onOpen}
+      className='group flex w-full cursor-pointer rounded-xl text-left outline-none focus-visible:ring-3 focus-visible:ring-ring/50'
+    >
+      <Card className='w-full transition-[translate,box-shadow] duration-200 ease-out group-hover:-translate-y-0.5 group-hover:shadow-md group-hover:ring-foreground/20 motion-reduce:transition-none motion-reduce:group-hover:translate-y-0'>
+        <CardHeader className='gap-3'>
+          {/* The chip only deepens its tint on hover rather than inverting: swapping a light background and a dark icon
+              passes both through the same color halfway, where the icon vanishes for a moment and reads as a flicker. */}
+          <span className='flex size-9 items-center justify-center rounded-lg bg-primary/5 text-primary ring-1 ring-transparent transition-[background-color,box-shadow] duration-200 ease-out group-hover:bg-primary/10 group-hover:ring-primary/20 motion-reduce:transition-none'>
+            <Icon
+              className='size-4 transition-transform duration-200 ease-out group-hover:scale-110 motion-reduce:transition-none'
+              aria-hidden
+            />
+          </span>
+          <div className='flex flex-col gap-1'>
+            <CardTitle>{t(`${prefix}.title`)}</CardTitle>
+            <CardDescription className='leading-6'>
+              {t(`${prefix}.description`)}
+            </CardDescription>
+          </div>
+        </CardHeader>
+        <CardFooter className='mt-auto justify-between text-sm text-muted-foreground transition-colors duration-200 ease-out group-hover:text-foreground'>
+          {t('home.viewPrompts', { count: capability.prompts.length })}
+          <ArrowRightIcon
+            className='size-4 transition-transform duration-200 ease-out group-hover:translate-x-1 motion-reduce:transition-none'
+            aria-hidden
+          />
+        </CardFooter>
+      </Card>
+    </button>
+  );
+}

package/client/pages/home/prompt-dialog.tsx

@@ -0,0 +1,122 @@
+import { useTranslation } from '@nocobase/i18n/client';
+import { CheckIcon, CopyIcon, RotateCcwIcon } from 'lucide-react';
+import { type ReactElement, useState } from 'react';
+
+import { Button } from '#components/ui/button';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '#components/ui/dialog';
+import { Tabs, TabsList, TabsTrigger } from '#components/ui/tabs';
+import { Textarea } from '#components/ui/textarea';
+
+import type { Capability } from './capabilities.js';
+import { useCopy } from './use-copy.js';
+
+export interface PromptDialogProps {
+  readonly capability: Capability;
+  readonly open: boolean;
+  readonly onOpenChange: (open: boolean) => void;
+}
+
+/**
+ * The prompts of one capability, ready to hand to a coding agent. Each prompt can be edited before copying. Edits are
+ * not saved: the page mounts a new dialog each time one is opened, so it starts from the default wording again.
+ */
+export function PromptDialog({
+  capability,
+  open,
+  onOpenChange,
+}: PromptDialogProps): ReactElement {
+  const { t } = useTranslation();
+  const { copied, copy } = useCopy();
+  const [current, setCurrent] = useState(capability.prompts[0]);
+  // Edited text per prompt id; a prompt without an entry shows its default wording.
+  const [edits, setEdits] = useState<Readonly<Record<string, string>>>({});
+
+  const prefix = `home.capabilities.${capability.id}`;
+  const defaultText = t(`${prefix}.prompts.${current}.text`);
+  const text = edits[current] ?? defaultText;
+  const Icon = capability.icon;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className='gap-5 sm:max-w-2xl'>
+        <DialogHeader className='flex-row items-center gap-3 pr-8'>
+          <span className='flex size-10 shrink-0 items-center justify-center rounded-lg bg-primary/5 text-primary'>
+            <Icon className='size-5' aria-hidden />
+          </span>
+          <div className='flex min-w-0 flex-col gap-1.5'>
+            <DialogTitle>{t(`${prefix}.title`)}</DialogTitle>
+            <DialogDescription>{t(`${prefix}.description`)}</DialogDescription>
+          </div>
+        </DialogHeader>
+        <div className='flex flex-col gap-3'>
+          {capability.prompts.length > 1 ? (
+            <Tabs
+              value={current}
+              onValueChange={(value) => {
+                if (typeof value === 'string') setCurrent(value);
+              }}
+            >
+              <TabsList className='w-full'>
+                {capability.prompts.map((id) => (
+                  <TabsTrigger key={id} value={id}>
+                    {t(`${prefix}.prompts.${id}.label`)}
+                  </TabsTrigger>
+                ))}
+              </TabsList>
+            </Tabs>
+          ) : null}
+          <Textarea
+            aria-label={t('home.prompt.label')}
+            className='field-sizing-fixed h-60 max-h-[50dvh] resize-none leading-6'
+            value={text}
+            onChange={(event) =>
+              setEdits((previous) => ({
+                ...previous,
+                [current]: event.target.value,
+              }))
+            }
+          />
+          <p className='text-xs text-muted-foreground'>
+            {t('home.prompt.hint')}
+          </p>
+        </div>
+        <DialogFooter className='sm:items-center'>
+          <Button
+            variant='ghost'
+            className='sm:mr-auto'
+            disabled={text === defaultText}
+            onClick={() =>
+              setEdits((previous) => {
+                const rest = { ...previous };
+                delete rest[current];
+                return rest;
+              })
+            }
+          >
+            <RotateCcwIcon data-icon='inline-start' />
+            {t('home.prompt.reset')}
+          </Button>
+          <DialogClose render={<Button variant='outline' />}>
+            {t('actions.close')}
+          </DialogClose>
+          <Button disabled={text.trim() === ''} onClick={() => void copy(text)}>
+            {copied ? (
+              <CheckIcon data-icon='inline-start' />
+            ) : (
+              <CopyIcon data-icon='inline-start' />
+            )}
+            {copied ? t('home.prompt.copiedShort') : t('home.prompt.copy')}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

package/client/pages/home/use-copy.ts

@@ -0,0 +1,38 @@
+import { useToaster } from '@nocobase/app-client';
+import { useTranslation } from '@nocobase/i18n/client';
+import { useCallback, useEffect, useState } from 'react';
+
+export interface CopyState {
+  /** Whether the last copy succeeded within the past two seconds, for a button to show a check mark. */
+  readonly copied: boolean;
+  readonly copy: (text: string) => Promise<void>;
+}
+
+/** Copies text to the clipboard and reports the outcome in a toast. */
+export function useCopy(): CopyState {
+  const { t } = useTranslation();
+  const toaster = useToaster();
+  const [copied, setCopied] = useState(false);
+
+  useEffect(() => {
+    if (!copied) return;
+    const timer = setTimeout(() => setCopied(false), 2000);
+    return () => clearTimeout(timer);
+  }, [copied]);
+
+  const copy = useCallback(
+    async (text: string): Promise<void> => {
+      try {
+        await navigator.clipboard.writeText(text);
+        setCopied(true);
+        toaster.show({ type: 'success', title: t('home.prompt.copied') });
+      } catch {
+        // The Clipboard API is missing outside a secure context and rejects without permission.
+        toaster.show({ type: 'error', title: t('home.prompt.copyFailed') });
+      }
+    },
+    [t, toaster],
+  );
+
+  return { copied, copy };
+}

package/client/plugins.ts

@@ -15,6 +15,7 @@ import i18n from '@nocobase/app-plugin-i18n/client';
 import notification from '@nocobase/app-plugin-notification/client';
 import scheduler from '@nocobase/app-plugin-scheduler/client';
 import file from '@nocobase/app-plugin-file/client';
+import mail from '@nocobase/app-plugin-mail/client';
 
 // Array order is contribution order. A plugin is enabled by appearing in this
 // list; removing its entry and its import disables it.
@@ -32,6 +33,7 @@ const clientPlugins: AppClientPlugins = defineClientPlugins([
   notification(),
   file(),
   scheduler(),
+  mail(),
 ]);
 
 export default clientPlugins;

package/client/routes.ts

@@ -10,7 +10,7 @@ const appRoutes: AppClientRouteContribution = defineAppRoutes([
     // no permission change can leave a user signed in with nowhere to land.
     authz: 'skip',
     auth: 'required',
-    componentLoader: () => import('./pages/home.js'),
+    componentLoader: () => import('./pages/home/index.js'),
     name: 'home',
     navigation: { title: 'navigation.home', icon: Home },
     path: '/',

package/config.example.yml

@@ -137,6 +137,11 @@ snowflake:
 # scheduler:
 #   jobs: redis
 
+# Mail is registered by default. Configure mailbox provider instances before connecting accounts.
+# See .agents/skills/nocobase-app-plugin-mail/references/configuration-and-accounts.md.
+mail:
+  providers: {}
+
 # File logging is independent of terminal formatting.
 logging:
   level: info

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nocobase/app-template-default",
   "displayName": "Default Template",
-  "version": "1.0.0-beta.59",
+  "version": "1.0.0-beta.61",
   "type": "module",
   "prettier": "@nocobase/dev-config/prettier",
   "engines": {
@@ -9,7 +9,7 @@
   },
   "nocobase": {
     "templateKind": "app",
-    "defaultTemplateVersion": "1.0.0-beta.59"
+    "defaultTemplateVersion": "1.0.0-beta.61"
   },
   "devDependencies": {
     "@ai-sdk/react": "2.0.0",
@@ -77,7 +77,7 @@
     "tar": "^7.5.22",
     "@nocobase/app-client": "^3.0.0-beta.0",
     "@nocobase/app-plugin-template-print": "0.0.2-beta.1",
-    "@nocobase/app-skills": "0.1.0-beta.27",
+    "@nocobase/app-skills": "0.1.0-beta.29",
     "@nocobase/app-testing": "0.1.0-beta.2",
     "@nocobase/app-websocket": "^0.0.1",
     "@nocobase/dev-config": "0.1.0-beta.21",
@@ -142,11 +142,12 @@
     "better-auth": "1.7.5",
     "hono": "^4.13.2",
     "@nocobase/app-plugin-api-keys": "^1.0.0-beta.14",
-    "@nocobase/app-plugin-authentication": "^2.0.0-beta.3",
+    "@nocobase/app-plugin-authentication": "^2.0.0-beta.4",
     "@nocobase/app-plugin-authorization": "^1.0.0-beta.26",
     "@nocobase/app-plugin-database-explorer": "^1.0.0-beta.12",
     "@nocobase/app-plugin-file": "^1.0.0-beta.22",
     "@nocobase/app-plugin-i18n": "^1.0.0-beta.14",
+    "@nocobase/app-plugin-mail": "^1.0.0-beta.10",
     "@nocobase/app-plugin-notification": "^1.0.0-beta.25",
     "@nocobase/app-plugin-notification-in-app": "^1.0.0-beta.23",
     "@nocobase/app-plugin-notification-providers": "^0.2.0-beta.10",
@@ -164,10 +165,11 @@
     "@nocobase/authorization": "^1.0.0-beta.12",
     "@nocobase/queue": "^0.1.0-beta.8",
     "@nocobase/jobs": "^0.1.0-beta.2",
+    "@nocobase/lifecycle": "^0.1.0-beta.0",
     "@nocobase/i18n": "^1.0.0-beta.6",
     "@nocobase/caching": "^0.1.0-beta.2",
     "@nocobase/repository-input": "^0.1.0-beta.2",
-    "@nocobase/app-cli": "^1.0.0-beta.17"
+    "@nocobase/app-cli": "^1.0.0-beta.18"
   },
   "description": "NocoBase 3 application template with the standard product capabilities.",
   "imports": {

package/server/config/index.ts

@@ -5,6 +5,7 @@ import {
 import auth from './auth.js';
 import authorization from './authorization.js';
 import notification from './notification.js';
+import mail from './mail.js';
 import secrets from './secrets.js';
 import session from './session.js';
 import server from './server.js';
@@ -26,6 +27,7 @@ const defaultConfigs: AppConfigFactory<{
   auth: ReturnType<typeof auth>;
   authorization: ReturnType<typeof authorization>;
   notification: ReturnType<typeof notification>;
+  mail: ReturnType<typeof mail>;
   secrets: ReturnType<typeof secrets>;
   session: ReturnType<typeof session>;
   server: ReturnType<typeof server>;
@@ -46,6 +48,7 @@ const defaultConfigs: AppConfigFactory<{
   auth,
   authorization,
   notification,
+  mail,
   secrets,
   session,
   server,

package/server/config/mail.ts

@@ -0,0 +1,3 @@
+import { mailConfig } from '@nocobase/app-plugin-mail/server';
+
+export default mailConfig;

package/server/plugins.ts

@@ -16,6 +16,7 @@ import {
 } from '@nocobase/app-server/plugins';
 import scheduler from '@nocobase/app-plugin-scheduler/server';
 import file from '@nocobase/app-plugin-file/server';
+import mail from '@nocobase/app-plugin-mail/server';
 
 const serverPlugins: AppServerPlugins = defineServerPlugins([
   authentication,
@@ -32,6 +33,7 @@ const serverPlugins: AppServerPlugins = defineServerPlugins([
   notificationProviders,
   file,
   scheduler,
+  mail,
 ]);
 
 export default serverPlugins;

package/tests/components/home.test.tsx

@@ -0,0 +1,174 @@
+import {
+  TestI18nProvider,
+  createTestI18nRuntime,
+} from '@nocobase/i18n/testing';
+import { render, screen, waitFor, within } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import type { ReactElement, ReactNode } from 'react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import enUS from '../../client/locales/en-US.js';
+import zhCN from '../../client/locales/zh-CN.js';
+import HomePage from '../../client/pages/home/index.js';
+import { CAPABILITIES } from '../../client/pages/home/capabilities.js';
+
+const { toaster } = vi.hoisted(() => ({
+  toaster: { show: vi.fn(), close: vi.fn() },
+}));
+
+vi.mock('@nocobase/app-client', async (original) => ({
+  ...(await original<typeof import('@nocobase/app-client')>()),
+  useToaster: () => toaster,
+}));
+
+// Strict: a key the locale lacks fails the test instead of rendering as text.
+const runtime = await createTestI18nRuntime({
+  application: {
+    namespace: '@nocobase/app-template-default',
+    resources: enUS,
+  },
+});
+
+function I18n({ children }: { readonly children: ReactNode }): ReactElement {
+  return <TestI18nProvider runtime={runtime}>{children}</TestI18nProvider>;
+}
+
+const writeText = vi.fn<(text: string) => Promise<void>>();
+const clipboard = { fail: false };
+
+/** `userEvent.setup()` installs a clipboard stub of its own, so the mock goes in after it. */
+function setup(): ReturnType<typeof userEvent.setup> {
+  const user = userEvent.setup();
+  writeText
+    .mockReset()
+    .mockImplementation(() =>
+      clipboard.fail ? Promise.reject(new Error('denied')) : Promise.resolve(),
+    );
+  Object.defineProperty(navigator, 'clipboard', {
+    configurable: true,
+    value: { writeText },
+  });
+  return user;
+}
+
+describe('home page', () => {
+  beforeEach(() => {
+    toaster.show.mockReset();
+    clipboard.fail = false;
+  });
+
+  it('tells people to build by asking their coding agent', () => {
+    render(<HomePage />, { wrapper: I18n });
+
+    expect(
+      screen.getByRole('heading', { level: 1, name: enUS.home.title }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(enUS.home.steps.describe.title)).toBeVisible();
+  });
+
+  it('shows one card per built-in capability', () => {
+    render(<HomePage />, { wrapper: I18n });
+
+    for (const { id } of CAPABILITIES) {
+      const title =
+        enUS.home.capabilities[id as keyof typeof enUS.home.capabilities].title;
+      expect(
+        screen.getByRole('button', { name: new RegExp(title) }),
+      ).toBeInTheDocument();
+    }
+  });
+
+  it('opens a capability, switches prompts, and copies the edited text', async () => {
+    const user = setup();
+    render(<HomePage />, { wrapper: I18n });
+    const scheduler = enUS.home.capabilities.scheduler;
+
+    await user.click(
+      screen.getByRole('button', { name: new RegExp(scheduler.title) }),
+    );
+    const dialog = await screen.findByRole('dialog');
+    const prompt = within(dialog).getByRole('textbox', {
+      name: enUS.home.prompt.label,
+    });
+    expect(prompt).toHaveValue(scheduler.prompts.reminder.text);
+
+    await user.click(
+      within(dialog).getByRole('tab', {
+        name: scheduler.prompts.weeklyReport.label,
+      }),
+    );
+    expect(prompt).toHaveValue(scheduler.prompts.weeklyReport.text);
+
+    await user.clear(prompt);
+    await user.type(prompt, 'Every Friday');
+    await user.click(
+      within(dialog).getByRole('button', { name: enUS.home.prompt.copy }),
+    );
+
+    expect(writeText).toHaveBeenCalledWith('Every Friday');
+    expect(toaster.show).toHaveBeenCalledWith({
+      type: 'success',
+      title: enUS.home.prompt.copied,
+    });
+
+    await user.click(
+      within(dialog).getByRole('button', { name: enUS.home.prompt.reset }),
+    );
+    expect(prompt).toHaveValue(scheduler.prompts.weeklyReport.text);
+  });
+
+  it('starts from the default prompt each time the dialog opens', async () => {
+    const user = setup();
+    render(<HomePage />, { wrapper: I18n });
+    const theme = enUS.home.capabilities.theme;
+    const card = screen.getByRole('button', { name: new RegExp(theme.title) });
+
+    await user.click(card);
+    const prompt = within(await screen.findByRole('dialog')).getByRole(
+      'textbox',
+    );
+    await user.type(prompt, ' Edited.');
+    await user.keyboard('{Escape}');
+    await waitFor(() =>
+      expect(screen.queryByRole('dialog')).not.toBeInTheDocument(),
+    );
+
+    await user.click(card);
+    expect(
+      within(await screen.findByRole('dialog')).getByRole('textbox'),
+    ).toHaveValue(theme.prompts.changeTheme.text);
+  });
+
+  it('reports a copy the browser refuses', async () => {
+    clipboard.fail = true;
+    const user = setup();
+    render(<HomePage />, { wrapper: I18n });
+
+    await user.click(
+      screen.getAllByRole('button', { name: enUS.home.prompt.copy })[0],
+    );
+
+    expect(toaster.show).toHaveBeenCalledWith({
+      type: 'error',
+      title: enUS.home.prompt.copyFailed,
+    });
+  });
+});
+
+describe('home page copy', () => {
+  it('translates every capability prompt into Chinese', () => {
+    for (const { id, prompts } of CAPABILITIES) {
+      const key = id as keyof typeof zhCN.home.capabilities;
+      for (const prompt of prompts) {
+        const zh = (
+          zhCN.home.capabilities[key].prompts as Record<
+            string,
+            { label: string; text: string }
+          >
+        )[prompt];
+        expect(zh?.text, `${id}.${prompt}`).toBeTruthy();
+        expect(zh?.label, `${id}.${prompt}`).toBeTruthy();
+      }
+    }
+  });
+});