adding data browser

src/components/metadata/metadata.component.ts

@@ -0,0 +1,75 @@
+import { Component } from '@angular/core';
+import { TreeComponent } from '../tree/tree.component';
+import { TreeNode } from '../../models/tree-node';
+import { MetaService } from '../../services/meta.service';
+import { Action } from '../../models/action';
+import { faAdd } from '@fortawesome/free-solid-svg-icons';
+import { QueryService } from '../../services/query.service';
+import { combineLatest } from 'rxjs';
+import { Query } from '../../models/query';
+
+@Component({
+  selector: 'fbi-metadata',
+  standalone: true,
+  imports: [TreeComponent],
+  templateUrl: './metadata.component.html',
+  styleUrl: './metadata.component.scss',
+})
+export class MetadataComponent {
+  node: TreeNode = new TreeNode({});
+
+  constructor(metaService: MetaService, private queryService: QueryService) {
+    combineLatest({
+      meta: metaService.Data,
+      query: queryService.Query,
+    }).subscribe((d: { meta: Partial<TreeNode>[]; query: Query }) => {
+      const inuse = d.query.fields;
+      const expanded = this.getExpanded(this.node);
+
+      const recurse = (node: Partial<TreeNode>) => {
+        node.hidden = inuse.includes(node.data);
+        node.expanded = expanded.includes(node.data);
+
+        const children = node.children ?? [];
+        children.forEach((child: Partial<TreeNode>) => recurse(child));
+        if (children.length === 0) {
+          const actions = [{ label: 'Add', icon: faAdd, data: ACTIONS.ADD }];
+          node.actions = actions as Action[];
+        }
+      };
+
+      (d.meta ?? []).forEach((node: Partial<TreeNode>) => recurse(node));
+
+      this.node = new TreeNode({
+        hidden: true,
+        expanded: true,
+        children: d.meta as TreeNode[],
+      });
+    });
+  }
+
+  onActionClick(event: { action: Action; node: TreeNode }): void {
+    switch (event.action.data) {
+      case ACTIONS.ADD:
+        this.queryService.add(event.node.data);
+        break;
+    }
+  }
+
+  private getExpanded(node: TreeNode): string[] {
+    const result: string[] = [];
+
+    if (node.expanded) {
+      result.push(node.data);
+    }
+    (node.children ?? []).forEach((child: TreeNode) =>
+      result.push(...this.getExpanded(child))
+    );
+
+    return result;
+  }
+}
+
+enum ACTIONS {
+  ADD = 'add',
+}