fix(frontend): serve zone detail static export fallback

frontend/app/(main)/websites/[zoneId]/components/zone-editor-dialog.tsx

@@ -56,7 +56,7 @@ export function ZoneEditorDialog({
       <DialogContent>
         <DialogHeader>
           <DialogTitle>{zone ? '编辑 Zone' : '新增 Zone'}</DialogTitle>
-          <DialogDescription>Zone 仅接受可注册根域，例如 arctel.de。</DialogDescription>
+          <DialogDescription>Zone 仅接受可注册根域，例如 example.com。</DialogDescription>
         </DialogHeader>
         <form
           id="zone-editor"
@@ -67,7 +67,7 @@ export function ZoneEditorDialog({
         >
           <div className="space-y-1.5">
             <Label htmlFor="zone-domain">根域</Label>
-            <Input id="zone-domain" placeholder="arctel.de" {...form.register('domain')} />
+            <Input id="zone-domain" placeholder="example.com" {...form.register('domain')} />
             {form.formState.errors.domain && (
               <p className="text-xs text-destructive">{form.formState.errors.domain.message}</p>
             )}

frontend/app/(main)/websites/[zoneId]/page-client.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import {useParams, usePathname, useRouter, useSearchParams} from 'next/navigation';
+import {usePathname, useRouter, useSearchParams} from 'next/navigation';
 import {useCallback, useEffect, useMemo, useState} from 'react';
 import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query';
 import {ArrowLeft, Globe, Pencil, Trash2} from 'lucide-react';
@@ -40,10 +40,12 @@ function getZonePageTab(value: string | null | undefined): ZonePageTab {
   return zoneTabs.includes(value as ZonePageTab) ? (value as ZonePageTab) : 'overview';
 }
 
-export function ZonePageClient() {
-  const params = useParams();
-  const zoneId = Number(params?.zoneId);
+function getZoneIdFromPathname(pathname: string | null): number {
+  const match = pathname?.match(/^\/websites\/([^/]+)$/);
+  return Number(match?.[1]);
+}
 
+export function ZonePageClient() {
   const [mounted, setMounted] = useState(false);
   useEffect(() => {
     setMounted(true);
@@ -51,6 +53,7 @@ export function ZonePageClient() {
 
   const router = useRouter();
   const pathname = usePathname();
+  const zoneId = useMemo(() => getZoneIdFromPathname(pathname), [pathname]);
   const searchParams = useSearchParams();
   const queryClient = useQueryClient();
   const activeTab = useMemo(

frontend/tests/zone/websites-page.test.tsx

@@ -34,14 +34,14 @@ describe('WebsitesPage', () => {
     vi.mocked(ZoneService.list).mockResolvedValue([
       {
         id: 42,
-        domain: 'arctel.de',
+        domain: 'example.com',
         domain_count: 3,
         created_at: '',
         updated_at: '',
       },
       {
         id: 43,
-        domain: 'example.com',
+        domain: 'another.com',
         domain_count: 0,
         created_at: '',
         updated_at: '',
@@ -50,18 +50,18 @@ describe('WebsitesPage', () => {
 
     renderPage();
 
-    expect(await screen.findByText('arctel.de')).toBeVisible();
+    expect(await screen.findByText('example.com')).toBeVisible();
     expect(screen.getByText('3')).toBeVisible();
     expect(screen.getByText('0')).toBeVisible();
     expect(screen.getByRole('columnheader', {name: '根域'})).toBeVisible();
 
     fireEvent.change(screen.getByPlaceholderText('搜索 Zone 根域'), {
-      target: {value: 'arctel'},
+      target: {value: 'example'},
     });
     expect(screen.getByRole('link', {name: '管理'})).toHaveAttribute(
       'href',
       '/websites/42',
     );
-    expect(screen.queryByText('example.com')).not.toBeInTheDocument();
+    expect(screen.queryByText('another.com')).not.toBeInTheDocument();
   });
 });

frontend/tests/zone/zone-domain-selector.test.tsx

@@ -13,7 +13,7 @@ vi.mock('next/link', () => ({
 }));
 
 const zones: ZoneItem[] = [
-  {id: 1, domain: 'arctel.de', created_at: '', updated_at: ''},
+  {id: 1, domain: 'example.com', created_at: '', updated_at: ''},
 ];
 
 const domains: ZoneDomainItem[] = [
@@ -21,7 +21,7 @@ const domains: ZoneDomainItem[] = [
     id: 7,
     zone_id: 1,
     proxy_route_id: null,
-    domain: 'api.arctel.de',
+    domain: 'api.example.com',
     cert_id: 9,
     created_at: '',
     updated_at: '',
@@ -30,7 +30,7 @@ const domains: ZoneDomainItem[] = [
     id: 8,
     zone_id: 1,
     proxy_route_id: 99,
-    domain: 'bound.arctel.de',
+    domain: 'bound.example.com',
     cert_id: null,
     created_at: '',
     updated_at: '',
@@ -56,12 +56,12 @@ describe('ZoneDomainSelector', () => {
       />,
     );
 
-    expect(screen.getByText('api.arctel.de')).toBeVisible();
+    expect(screen.getByText('api.example.com')).toBeVisible();
     // Bound to another route — hidden by default
-    expect(screen.queryByText('bound.arctel.de')).not.toBeInTheDocument();
+    expect(screen.queryByText('bound.example.com')).not.toBeInTheDocument();
     expect(screen.getByRole('button', {name: /快捷新增域名/})).toBeVisible();
 
-    await user.click(screen.getByText('api.arctel.de'));
+    await user.click(screen.getByText('api.example.com'));
     expect(onChange).toHaveBeenCalledWith([]);
   });
 
@@ -76,8 +76,8 @@ describe('ZoneDomainSelector', () => {
       />,
     );
 
-    expect(screen.getByText('api.arctel.de')).toBeVisible();
-    expect(screen.queryByText('bound.arctel.de')).not.toBeInTheDocument();
+    expect(screen.getByText('api.example.com')).toBeVisible();
+    expect(screen.queryByText('bound.example.com')).not.toBeInTheDocument();
   });
 
   it('still shows domains already bound to the current route', () => {
@@ -91,7 +91,7 @@ describe('ZoneDomainSelector', () => {
       />,
     );
 
-    expect(screen.getByText('bound.arctel.de')).toBeVisible();
-    expect(screen.getByText('api.arctel.de')).toBeVisible();
+    expect(screen.getByText('bound.example.com')).toBeVisible();
+    expect(screen.getByText('api.example.com')).toBeVisible();
   });
 });

frontend/tests/zone/zone-page.test.tsx

@@ -14,6 +14,7 @@ class ResizeObserverMock {
 vi.stubGlobal('ResizeObserver', ResizeObserverMock);
 
 let mockZoneId = '42';
+let mockParamZoneId = '42';
 
 const replaceMock = vi.fn();
 
@@ -27,7 +28,7 @@ vi.mock('next/navigation', () => ({
   useRouter: () => ({replace: replaceMock, back: vi.fn()}),
   usePathname: () => `/websites/${mockZoneId}`,
   useSearchParams: () => new URLSearchParams(),
-  useParams: () => ({zoneId: mockZoneId}),
+  useParams: () => ({zoneId: mockParamZoneId}),
 }));
 
 vi.mock('@/lib/services/openflare', async (importOriginal) => {
@@ -49,8 +50,9 @@ vi.mock('@/lib/services/openflare', async (importOriginal) => {
   };
 });
 
-function renderPage(zoneId: number) {
+function renderPage(zoneId: number, paramZoneId = zoneId) {
   mockZoneId = String(zoneId);
+  mockParamZoneId = String(paramZoneId);
   const client = new QueryClient({
     defaultOptions: {
       queries: {retry: false, gcTime: 0},
@@ -65,6 +67,7 @@ function renderPage(zoneId: number) {
 
 describe('ZonePageClient', () => {
   beforeEach(() => {
+    mockParamZoneId = mockZoneId;
     vi.mocked(ZoneService.getOverview).mockReset();
     vi.mocked(ZoneService.getStats).mockReset();
     vi.mocked(ZoneService.getStats).mockResolvedValue({
@@ -89,7 +92,7 @@ describe('ZonePageClient', () => {
 
   it('loads the overview by stable ID and exposes all tabs including empty domains', async () => {
     vi.mocked(ZoneService.getOverview).mockImplementation(async () => ({
-      zone: {id: 42, domain: 'arctel.de', created_at: '', updated_at: ''},
+      zone: {id: 42, domain: 'example.com', created_at: '', updated_at: ''},
       domains: [],
     }));
 
@@ -98,7 +101,7 @@ describe('ZonePageClient', () => {
     await waitFor(() => {
       expect(ZoneService.getOverview).toHaveBeenCalledWith(42);
     });
-    expect(await screen.findByRole('heading', {name: 'arctel.de'})).toBeVisible();
+    expect(await screen.findByRole('heading', {name: 'example.com'})).toBeVisible();
     expect(await screen.findByText('唯一访问者')).toBeVisible();
     expect(screen.getByText('请求总数')).toBeVisible();
     expect(screen.getByText('已提供的数据总计')).toBeVisible();
@@ -108,6 +111,20 @@ describe('ZonePageClient', () => {
     expect(screen.getByRole('tab', {name: '设置'})).toBeVisible();
   });
 
+  it('uses the browser pathname ID when serving a static-export fallback shell', async () => {
+    vi.mocked(ZoneService.getOverview).mockImplementation(async () => ({
+      zone: {id: 42, domain: 'example.com', created_at: '', updated_at: ''},
+      domains: [],
+    }));
+
+    renderPage(42, 1);
+
+    await waitFor(() => {
+      expect(ZoneService.getOverview).toHaveBeenCalledWith(42);
+    });
+    expect(ZoneService.getOverview).not.toHaveBeenCalledWith(1);
+  });
+
   it('renders a not-found state for a missing Zone', async () => {
     vi.mocked(ZoneService.getOverview).mockRejectedValue(new Error('Zone 不存在'));