platformcommons-web-lib 1.0.0

package/src/lib/modules/form-builder/services/field-selection.service.ts

@@ -0,0 +1,300 @@
+import { Injectable, computed, signal } from '@angular/core';
+import { FormSchema } from '../../smart-form/models/form-schema.model';
+import {
+  SelectionGroupNode,
+  SelectionSectionNode,
+  SelectionFieldNode,
+} from '../models/field-selection.models';
+import { FormSchemaTreeService } from '../services/form-schema-tree.service';
+
+interface FieldSelectionState {
+  groups: SelectionGroupNode[];
+  originalSchema: FormSchema | null;
+}
+
+/**
+ * Signal-based service for the field-selection component.
+ * Manages group/section/field enable/disable toggles.
+ */
+@Injectable()
+export class FieldSelectionService {
+  private readonly _state = signal<FieldSelectionState>({
+    groups: [],
+    originalSchema: null,
+  });
+
+  private readonly treeService = new FormSchemaTreeService();
+
+  // ── Computed slices ─────────────────────────────────────────────
+  readonly groups = computed(() => this._state().groups);
+  readonly originalSchema = computed(() => this._state().originalSchema);
+
+  readonly totalFieldCount = computed(() => {
+    let count = 0;
+    const countFields = (sections: SelectionSectionNode[]): void => {
+      for (const s of sections) {
+        count += s.fields.length;
+        countFields(s.subsections);
+      }
+    };
+    for (const g of this._state().groups) {
+      countFields(g.sections);
+    }
+    return count;
+  });
+
+  readonly selectedFieldCount = computed(() => {
+    let count = 0;
+    const countSelected = (sections: SelectionSectionNode[]): void => {
+      for (const s of sections) {
+        if (!s.enabled) continue;
+        count += s.fields.filter(f => f.selected).length;
+        countSelected(s.subsections);
+      }
+    };
+    for (const g of this._state().groups) {
+      if (!g.enabled) continue;
+      countSelected(g.sections);
+    }
+    return count;
+  });
+
+  // ── Mutators ────────────────────────────────────────────────────
+
+  /**
+   * Initialize the store from a FormSchema.
+   */
+  loadSchema(schema: FormSchema): void {
+    const groups = this.treeService.parseSchemaToSelectionGroups(schema);
+    this._state.set({ groups, originalSchema: schema });
+  }
+
+  /**
+   * Load a schema while preserving the expanded/collapsed state of sections and groups.
+   * Used when the schema structure hasn't changed but field selections have.
+   * This prevents the UI from unexpectedly collapsing sections when the user toggles a field.
+   */
+  loadSchemaPreservingExpanded(schema: FormSchema): void {
+    const oldGroups = this._state().groups;
+    const newGroups = this.treeService.parseSchemaToSelectionGroups(schema);
+    
+    // Merge old expansion states into new groups
+    const mergedGroups = newGroups.map((newGroup, gi) => ({
+      ...newGroup,
+      expanded: oldGroups[gi]?.expanded ?? newGroup.expanded,
+      sections: this._mergeExpandedSections(newGroup.sections, oldGroups[gi]?.sections ?? []),
+    }));
+
+    this._state.set({ groups: mergedGroups, originalSchema: schema });
+  }
+
+  /**
+   * Toggle a group's enabled state. Disabling cascades to all sections + fields.
+   * When enabling, all fields are selected (unless locked).
+   */
+  toggleGroup(groupIndex: number): void {
+    this._state.update(s => ({
+      ...s,
+      groups: s.groups.map((g, i) => {
+        if (i !== groupIndex) return g;
+        const enabled = !g.enabled;
+        return {
+          ...g,
+          enabled,
+          sections: enabled ? g.sections : this._disableAllSections(g.sections),
+          // sections: enabled ? this._enableAllSections(g.sections) : this._disableAllSections(g.sections),
+        };
+      }),
+    }));
+  }
+
+  /**
+   * Toggle a section's enabled state.
+   * Disabling cascades to all child fields (and subsections).
+   */
+  toggleSection(groupIndex: number, sectionPath: number[]): void {
+    this._state.update(s => ({
+      ...s,
+      groups: s.groups.map((g, gi) => {
+        if (gi !== groupIndex) return g;
+        return {
+          ...g,
+          sections: this._toggleSectionAtPath(g.sections, sectionPath, 0),
+        };
+      }),
+    }));
+  }
+
+  /**
+   * Toggle a section's expanded (collapsed/expanded) state.
+   */
+  toggleSectionExpanded(groupIndex: number, sectionPath: number[]): void {
+    this._state.update(s => ({
+      ...s,
+      groups: s.groups.map((g, gi) => {
+        if (gi !== groupIndex) return g;
+        return {
+          ...g,
+          sections: this._toggleExpandedAtPath(g.sections, sectionPath, 0),
+        };
+      }),
+    }));
+  }
+
+  /**
+   * Toggle a group's expanded (collapsed/expanded) state.
+   */
+  toggleGroupExpanded(groupIndex: number): void {
+    this._state.update(s => ({
+      ...s,
+      groups: s.groups.map((g, i) =>
+        i === groupIndex ? { ...g, expanded: !g.expanded } : g
+      ),
+    }));
+  }
+
+  /**
+   * Toggle a field's selected (checkbox) state.
+   */
+  toggleField(groupIndex: number, sectionPath: number[], fieldIndex: number): void {
+    this._state.update(s => ({
+      ...s,
+      groups: s.groups.map((g, gi) => {
+        if (gi !== groupIndex) return g;
+        return {
+          ...g,
+          sections: this._toggleFieldAtPath(g.sections, sectionPath, 0, fieldIndex),
+        };
+      }),
+    }));
+  }
+
+  /**
+   * Build and return the updated FormSchema with selection changes applied.
+   */
+  buildUpdatedSchema(): FormSchema | null {
+    const { groups, originalSchema } = this._state();
+    if (!originalSchema) return null;
+    return this.treeService.applySelectionToSchema(groups, originalSchema);
+  }
+
+  // ── Private helpers ─────────────────────────────────────────────
+
+  private _disableAllSections(sections: SelectionSectionNode[]): SelectionSectionNode[] {
+    return sections.map(s => ({
+      ...s,
+      enabled: false,
+      fields: s.fields.map(f => ({ ...f, selected: false })),
+      subsections: this._disableAllSections(s.subsections),
+    }));
+  }
+
+  /**
+   * Enable all sections and their fields (except locked ones).
+   * Used when toggling a section/group back ON to restore field selections.
+   */
+  private _enableAllSections(sections: SelectionSectionNode[]): SelectionSectionNode[] {
+    return sections.map(s => ({
+      ...s,
+      enabled: true,
+      fields: s.fields.map(f => ({ ...f, selected: !f.isLocked })),
+      subsections: this._enableAllSections(s.subsections),
+    }));
+  }
+
+  private _toggleSectionAtPath(
+    sections: SelectionSectionNode[],
+    path: number[],
+    depth: number,
+  ): SelectionSectionNode[] {
+    return sections.map((s, i) => {
+      if (i !== path[depth]) return s;
+
+      if (depth === path.length - 1) {
+        // This is the target section
+        const enabled = !s.enabled;
+        return {
+          ...s,
+          enabled,
+          // When enabling: select all non-locked fields and enable subsections
+          // When disabling: deselect all fields and disable subsections
+          fields: enabled ? s.fields.map(f => ({ ...f, selected: !f.isLocked })) : s.fields.map(f => ({ ...f, selected: false })),
+          subsections: enabled ? this._enableAllSections(s.subsections) : this._disableAllSections(s.subsections),
+        };
+      }
+
+      // Recurse into subsections
+      return {
+        ...s,
+        subsections: this._toggleSectionAtPath(s.subsections, path, depth + 1),
+      };
+    });
+  }
+
+  private _toggleExpandedAtPath(
+    sections: SelectionSectionNode[],
+    path: number[],
+    depth: number,
+  ): SelectionSectionNode[] {
+    return sections.map((s, i) => {
+      if (i !== path[depth]) return s;
+
+      if (depth === path.length - 1) {
+        return { ...s, expanded: !s.expanded };
+      }
+
+      return {
+        ...s,
+        subsections: this._toggleExpandedAtPath(s.subsections, path, depth + 1),
+      };
+    });
+  }
+
+  private _toggleFieldAtPath(
+    sections: SelectionSectionNode[],
+    sectionPath: number[],
+    depth: number,
+    fieldIndex: number,
+  ): SelectionSectionNode[] {
+    return sections.map((s, i) => {
+      if (i !== sectionPath[depth]) return s;
+
+      if (depth === sectionPath.length - 1) {
+        return {
+          ...s,
+          fields: s.fields.map((f, fi) =>
+            fi === fieldIndex && !f.isLocked
+              ? { ...f, selected: !f.selected }
+              : f
+          ),
+        };
+      }
+
+      return {
+        ...s,
+        subsections: this._toggleFieldAtPath(s.subsections, sectionPath, depth + 1, fieldIndex),
+      };
+    });
+  }
+
+  /**
+   * Recursively merge expansion state from old sections into new sections.
+   * Preserves which sections were expanded/collapsed by the user.
+   */
+  private _mergeExpandedSections(
+    newSections: SelectionSectionNode[],
+    oldSections: SelectionSectionNode[],
+  ): SelectionSectionNode[] {
+    return newSections.map((newSection, ni) => {
+      const oldSection = oldSections[ni];
+      return {
+        ...newSection,
+        expanded: oldSection?.expanded ?? newSection.expanded,
+        subsections: this._mergeExpandedSections(
+          newSection.subsections,
+          oldSection?.subsections ?? [],
+        ),
+      };
+    });
+  }
+}