fix(web): fix feature flag Zod UUID validation and add Feature Flags tab in System Suite detail

- Replace strict z.string().uuid() with relaxed guidSchema regex pattern
  for feature flag response schemas (systemSuiteId, featureFlagId, etc.)
  to accept SQL Server GUIDs that don't satisfy RFC 4122 variant bits.
- Add 'feature-flags' tab to SystemSuiteDetailPanel with Flag icon.
- Create SystemSuiteFeatureFlagsPanel component that loads flags for the
  selected system suite using useGetFeatureFlagsBySystemSuite hook.
- Panel shows expandable flag rows with status badges, type badges,
  activate/deactivate/archive actions, and inline criteria management.

Author: beyondnetPeru

src/apps/ums.web-app/src/domain/configuration/schemas/feature-flag.schema.ts

@@ -12,6 +12,13 @@
  */
 import { z } from 'zod';
 
+// Zod v4 enforces RFC 4122 variant bits in .uuid() — too strict for SQL Server
+// GUIDs which may not satisfy those bit constraints. Use a format-only check.
+const guidSchema = z.string().regex(
+  /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/,
+  'Invalid GUID format',
+);
+
 export const FlagTypeSchema = z.enum(['Boolean', 'Variant', 'Percentage']);
 export const FlagStatusSchema = z.enum(['Inactive', 'Active', 'Archived']);
 export const CriteriaTypeSchema = z.enum([
@@ -34,22 +41,22 @@ export const CriteriaOperatorSchema = z.enum([
 ]);
 
 export const FeatureFlagCriteriaSchema = z.object({
-  criteriaId:    z.string().uuid(),
+  criteriaId:    guidSchema,
   criteriaType:  CriteriaTypeSchema,
   operator:      CriteriaOperatorSchema,
   value:         z.string(),
   createdAtUtc:  z.string(),
 });
 
 export const FeatureFlagSchema = z.object({
-  featureFlagId:      z.string().uuid(),
-  systemSuiteId:      z.string().uuid(),
+  featureFlagId:      guidSchema,
+  systemSuiteId:      guidSchema,
   flagCode:           z.string().min(1),
   flagType:           FlagTypeSchema,
   flagTargets:        z.string(),
   status:             FlagStatusSchema,
   linkedResourceType: z.string().nullable().optional(),
-  linkedResourceId:   z.string().uuid().nullable().optional(),
+  linkedResourceId:   guidSchema.nullable().optional(),
   rolloutPercentage:  z.number().int().min(0).max(100).nullable().optional(),
   criteria:           z.array(FeatureFlagCriteriaSchema).default([]),
 });
@@ -67,11 +74,11 @@ export const FeatureFlagPageSchema = z.object({
 // ── Response schemas ──────────────────────────────────────────────────────────
 
 export const CreateFeatureFlagResponseSchema = z.object({
-  featureFlagId: z.string().uuid(),
+  featureFlagId: guidSchema,
 });
 
 export const AddFeatureFlagCriteriaResponseSchema = z.object({
-  criteriaId: z.string().uuid(),
+  criteriaId: guidSchema,
 });
 
 // ── Type exports ──────────────────────────────────────────────────────────────

src/apps/ums.web-app/src/presentation/authorization/system-suite/components/SystemSuiteDetailPanel.tsx

@@ -2,7 +2,7 @@ import React, { useState, useMemo } from 'react';
 import {
   Box, Shield, Key, ChevronDown, ChevronRight, Users,
   Folder, FolderOpen, Layers, EyeOff, ShieldCheck, Trash2, KeyRound, Plus, Pencil,
-  ChevronsUpDown, ChevronsDownUp,
+  ChevronsUpDown, ChevronsDownUp, Flag,
 } from 'lucide-react';
 import { SystemSuite } from '@domain/authorization/models/system-suite.model';
 import { SystemSuiteProfileCard } from './SystemSuiteProfileCard';
@@ -32,10 +32,11 @@ import { CodeBadge } from '@shared/components/CodeBadge';
 import { formatSystemCode } from '@app/utils/security';
 import { SystemSuiteRolesPanel } from './SystemSuiteRolesPanel';
 import { SystemSuiteDomainResourcesPanel } from './SystemSuiteDomainResourcesPanel';
+import { SystemSuiteFeatureFlagsPanel } from './SystemSuiteFeatureFlagsPanel';
 import { Database } from 'lucide-react';
 import { ChildEntityToolbar } from '@shared/components/ChildEntityToolbar';
 
-type SystemSuiteTab = 'overview' | 'modules' | 'domain-resources' | 'actions' | 'roles';
+type SystemSuiteTab = 'overview' | 'modules' | 'domain-resources' | 'actions' | 'roles' | 'feature-flags';
 
 interface SystemSuiteDetailPanelProps {
   activeSystemSuite: SystemSuite | undefined;
@@ -547,6 +548,7 @@ export const SystemSuiteDetailPanel: React.FC<SystemSuiteDetailPanelProps> = ({
     { key: 'domain-resources', label: 'Recursos de Dominio', icon: <Database className="w-4 h-4" /> },
     { key: 'actions',  label: t.actions,  icon: <Key className="w-4 h-4" /> },
     { key: 'roles', label: t.roles, icon: <Users className="w-4 h-4" /> },
+    { key: 'feature-flags', label: 'Feature Flags', icon: <Flag className="w-4 h-4" /> },
   ];
 
   const suiteId = activeSystemSuite?.systemSuiteId ?? '';
@@ -949,6 +951,10 @@ export const SystemSuiteDetailPanel: React.FC<SystemSuiteDetailPanelProps> = ({
         {activeTab === 'roles' && (
           <SystemSuiteRolesPanel systemSuiteId={suiteId} />
         )}
+
+        {activeTab === 'feature-flags' && (
+          <SystemSuiteFeatureFlagsPanel systemSuiteId={suiteId} />
+        )}
       </div>
     </DetailPanelShell>
   );