feat: implement backlog plan management and UI enhancements

- Added functionality to save, clear, and load backlog plans within the application.
- Introduced a new API endpoint for clearing saved backlog plans.
- Enhanced the backlog plan dialog to allow users to review and apply changes to their features.
- Integrated dependency management features in the UI, allowing users to select parent and child dependencies for features.
- Improved the graph view with options to manage plans and visualize dependencies effectively.
- Updated the sidebar and settings to include provider visibility toggles for better user control over model selection.

These changes aim to enhance the user experience by providing robust backlog management capabilities and improving the overall UI for feature planning.

apps/ui/src/components/views/board-view/shared/model-selector.tsx

@@ -31,6 +31,7 @@ export function ModelSelector({
     codexModelsLoading,
     codexModelsError,
     fetchCodexModels,
+    disabledProviders,
   } = useAppStore();
   const { cursorCliStatus, codexCliStatus } = useSetupStore();
 
@@ -69,9 +70,8 @@ export function ModelSelector({
 
   // Filter Cursor models based on enabled models from global settings
   const filteredCursorModels = CURSOR_MODELS.filter((model) => {
-    // Extract the cursor model ID from the prefixed ID (e.g., "cursor-auto" -> "auto")
-    const cursorModelId = stripProviderPrefix(model.id);
-    return enabledCursorModels.includes(cursorModelId as any);
+    // Compare model.id directly since both model.id and enabledCursorModels use full IDs with prefix
+    return enabledCursorModels.includes(model.id as any);
   });
 
   const handleProviderChange = (provider: ModelProvider) => {
@@ -89,59 +89,79 @@ export function ModelSelector({
     }
   };
 
+  // Check which providers are disabled
+  const isClaudeDisabled = disabledProviders.includes('claude');
+  const isCursorDisabled = disabledProviders.includes('cursor');
+  const isCodexDisabled = disabledProviders.includes('codex');
+
+  // Count available providers
+  const availableProviders = [
+    !isClaudeDisabled && 'claude',
+    !isCursorDisabled && 'cursor',
+    !isCodexDisabled && 'codex',
+  ].filter(Boolean) as ModelProvider[];
+
   return (
     <div className="space-y-4">
       {/* Provider Selection */}
-      <div className="space-y-2">
-        <Label>AI Provider</Label>
-        <div className="flex gap-2">
-          <button
-            type="button"
-            onClick={() => handleProviderChange('claude')}
-            className={cn(
-              'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
-              selectedProvider === 'claude'
-                ? 'bg-primary text-primary-foreground border-primary'
-                : 'bg-background hover:bg-accent border-border'
+      {availableProviders.length > 1 && (
+        <div className="space-y-2">
+          <Label>AI Provider</Label>
+          <div className="flex gap-2">
+            {!isClaudeDisabled && (
+              <button
+                type="button"
+                onClick={() => handleProviderChange('claude')}
+                className={cn(
+                  'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
+                  selectedProvider === 'claude'
+                    ? 'bg-primary text-primary-foreground border-primary'
+                    : 'bg-background hover:bg-accent border-border'
+                )}
+                data-testid={`${testIdPrefix}-provider-claude`}
+              >
+                <AnthropicIcon className="w-4 h-4" />
+                Claude
+              </button>
             )}
-            data-testid={`${testIdPrefix}-provider-claude`}
-          >
-            <AnthropicIcon className="w-4 h-4" />
-            Claude
-          </button>
-          <button
-            type="button"
-            onClick={() => handleProviderChange('cursor')}
-            className={cn(
-              'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
-              selectedProvider === 'cursor'
-                ? 'bg-primary text-primary-foreground border-primary'
-                : 'bg-background hover:bg-accent border-border'
+            {!isCursorDisabled && (
+              <button
+                type="button"
+                onClick={() => handleProviderChange('cursor')}
+                className={cn(
+                  'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
+                  selectedProvider === 'cursor'
+                    ? 'bg-primary text-primary-foreground border-primary'
+                    : 'bg-background hover:bg-accent border-border'
+                )}
+                data-testid={`${testIdPrefix}-provider-cursor`}
+              >
+                <CursorIcon className="w-4 h-4" />
+                Cursor CLI
+              </button>
             )}
-            data-testid={`${testIdPrefix}-provider-cursor`}
-          >
-            <CursorIcon className="w-4 h-4" />
-            Cursor CLI
-          </button>
-          <button
-            type="button"
-            onClick={() => handleProviderChange('codex')}
-            className={cn(
-              'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
-              selectedProvider === 'codex'
-                ? 'bg-primary text-primary-foreground border-primary'
-                : 'bg-background hover:bg-accent border-border'
+            {!isCodexDisabled && (
+              <button
+                type="button"
+                onClick={() => handleProviderChange('codex')}
+                className={cn(
+                  'flex-1 px-3 py-2 rounded-md border text-sm font-medium transition-colors flex items-center justify-center gap-2',
+                  selectedProvider === 'codex'
+                    ? 'bg-primary text-primary-foreground border-primary'
+                    : 'bg-background hover:bg-accent border-border'
+                )}
+                data-testid={`${testIdPrefix}-provider-codex`}
+              >
+                <OpenAIIcon className="w-4 h-4" />
+                Codex CLI
+              </button>
             )}
-            data-testid={`${testIdPrefix}-provider-codex`}
-          >
-            <OpenAIIcon className="w-4 h-4" />
-            Codex CLI
-          </button>
+          </div>
         </div>
-      </div>
+      )}
 
       {/* Claude Models */}
-      {selectedProvider === 'claude' && (
+      {selectedProvider === 'claude' && !isClaudeDisabled && (
         <div className="space-y-3">
           <div className="flex items-center justify-between">
             <Label className="flex items-center gap-2">
@@ -179,7 +199,7 @@ export function ModelSelector({
       )}
 
       {/* Cursor Models */}
-      {selectedProvider === 'cursor' && (
+      {selectedProvider === 'cursor' && !isCursorDisabled && (
         <div className="space-y-3">
           {/* Warning when Cursor CLI is not available */}
           {!isCursorAvailable && (
@@ -248,7 +268,7 @@ export function ModelSelector({
       )}
 
       {/* Codex Models */}
-      {selectedProvider === 'codex' && (
+      {selectedProvider === 'codex' && !isCodexDisabled && (
         <div className="space-y-3">
           {/* Warning when Codex CLI is not available */}
           {!isCodexAvailable && (