Support dynamic label (#44)

* support dynamic label
* misc. fixes
* add more selectable colors

Author: cqian23

frontend/src/models/edge.js

@@ -80,8 +80,8 @@ class GraphEdge extends GraphObject {
      * @param {EdgeData} params
      */
     constructor(params) {
-        const {source_node_identifier, destination_node_identifier, labels, properties, title, identifier} = params;
-        super({labels, title, properties, identifier});
+        const {source_node_identifier, destination_node_identifier, labels, properties, title, identifier, containsDynamicLabelElement, allSchemaStaticLabelSets} = params;
+        super({labels, title, properties, identifier, containsDynamicLabelElement, allSchemaStaticLabelSets});
 
         if (!this._validUid(source_node_identifier) || !this._validUid(destination_node_identifier)) {
             this.instantiationErrorReason = 'Edge destination or source invalid';

frontend/src/models/graph-object.js

@@ -67,8 +67,10 @@ class GraphObject {
      * @param {string[]} params.labels - The labels for the object.
      * @param {Object} params.properties - The optional property:value map for the object.
      * @param {string} params.identifier - The unique identifier in Spanner
+     * @param {boolean} params.containsDynamicLabelElement - True if there is dynamic label element type
+     * @param {Set<Set<string>>} params.allSchemaStaticLabelSets - A set containing sets of static labels from all table definitions
      */
-    constructor({ labels, properties, key_property_names, identifier }) {
+    constructor({ labels, properties, key_property_names, identifier, containsDynamicLabelElement, allSchemaStaticLabelSets }) {
         if (!Array.isArray(labels)) {
             throw new TypeError('labels must be an Array');
         }
@@ -77,7 +79,53 @@ class GraphObject {
             throw new TypeError('Invalid identifier');
         }
 
-        this.labels = labels;
+        let displayLabels = [...labels]; // Start with a copy of the original labels
+        
+        // Check if the instance's labels match any of the static label sets defined in the schema.
+        // `allSchemaStaticLabelSets` is a Set of Sets (e.g., Set<Set<'LabelA', 'LabelB'>>).
+        if (containsDynamicLabelElement && allSchemaStaticLabelSets instanceof Set && allSchemaStaticLabelSets.size > 0) {
+            for (const schemaStaticSet of allSchemaStaticLabelSets) {
+                // `schemaStaticSet` is one of the Set<string> from the schema (e.g., {'GraphNode'}).
+                if (!schemaStaticSet instanceof Set) {
+                    continue;
+                }
+                if ( schemaStaticSet.size == 0) {
+                    continue;
+                }
+                if (schemaStaticSet.size >= labels.size) {
+                    continue;
+                }
+                // Check if all labels in `schemaStaticSet` are present in the `instanceLabelsSet`.
+                let isSubset = true;
+                for (const staticLabel of schemaStaticSet) {
+                    if (!labels.includes(staticLabel)) {
+                        isSubset = false;
+                        break;
+                    }
+                }
+
+                if (isSubset) {
+                    // The instance's labels contain a complete static label set from the schema.
+                    // Filter these static labels out to get the "dynamic" or additional labels.
+                    const originalDisplayLabelsBeforeFilter = [...displayLabels];
+                    displayLabels = displayLabels.filter(l => !schemaStaticSet.has(l));
+
+                    // If filtering resulted in an empty list, but the original list was not empty,
+                    // it implies that the instance *only* had the static labels.
+                    // In this case, to avoid an object with no label, revert to showing the static labels.
+                    // This is important if `dynamicLabelExpr` was not used or didn't yield a new label.
+                    if (displayLabels.length === 0 && originalDisplayLabelsBeforeFilter.length > 0) {
+                        displayLabels = originalDisplayLabelsBeforeFilter;
+                    }
+                    // Assuming an object's labels should only be filtered against one primary static set.
+                    // If multiple static sets could be subsets, this `break` might need re-evaluation
+                    // or a more complex priority system for which static set "wins" for filtering.
+                    break;
+                }
+            }
+        }
+
+        this.labels = displayLabels;
         this.labelString = this.labels.join(' | ');
         this.properties = properties;
         this.key_property_names = key_property_names;

frontend/src/models/node.js

@@ -64,15 +64,16 @@ class GraphNode extends GraphObject {
      * @property {string} color
      * @property {string} identifier
      * @property {bool} intermediate
+     * @property {Set<Set<string>>} allSchemaStaticLabelSets - A set of static label sets from all node table definitions in the schema.
      */
 
     /**
     * A node on the graph
     * @param {NodeData} params
     */
     constructor(params) {
-        const { labels, title, properties, value, key_property_names, identifier, intermediate } = params;
-        super({ labels, title, properties, key_property_names, identifier });
+        const { labels, title, properties, value, key_property_names, identifier, intermediate, containsDynamicLabelElement, allSchemaStaticLabelSets} = params;
+        super({ labels, title, properties, key_property_names, identifier, containsDynamicLabelElement, allSchemaStaticLabelSets});
 
         this.value = value;
         this.instantiated = true;

frontend/src/models/schema.js

@@ -38,6 +38,8 @@ class Schema {
      * @property {string} baseSchemaName
      * @property {string} baseTableName
      * @property {EdgeDestinationNode} destinationNodeTable
+     * @property {string} [dynamicLabelExpr] - Optional SQL expression for dynamic node labels.
+     * @property {string} [dynamicPropertyExpr] - Optional SQL expression for dynamic node properties (JSON).
      * @property {Array<string>} keyColumns
      * @property {string} kind
      * @property {Array<string>} labelNames
@@ -51,6 +53,8 @@ class Schema {
      * @property {string} baseCatalogName
      * @property {string} baseSchemaName
      * @property {string} baseTableName
+     * @property {string} [dynamicLabelExpr] - Optional SQL expression for dynamic node labels.
+     * @property {string} [dynamicPropertyExpr] - Optional SQL expression for dynamic node properties (JSON).
      * @property {Array<string>} keyColumns
      * @property {string} kind
      * @property {Array<string>} labelNames
@@ -107,6 +111,22 @@ class Schema {
      */
     rawSchema;
 
+    /**
+     * Pre-calculated set of static label sets from all node table definitions.
+     * Each inner Set contains the `labelNames` for a node table.
+     * @type {Set<Set<string>>}
+     * @private
+     */
+    _allNodeTableStaticLabelSets = new Set();
+
+    /**
+     * Pre-calculated set of static label sets from all edge table definitions.
+     * Each inner Set contains the `labelNames` for an edge table.
+     * @type {Set<Set<string>>}
+     * @private
+     */
+    _allEdgeTableStaticLabelSets = new Set();
+
     /**
      * @param {RawSchema} rawSchemaObject
      */
@@ -128,6 +148,71 @@ class Schema {
         if (!this.rawSchema.propertyDeclarations || !Array.isArray(this.rawSchema.propertyDeclarations)) {
             this.rawSchema.propertyDeclarations = [];
         }
+        this._precalculateDynamicLabelSets();
+    }
+
+   /**
+     * Pre-calculates sets of static labels for tables using dynamic labeling.
+     * This is called internally by the constructor.
+     * @private
+     */
+   _precalculateDynamicLabelSets() {
+       this._allNodeTableStaticLabelSets = new Set();
+       this._allEdgeTableStaticLabelSets = new Set();
+       
+       // Process Node Tables
+       (this.rawSchema.nodeTables || []).forEach(table => {
+           // Collect labelNames if it's a valid array and non-empty
+           if (Array.isArray(table.labelNames) && table.labelNames.length > 0) {
+               this._allNodeTableStaticLabelSets.add(new Set(table.labelNames));
+            }
+        });
+
+        // Process Edge Tables
+        (this.rawSchema.edgeTables || []).forEach(table => {
+             // Collect labelNames if it's a valid array and non-empty
+             if (Array.isArray(table.labelNames) && table.labelNames.length > 0) {
+                 this._allEdgeTableStaticLabelSets.add(new Set(table.labelNames));
+            }
+        });
+    }
+
+    /**
+     * Returns the pre-calculated set of static label sets from all node table definitions.
+     * @returns {Set<Set<string>>} A Set of Sets, where each inner Set contains static string labels.
+     */
+    getAllNodeTableStaticLabelSets() {
+        return this._allNodeTableStaticLabelSets;
+    }
+
+    /**
+     * Returns the pre-calculated set of static label sets from all edge table definitions.
+     * @returns {Set<Set<string>>} A Set of Sets, where each inner Set contains static string labels.
+     */
+    getAllEdgeTableStaticLabelSets() {
+        return this._allEdgeTableStaticLabelSets;
+    }
+
+    /**
+     * @returns {boolean} True if there is a dynamic label node table.
+     */
+    containsDynamicLabelNode() {
+        return (this.rawSchema.nodeTables || []).some(table => 
+            table.dynamicLabelExpr &&
+            typeof table.dynamicLabelExpr === "string" &&
+            table.dynamicLabelExpr.length > 0
+        );
+    }
+
+    /**
+     * @returns {boolean} True if there is a dynamic label edge table.
+     */
+    containsDynamicLabelEdge() {
+        return (this.rawSchema.edgeTables || []).some(table => 
+            table.dynamicLabelExpr &&
+            typeof table.dynamicLabelExpr === "string" &&
+            table.dynamicLabelExpr.length > 0
+        );
     }
 
     /**

frontend/src/spanner-config.js

@@ -90,10 +90,39 @@ class GraphConfig {
     colorScheme = GraphConfig.ColorScheme.NEIGHBORHOOD;
 
     colorPalette = [
-        '#1A73E8', '#E52592', '#12A4AF', '#F4511E',
-        '#9334E6', '#689F38', '#3949AB', '#546E7A',
-        '#EF6C00', '#D93025', '#1E8E3E', '#039BE5'
-    ];
+        '#1A73E8',
+        '#E52592',
+        '#12A4AF',
+        '#F4511E',
+        '#9334E6',
+        '#689F38',
+        '#3949AB',
+        '#546E7A',
+        '#EF6C00',
+        '#D93025',
+        '#1E8E3E',
+        '#039BE5',
+        '#4682B4',
+        '#F0E68C',
+        '#00FFFF',
+        '#FFB6C1',
+        '#E6E6FA',
+        '#7B68EE',
+        '#CD853F',
+        '#BDB76B',
+        '#40E0D0',
+        '#708090',
+        '#DA70D6',
+        '#32CD32',
+        '#8B008B',
+        '#B0E0E6',
+        '#FF7F50',
+        '#A0522D',
+        '#6B8E23',
+        '#DC143C',
+        '#FFD700',
+        '#DB7093',
+    ]
 
     // [label: string]: colorString
     nodeColors = {};
@@ -181,10 +210,10 @@ class GraphConfig {
      * @param {RawSchema} config.schemaData - Raw schema data from Spanner
      */
     constructor({ nodesData, edgesData, colorPalette, colorScheme, rowsData, schemaData, queryResult}) {
+        this.parseSchema(schemaData);
         this.nodes = this.parseNodes(nodesData);
         this.nodeCount = Object.keys(this.nodes).length;
         this.edges = this.parseEdges(edgesData);
-        this.parseSchema(schemaData);
 
         this.nodeColors = {};
         this.assignColors();
@@ -205,8 +234,6 @@ class GraphConfig {
      * Assigns colors for node labels to the existing color map
      */
     assignColors() {
-        const colorPalette = this.colorPalette.map(color => color);
-
         const labels = new Set();
 
         for (const uid of Object.keys(this.nodes)) {
@@ -228,7 +255,7 @@ class GraphConfig {
         }
 
         for (const label of labels) {
-            if (colorPalette.length === 0) {
+            if (this.colorPalette.length === 0) {
                 console.error('Node labels exceed the color palette. Assigning default color.');
                 continue;
             }
@@ -239,7 +266,7 @@ class GraphConfig {
             }
 
             if (!this.nodeColors[label]) {
-                this.nodeColors[label] = colorPalette.shift();
+                this.nodeColors[label] = this.colorPalette.shift();
             }
         }
     }
@@ -251,6 +278,7 @@ class GraphConfig {
      */
     parseSchema(schemaData) {
         if (!(schemaData instanceof Object)) {
+            this.schema = new Schema({});
             return;
         }
 
@@ -313,14 +341,17 @@ class GraphConfig {
 
         /** @type {NodeMap} */
         const nodes = {};
+        const allSchemaStaticLabelSets = this.schema.getAllNodeTableStaticLabelSets();
+        const containsDynamicLabelElement = this.schema.containsDynamicLabelNode();
         nodesData.forEach(nodeData => {
             if (!(nodeData instanceof Object)) {
                 console.error('Node data is not an object', nodeData);
                 return;
             }
+            const fullNodeData = { ...nodeData, containsDynamicLabelElement, allSchemaStaticLabelSets };
 
             // Try to create a Node
-            const node = new GraphNode(nodeData);
+            const node = new GraphNode(fullNodeData);
             if (!node || !node.instantiated) {
                 console.error('Unable to instantiate node', node.instantiationErrorReason);
                 return;
@@ -332,7 +363,7 @@ class GraphConfig {
                 }
             } else {
                 node.instantiationErrorReason = 'Could not construct an instance of Node';
-                console.error(node.instantiationErrorReason, { nodeData, node });
+                console.error(node.instantiationErrorReason, { fullNodeData, node });
             }
         });
 
@@ -353,14 +384,17 @@ class GraphConfig {
 
         /** @type {EdgeMap} */
         const edges = {}
+        const allSchemaStaticLabelSets = this.schema.getAllEdgeTableStaticLabelSets();
+        const containsDynamicLabelElement = this.schema.containsDynamicLabelEdge();
         edgesData.forEach(edgeData => {
             if (!(edgeData instanceof Object)) {
                 console.error('Edge data is not an object', edgeData);
                 return;
             }
+            const fullEdgeData = { ...edgeData, containsDynamicLabelElement, allSchemaStaticLabelSets };
 
             // Try to create an Edge
-            const edge = new GraphEdge(edgeData);
+            const edge = new GraphEdge(fullEdgeData);
             if (!edge || !edge.instantiated) {
                 console.error('Unable to instantiate edge', edge.instantiationErrorReason);
                 return;
@@ -372,7 +406,7 @@ class GraphConfig {
                 this._updateEdgeIndices(edge);
             } else {
                 edge.instantiationErrorReason = 'Could not construct an instance of Edge';
-                console.error(edge.instantiationErrorReason, { edgeData, edge });
+                console.error(edge.instantiationErrorReason, { fullEdgeData, edge });
             }
         });
 

frontend/tests/unit/spanner-config.test.ts

@@ -235,7 +235,6 @@ describe('GraphConfig', () => {
                 schemaData: null
             });
 
-            expect(config.schema).toBeNull();
             expect(Object.keys(config.schemaNodes).length).toBe(0);
             expect(Object.keys(config.schemaEdges).length).toBe(0);
         });

frontend/tests/unit/spanner-store.test.ts

@@ -125,7 +125,7 @@ describe('GraphStore', () => {
             labels: 2,
             nodeTables: [mockNodeTable, mockNodeTable2],
             edgeTables: [mockEdgeTable, mockEdgeTable2],
-            propertyDeclarations: mockPropertyDeclarations
+            propertyDeclarations: mockPropertyDeclarations,
         };
 
         mockConfig = new GraphConfig({

spanner_graphs/graph_server.py

@@ -211,7 +211,7 @@ def execute_query(project: str, instance: str, database: str, query: str, mock =
 
     try:
         query_result, fields, rows, schema_json, err = database.execute_query(query)
-        if len(rows) == 0 : # if query returned an error
+        if len(rows) == 0 and err : # if query returned an error
             if schema_json: # if the schema exists
                 return {
                     "response": {