"use client"; import { Code, Database, Loader2, Save, Settings, TestTube, Trash2, } from "lucide-react"; import { useState } from "react"; import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, } from "@/components/ui/alert-dialog"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { FieldDescription, FieldLabel } from "@/components/ui/field"; import { InputGroup, InputGroupInput } from "@/components/ui/input-group"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@/components/ui/select"; import { Separator } from "@/components/ui/separator"; import { Switch } from "@/components/ui/switch"; import { cn } from "@/lib/utils"; export interface FeatureFlag { id: string; name: string; description: string; enabled: boolean; experimental?: boolean; } export interface SettingsAdvancedProps { featureFlags?: FeatureFlag[]; debugMode?: boolean; apiRateLimit?: number; loggingLevel?: "error" | "warn" | "info" | "debug"; onToggleFeature?: (id: string, enabled: boolean) => Promise; onUpdateSettings?: (settings: { debugMode?: boolean; apiRateLimit?: number; loggingLevel?: "error" | "warn" | "info" | "debug"; }) => Promise; onClearCache?: () => Promise; className?: string; } export default function SettingsAdvanced({ featureFlags = [], debugMode = false, apiRateLimit = 1000, loggingLevel = "info", onToggleFeature, onUpdateSettings, onClearCache, className, }: SettingsAdvancedProps) { const [isSaving, setIsSaving] = useState(false); const [localSettings, setLocalSettings] = useState({ debugMode, apiRateLimit, loggingLevel, }); const handleSave = async () => { setIsSaving(true); try { await onUpdateSettings?.(localSettings); } finally { setIsSaving(false); } }; return (

Advanced Settings Developer tools and experimental features

{/* Developer Settings */}


                Debug Mode


              
                
                  Enable debug logging and diagnostics
                
                
                    setLocalSettings((prev) => ({
                      ...prev,
                      debugMode: checked,
                    }))
                  }
                />



            
              
                
                  
                
                
                  Logging Level
                
              
              
            

            
              
                
                  
                
                
                  API Rate Limit
                
              
              
                
                    setLocalSettings((prev) => ({
                      ...prev,
                      apiRateLimit: Number.parseInt(e.target.value) || 1000,
                    }))
                  }
                  type="number"
                  value={localSettings.apiRateLimit}
                />
              
              Requests per hour



          

          {/* Feature Flags */}
          
            
              
              Feature Flags
            
            {featureFlags.length === 0 ? (
              
                No feature flags available
              
            ) : (
              
                {featureFlags.map((flag) => (
                  
                    
                      
                        {flag.name}
                        {flag.experimental && (
                          
                            Experimental
                          
                        )}
                      
                      
                        {flag.description}
                      
                    
                    
                        onToggleFeature?.(flag.id, checked)
                      }
                    />
                  
                ))}
              
            )}
          

          

          {/* Cache Management */}
          
            
              
                
              
              Cache Management
            
            
              
                
              
              
                
                  Clear Cache?
                  
                    This will clear all cached data. The application may be
                    slower on the next load as it rebuilds the cache.
                  
                
                
                  Cancel
                  
                    Clear Cache
                  
                
              
            
            
              Clear cached data to free up memory and refresh content


  );
}

Feature Flags

Example Usage