fix(cloudflare): restore group detail pages for ids other than 1

Static export only generates /cloudflare/groups/1.html. Unknown ids fell
through to the dashboard index, bouncing the browser home and triggering
React hydration error #418. Serve the generated group shell and resolve
the real id from the pathname, matching the websites detail fallback.

frontend/app/(main)/cloudflare/groups/[id]/page-client.tsx

@@ -12,8 +12,8 @@ import {
 } from 'lucide-react';
 import Link from 'next/link';
 import { useTranslations } from 'next-intl';
-import { useParams } from 'next/navigation';
-import { useState } from 'react';
+import { usePathname } from 'next/navigation';
+import { useEffect, useMemo, useState } from 'react';
 import { toast } from 'sonner';
 
 import { Badge } from '@/components/ui/badge';
@@ -46,10 +46,20 @@ import { getErrorMessage } from '../../../websites/components/website-utils';
 import { GroupDialog } from '../../components/group-dialog';
 import { MemberAddDialog } from '../../components/member-add-dialog';
 
+function getGroupIdFromPathname(pathname: string | null): number {
+  const match = pathname?.match(/^\/cloudflare\/groups\/([^/]+)$/);
+  return Number(match?.[1]);
+}
+
 export function CloudflareGroupDetailPageClient() {
   const t = useTranslations('cloudflare');
-  const params = useParams<{ id: string }>();
-  const groupID = Number(params.id);
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  const pathname = usePathname();
+  const groupID = useMemo(() => getGroupIdFromPathname(pathname), [pathname]);
   const queryClient = useQueryClient();
   const [editOpen, setEditOpen] = useState(false);
   const [addOpen, setAddOpen] = useState(false);
@@ -147,7 +157,7 @@ export function CloudflareGroupDetailPageClient() {
     onError: (error) => toast.error(getErrorMessage(error)),
   });
 
-  if (detailQuery.isLoading)
+  if (!mounted || detailQuery.isLoading)
     return (
       <div className='w-full py-6 px-1'>
         <LoadingStateWithBorder icon={Cloud} description={t('loadingDetail')} />

frontend/app/(main)/cloudflare/groups/[id]/page.tsx

@@ -6,7 +6,7 @@ import { LoadingStateWithBorder } from '@/components/layout/loading';
 
 import { CloudflareGroupDetailPageClient } from './page-client';
 
-/** Placeholder for static export; real ids resolve client-side via useParams. */
+/** Placeholder for static export; real ids resolve client-side from the pathname. */
 export async function generateStaticParams() {
   return [{ id: '1' }];
 }