chore: update Angular TypeScript build info cache

2025-10-02 10:55:11 -04:00
parent 1d4da38164
commit 20cc6e9215
59 changed files with 8614 additions and 496 deletions
@@ -1,6 +1,9 @@
-import { Component, ChangeDetectionStrategy, output, signal } from '@angular/core';
+import { Component, ChangeDetectionStrategy, output, signal, effect, input } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
+import { SearchInputWithAssistantComponent } from '../search-input-with-assistant/search-input-with-assistant.component';
+import { GraphSettingsService } from '../../app/graph/graph-settings.service';
+import { GraphConfig, GraphColorGroup, createGraphColor, intToHex } from '../../app/graph/graph-settings.types';

 export interface GraphFilters {
  showTags: boolean;
@@ -32,7 +35,7 @@ export interface GraphOptions {
@Component({
  selector: 'app-graph-options-panel',
  standalone: true,
-  imports: [CommonModule, FormsModule],
+  imports: [CommonModule, FormsModule, SearchInputWithAssistantComponent],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `
    <div class="graph-options-panel bg-white dark:bg-gray-800 border-l border-gray-200 dark:border-gray-700 h-full overflow-y-auto">
@@ -86,12 +89,15 @@ export interface GraphOptions {
          </div>
          
          <div class="mt-3">
-            <input 
-              type="text" 
-              [(ngModel)]="filters().searchQuery"
-              (ngModelChange)="emitOptionsChange()"
-              placeholder="🔍 Search files…"
-              class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500">
+            <app-search-input-with-assistant
+              [value]="searchQuery()"
+              (valueChange)="onSearchChange($event)"
+              (submit)="onSearchSubmit($event)"
+              [placeholder]="'Search files…'"
+              [context]="'graph'"
+              [showSearchIcon]="true"
+              [inputClass]="'w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500'"
+            />
          </div>
        </section>

@@ -104,8 +110,36 @@ export interface GraphOptions {
            Groups
          </h3>
          
+          <div class="space-y-2 mb-3">
+            @for (group of colorGroups(); track $index) {
+              <div class="flex items-center gap-2 p-2 bg-gray-50 dark:bg-gray-700/50 rounded-lg">
+                <div 
+                  [style.background-color]="getGroupColorPreview(group)"
+                  class="w-6 h-6 rounded-full border-2 border-white dark:border-gray-800 shadow-sm flex-shrink-0">
+                </div>
+                <input
+                  type="text"
+                  [value]="group.query"
+                  (input)="updateGroupQuery($index, $any($event.target).value)"
+                  placeholder="Query (e.g., tag:#code)"
+                  class="flex-1 px-2 py-1 text-xs bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded"
+                />
+                <button
+                  (click)="removeGroup($index)"
+                  class="p-1 text-gray-400 hover:text-red-500 transition-colors"
+                  title="Remove group"
+                >
+                  <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+                  </svg>
+                </button>
+              </div>
+            }
+          </div>
+          
          <button 
            type="button"
+            (click)="addNewGroup()"
            class="w-full px-3 py-2 text-sm bg-purple-600 hover:bg-purple-700 text-white rounded-md transition-colors">
            New group
          </button>
@@ -291,9 +325,9 @@ export interface GraphOptions {
 })
 export class GraphOptionsPanelComponent {
  filters = signal<GraphFilters>({
-    showTags: true,
-    showAttachments: true,
-    existingFilesOnly: true,
+    showTags: false,
+    showAttachments: false,
+    existingFilesOnly: false,
    showOrphans: true,
    searchQuery: ''
  });
@@ -311,16 +345,89 @@ export class GraphOptionsPanelComponent {
    centerStrength: 0.05
  });

+  searchQuery = signal<string>('');
+  colorGroups = signal<GraphColorGroup[]>([]);
  forcesExpanded = signal(false);

  optionsChanged = output<GraphOptions>();
  animateRequested = output<void>();

+  constructor(private graphSettings: GraphSettingsService) {
+    // Sync with graph settings service
+    effect(() => {
+      const config = this.graphSettings.config();
+      
+      this.filters.set({
+        showTags: config.showTags,
+        showAttachments: config.showAttachments,
+        existingFilesOnly: config.hideUnresolved,
+        showOrphans: config.showOrphans,
+        searchQuery: config.search
+      });
+
+      this.searchQuery.set(config.search);
+      this.colorGroups.set([...config.colorGroups]);
+
+      this.emitOptionsChange();
+    });
+  }
+
  emitOptionsChange(): void {
    this.optionsChanged.emit({
      filters: this.filters(),
      display: this.display(),
      forces: this.forces()
    });
+
+    // Save to settings service
+    this.graphSettings.save({
+      showTags: this.filters().showTags,
+      showAttachments: this.filters().showAttachments,
+      hideUnresolved: this.filters().existingFilesOnly,
+      showOrphans: this.filters().showOrphans,
+      search: this.searchQuery()
+    });
+  }
+
+  onSearchChange(query: string): void {
+    this.searchQuery.set(query);
+    this.filters.update(f => ({ ...f, searchQuery: query }));
+    this.graphSettings.save({ search: query });
+    this.emitOptionsChange();
+  }
+
+  onSearchSubmit(query: string): void {
+    // Add to history and apply
+    this.onSearchChange(query);
+  }
+
+  addNewGroup(): void {
+    const newGroup: GraphColorGroup = {
+      query: 'file:test',
+      color: createGraphColor('#E879F9', 1) // Purple default
+    };
+    
+    const updated = [...this.colorGroups(), newGroup];
+    this.colorGroups.set(updated);
+    this.graphSettings.save({ colorGroups: updated });
+  }
+
+  removeGroup(index: number): void {
+    const updated = this.colorGroups().filter((_, i) => i !== index);
+    this.colorGroups.set(updated);
+    this.graphSettings.save({ colorGroups: updated });
+  }
+
+  updateGroupQuery(index: number, query: string): void {
+    const updated = this.colorGroups().map((g, i) => 
+      i === index ? { ...g, query } : g
+    );
+    this.colorGroups.set(updated);
+    this.graphSettings.save({ colorGroups: updated });
+  }
+
+  getGroupColorPreview(group: GraphColorGroup): string {
+    const hex = intToHex(group.color.rgb);
+    return `${hex}${Math.round(group.color.a * 255).toString(16).padStart(2, '0')}`;
  }
 }