apps/web/src/components/navbar/navbar.tsx

@@ -88,7 +88,7 @@ export const Navbar = () => {
               </div>
             </PopoverTrigger>
 
-            <PopoverContent className="w-56 z-30 bg-white rounded-sm border-[1px] outline-none">
+            <PopoverContent className="w-56 z-30 bg-light rounded-sm border-[1px] outline-none">
               <div className="p-2 text-sm border-b">
                 <h2 className="font-bold">user: {authCache.username}</h2>
                 <h3 className="text-xs break-words">session: {authCache.sessionID}</h3>

libs/shared/lib/components/VisualizationTooltip/VisualizationTooltip.tsx

@@ -9,7 +9,7 @@ export type VisualizationTooltipProps = {
 
 export const VisualizationTooltip: React.FC<VisualizationTooltipProps> = ({ name, colorHeader, children }) => {
   return (
-    <div className="border-1 border-sec-200 bg-white w-[12rem] -mx-2 -my-2">
+    <div className="border-1 border-sec-200 bg-light w-[12rem] -mx-2 -my-2">
       <div className="flex m-0 justify-start items-stretch border-b border-sec-200 relative">
         <div className="left-0 top-0 h-auto w-1.5" style={{ backgroundColor: colorHeader }}></div>
         <div className="px-2.5 py-1 truncate flex">

libs/shared/lib/components/charts/colorLegendSeqDiv/index.tsx

@@ -15,9 +15,6 @@ export const ColorLegendSeqDiv = ({ colors, data, tickCount = 5, name }: ColorLe
   useEffect(() => {
     if (!svgRef.current) return;
 
-    console.log(colors);
-    //console.log(divergenceColors.blueRed);
-
     const widthSVG: number = +svgRef.current.clientWidth;
     const heightSVG: number = +svgRef.current.clientHeight;
 

libs/shared/lib/components/charts/scatterplot_pixi/index.tsx

@@ -69,7 +69,6 @@ const Scatterplot: React.FC<ScatterplotProps> = ({ data, visualConfig, xScale, o
 
     const yScale = d3.scaleLinear().domain([-1, 1]).range([visualConfig.heightMargin, 0]);
 
-    console.log(visualConfig);
     // PIXI
     const app = new PIXI.Application({
       width: visualConfig.width,
@@ -103,8 +102,6 @@ const Scatterplot: React.FC<ScatterplotProps> = ({ data, visualConfig, xScale, o
       d.gfx = graphics;
     });
 
-    console.log('DONE SIMULATION');
-
     const svg = d3
       .select(svgRef.current)
       .attr('width', visualConfig.width)

libs/shared/lib/components/inputs/index.tsx

@@ -78,6 +78,11 @@ type BooleanProps = {
   value: boolean;
   tooltip?: string;
   onChange?: (value: boolean) => void;
+  size?: 'xs' | 'sm' | 'md' | 'xl';
+  info?: string;
+  required?: boolean;
+  className?: string;
+  inline?: boolean;
 };
 
 type RadioProps = {
@@ -417,23 +422,31 @@ export const CheckboxInput = ({ label, value, options, onChange, tooltip }: Chec
   );
 };
 
-export const BooleanInput = ({ label, value, onChange, tooltip }: BooleanProps) => {
+export const BooleanInput = ({ label, value, onChange, tooltip, info, size, required, className }: BooleanProps) => {
   return (
     <Tooltip>
-      <TooltipTrigger>
-        <label className={`label cursor-pointer w-fit gap-2 px-0 py-1`}>
-          <span className="text-sm">{label}</span>
-          <input
-            type="checkbox"
-            checked={value}
-            onChange={(event) => {
-              if (onChange) {
-                onChange(event.target.checked);
-              }
-            }}
-            className="checkbox checkbox-xs"
-          />
-        </label>
+      <TooltipTrigger className={className + 'w-full flex justify-between'}>
+        {label && (
+          <label className="label p-0">
+            <span
+              className={`text-${size} text-left truncate font-medium text-secondary-700 ${required && "after:content-['*'] after:ml-0.5 after:text-danger-500"}`}
+            >
+              {label}
+            </span>
+            {info && <Info tooltip={info} />}
+          </label>
+        )}
+        <input
+          type="checkbox"
+          checked={value}
+          onChange={(event) => {
+            if (onChange) {
+              onChange(event.target.checked);
+            }
+          }}
+          className="checkbox checkbox-xs"
+          aria-label={`Toggle ${label}`}
+        />
       </TooltipTrigger>
       {tooltip && <TooltipContent>{tooltip}</TooltipContent>}
     </Tooltip>

libs/shared/lib/data-access/broker/wsState.tsx

@@ -147,7 +147,6 @@ export function wsTestSaveStateConnectionSubscription(callback: TestSaveStateCon
 }
 
 export function wsUpdateState(request: SaveStateI, callback?: GetStateResponse) {
-  //console.log('wsUpdateState', request);
   Broker.instance().sendMessage(
     {
       key: 'state',

libs/shared/lib/graph-layout/cytoscape-layouts.ts

@@ -80,11 +80,8 @@ export abstract class CytoscapeLayout extends Layout<CytoscapeProvider> {
   protected defaultLayoutSettings = {
     animate: false,
     animationDuration: 5000,
-    ready: function () {
-      // console.info('Layout.ready');
-    }, // on layoutready
+    ready: function () {}, // on layoutready
     stop: () => {
-      // console.log('Layout.stop');
       this.updateNodePositions();
     }, // on layoutstop
   };
@@ -412,7 +409,6 @@ class CytoscapeCoseBilkent extends CytoscapeLayout {
     //   const node = event.target;
     //   // The node's position has changed
     //   // You can access the new position with node.position()
-    //   console.log(node, event.target.position());
     //   this.updateNodePositions();
     // });
   }
@@ -585,7 +581,7 @@ class CytoscapeBreathFirst extends CytoscapeLayout {
 
       name: 'breadthfirst',
     } as any);
-    // console.log('CytoscapeBreathFirst.layout', layout);
+
     layout.run();
 
     this.updateNodePositions();

libs/shared/lib/graph-layout/graphology-layouts.ts

@@ -55,7 +55,6 @@ export abstract class GraphologyLayout extends Layout<GraphologyProvider> {
       throw new Error('The graph is not set.');
     }
 
-    // console.log('Getting position for node:', nodeId, this.graph.getNodeAttributes(nodeId));
     return this.graph.getNodeAttributes(nodeId);
   }
 }
@@ -207,7 +206,7 @@ export class GraphologyForceAtlas2Webworker extends GraphologyLayout {
     let settings = {
       ...this.defaultLayoutSettings,
       ...sensibleSettings,
-      adjustSizes: graph.order < 300 ? true : false
+      adjustSizes: graph.order < 300 ? true : false,
     };
 
     if (graph.order > 5000) {
@@ -215,7 +214,7 @@ export class GraphologyForceAtlas2Webworker extends GraphologyLayout {
         ...settings,
         barnesHutOptimize: true,
         barnesHutTheta: 0.75,
-        slowDown: 0.75
+        slowDown: 0.75,
       };
     }
 

libs/shared/lib/graph-layout/layout.ts

@@ -23,7 +23,6 @@ export abstract class Layout<provider extends Providers> {
 
     if (boundingBox !== undefined) {
       this.boundingBox = boundingBox;
-      // console.log(`Setting bounding box to ${JSON.stringify(this.boundingBox)}`);
     }
 
     if (this.verbose) {

libs/shared/lib/querybuilder/model/graphology/utils.ts

@@ -232,8 +232,6 @@ export class QueryMultiGraphology extends Graph<QueryGraphNodes, QueryGraphEdges
       handleType: targetHandleType,
     };
 
-    // console.log('newEdge', attributes, source, target);
-
     // Add/edit an edge to the graphology object
     const edgeResult = this.mergeEdge(source.id, target.id, attributes as QueryGraphEdges);
 

libs/shared/lib/querybuilder/panel/QueryBuilder.tsx

@@ -143,9 +143,7 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
    * TODO?
    */
   function onNodesChange(nodes: NodeChange[]) {
-    // console.log(nodes);
     nodes.forEach((n) => {
-      // console.log(graphologyGraph.findNode((gn) => gn === n?.id));
       if (n.type !== 'position') {
         // updated = true;
         // graphologyGraph.updateAttributes(n.id, n.data);
@@ -269,7 +267,6 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
 
     switch (dragData.type) {
       case QueryElementTypes.Entity:
-        // console.log('entity drop', dragData, schema.getNodeAttribute(dragData.name, 'attributes'));
         graphologyGraph.addPill2Graphology(
           {
             type: QueryElementTypes.Entity,
@@ -376,20 +373,15 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
   };
 
   const onNodeMouseEnter = (event: React.MouseEvent, node: Node) => {
-    // console.log(node);
-    // console.log(schema.getNodeAttribute(node.type, 'attributes'));
     setAllowZoom(false);
   };
 
   const onNodeMouseLeave = (event: React.MouseEvent, node: Node) => {
-    // console.log(node);
     setAllowZoom(true);
   };
 
   const onConnect = useCallback(
     (connection: Connection) => {
-      console.log(connection);
-
       if (!isEdgeUpdating.current) {
         isOnConnect.current = true;
         if (!connection.sourceHandle || !connection.targetHandle) throw new Error('Connection has no source or target');
@@ -409,7 +401,6 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
 
   const onConnectStart = useCallback(
     (event: React.MouseEvent | React.TouchEvent, params: OnConnectStartParams) => {
-      // console.log('onConnectStart', params);
       if (!params?.handleId) return;
 
       let node = graphologyGraph.getNodeAttributes(params.nodeId);
@@ -485,10 +476,6 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
     [graph],
   );
 
-  const onEdgesChange = (params: OnEdgesChange) => {
-    console.log('edges change', params);
-  };
-
   const onEdgeUpdateEnd = useCallback(
     (event: MouseEvent | TouchEvent, edge: Edge, handleType: HandleType) => {
       if (isEdgeUpdating.current) {

libs/shared/lib/querybuilder/panel/stories/querybuilder-simple.stories.tsx

@@ -137,7 +137,6 @@ export const Simple = {
     // );
     graph.addEdge2Graphology(entity1, relation1);
     graph.addEdge2Graphology(relation1, entity2);
-    // console.log(graph.getNodeAttributes('2'));
     // graph.addEdge('2', '1', { type: 'attribute_connection' });
     // graph.addEdge('3', '1', { type: 'attribute_connection' });
     // graph.addEdge('4', '0', { type: 'attribute_connection' });

libs/shared/lib/querybuilder/query-utils/query2backend.spec.ts

@@ -235,7 +235,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -277,7 +276,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -329,7 +327,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -365,7 +362,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -399,7 +395,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -458,7 +453,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -495,7 +489,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -547,7 +540,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -594,7 +586,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -620,7 +611,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -668,7 +658,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -703,7 +692,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -724,7 +712,6 @@ describe('QueryUtils Entity and Relations', () => {
       ],
     };
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 });
@@ -761,7 +748,6 @@ describe('QueryUtils calculateQueryLogic', () => {
     let logics = graphExport.nodes.filter((n) => n?.attributes?.type === QueryElementTypes.Logic) as SerializedNode<LogicNodeAttributes>[];
 
     const ret = calculateQueryLogic(logics[0], graphExport, logics);
-    // console.log(ret);
   });
 });
 
@@ -811,7 +797,6 @@ describe('QueryUtils with Logic', () => {
     };
 
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -893,7 +878,6 @@ describe('QueryUtils with Logic', () => {
     };
 
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -954,7 +938,6 @@ describe('QueryUtils with Logic', () => {
     };
 
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 
@@ -1006,7 +989,6 @@ describe('QueryUtils with Logic', () => {
     };
 
     let ret = Query2BackendQuery('database', graph.export(), defaultSettings);
-    // console.log(JSON.stringify(ret, null, 2));
     expect(ret).toMatchObject(expected);
   });
 });

libs/shared/lib/querybuilder/query-utils/query2backend.ts

@@ -25,10 +25,8 @@ const traverseEntityRelationPaths = (
   settings: QueryBuilderSettings,
 ): number => {
   if (!node?.attributes) throw Error('Malformed Graph! Node has no attributes');
-  // console.log(paths);
 
   if (!paths?.[currentIdx]) {
-    // console.log('new path');
     paths.push([]);
     if (node.attributes.type === QueryElementTypes.Relation) {
       paths[currentIdx].push({ type: QueryElementTypes.Entity, x: node.attributes.x, y: node.attributes.y, attributes: [] });
@@ -65,15 +63,12 @@ const traverseEntityRelationPaths = (
     }
     return 0;
   }
-  // console.log('connections', connections);
 
   const nodesToRight = connections
     .map((c, i) => {
       const rightNodeHandleData = c.attributes?.targetHandleData;
       if (!rightNodeHandleData) throw Error('Malformed Graph! One or more edges of a relation node do not exist');
 
-      // console.log('nodesToRight', c);
-      // console.log('entities', entities);
       if (paths[currentIdx].length > 10 || currentIdx > 10)
         throw Error('Malformed Graph! One or more edges of a relation node do not exist');
       const rightNode =
@@ -130,7 +125,6 @@ export function calculateQueryLogic(
             val = `\".*\"`; // Empty means allow anything
           }
         }
-        // console.log('val', val, inputRef, node);
         return val;
       } else if (connectionToInputRef.attributes?.sourceHandleData.nodeType === QueryElementTypes.Logic) {
         // Is connected to another logic node
@@ -249,16 +243,6 @@ export function Query2BackendQuery(
   let graphLogicChunks = logicsRightHandleFinal.map((node) => calculateQueryLogic(node, graph, logics));
   query.logic = queryLogicUnion(graphLogicChunks);
 
-  // Logic pathways extraction: now traverse the graph again though the logic components to construct the logic chunks
-
-  // console.log('logics', logics);
-  // console.log('entitiesEmptyLeftHandle', entitiesEmptyLeftHandle);
-  // console.log('relationsEmptyLeftHandle', relationsEmptyLeftHandle);
-  // console.log('graphSequenceChunks', graphSequenceChunks);
-  // console.log('graphLogicChunks', graphLogicChunks);
-  // console.log('logicsRightHandleConnectedOutside', logicsRightHandleConnectedOutside);
-  // console.log('logicsRightHandleFinal', logicsRightHandleFinal);
-  // console.log('graphSequenceChunksIdMap', graphSequenceChunksIdMap);
   if (!graphSequenceChunks || graphSequenceChunks.length === 0 || graphSequenceChunks?.[0].length === 0) return query;
 
   const processConnection = (chunk: QueryGraphNodes[], position: number): RelationStruct | NodeStruct => {

libs/shared/lib/schema/panel/Schema.tsx

@@ -98,6 +98,9 @@ export const Schema = (props: Props) => {
     await layout.current?.layout(expandedSchema, xy);
     const schemaFlow = schemaGraphology2Reactflow(expandedSchema, settings.connectionType, settings.animatedEdges);
 
+    schemaFlow.nodes = schemaFlow.nodes.filter((node) => !node.id.toLowerCase().includes('bloom'));
+    schemaFlow.edges = schemaFlow.edges.filter((edge) => !edge.id.toLowerCase().includes('bloom'));
+
     let nodesWithRef, edgesWithRef;
     if (!hasLayoutBeenRun) {
       nodesWithRef = schemaFlow.nodes.map((node) => {
@@ -263,10 +266,7 @@ export const Schema = (props: Props) => {
         </>
       }
     >
-      <div
-        className="schema-panel w-full h-full flex flex-col justify-between"
-        ref={reactFlowRef}
-      >
+      <div className="schema-panel w-full h-full flex flex-col justify-between" ref={reactFlowRef}>
         {nodes.length === 0 ? (
           <p className="m-3 text-xl font-bold">No Elements</p>
         ) : (

libs/shared/lib/schema/pills/nodes/relation/SchemaRelationshipPopup.tsx

@@ -27,7 +27,6 @@ export const SchemaRelationshipPopup = (props: SchemaRelationshipPopupProps) =>
     // dispatch(setSchemaSettings(state));
   }
 
-  console.log('data relation popup', props);
   return (
     <>
       <FormCard>
@@ -37,10 +36,7 @@ export const SchemaRelationshipPopup = (props: SchemaRelationshipPopupProps) =>
             submit();
           }}
         >
-          <FormTitle
-            title="Edge Statistics"
-            onClose={props.onClose}
-          />
+          <FormTitle title="Edge Statistics" onClose={props.onClose} />
           <FormHBar />
 
           <span className="px-5">

libs/shared/lib/schema/schema-utils/schema-usecases.spec.ts

@@ -7,8 +7,6 @@ describe('SchemaUsecases', () => {
   test.each([{ data: simpleSchemaRaw }, { data: movieSchemaRaw }, { data: northwindSchemaRaw }, { data: twitterSchemaRaw }])(
     'parseSchemaFromBackend parsing should work',
     ({ data }: any) => {
-      // console.log('testinput', input);
-
       const parsed = SchemaUtils.schemaBackend2Graphology(data as SchemaFromBackend);
       expect(parsed).toBeDefined();
     },

libs/shared/lib/schema/schema-utils/schema-usecases.ts

@@ -12,14 +12,12 @@ export function schemaExpandRelation(graph: SchemaGraphology): SchemaGraphology
   const newGraph = graph.copy();
 
   newGraph.forEachNode((node, attributes) => {
-    // console.log(node, attributes);
     newGraph.mergeNodeAttributes(node, { type: QueryElementTypes.Entity });
   });
 
   //makeNewRelationNodes
   graph.forEachEdge((edge, attributes, source, target): void => {
     const newID = 'RelationNode:' + edge;
-    // console.log('making relationnode', edge, attributes, source, target, newID);
     newGraph.addNode(newID, {
       ...attributes,
       name: edge,
@@ -36,7 +34,6 @@ export function schemaExpandRelation(graph: SchemaGraphology): SchemaGraphology
     });
 
     const id2 = 'RelationEdge' + newID + '->' + target;
-    // console.log('making newEdgeOutgoing', edge, attributes, source, target, id);
     newGraph.addDirectedEdgeWithKey(id2, newID, target, {});
 
     newGraph.dropEdge(edge);
@@ -49,7 +46,7 @@ export function schemaExpandRelation(graph: SchemaGraphology): SchemaGraphology
 export function schemaGraphology2Reactflow(
   graph: Graph,
   defaultEdgeType: string,
-  animatedEdges = false
+  animatedEdges = false,
 ): {
   nodes: Array<Node<SchemaReactflowNodeWithFunctions | SchemaReactflowRelationWithFunctions>>;
   edges: Array<Edge>;
@@ -86,7 +83,6 @@ export function createReactFlowEdges(graph: Graph, defaultEdgeType: string, anim
   const edgeElements: Array<Edge> = [];
 
   graph.forEachEdge((edge, attributes, source, target): void => {
-    // console.log('edges', attributes, edge);
     const newEdge: Edge = {
       id: edge,
       source: source,

libs/shared/lib/schema/schema-utils/schema-utils.ts

@@ -14,7 +14,6 @@ export class SchemaUtils {
 
     // Instantiate a directed graph that allows self loops and parallel edges
     const schemaGraphology = new SchemaGraphology({ allowSelfLoops: true });
-    // console.log('parsing schema');
     // The graph schema needs a node for each node AND edge. These need then be connected
     if (!nodes || !edges) return schemaGraphology;
 

libs/shared/lib/vis/visualizations/mapvis/components/ActionBar.tsx

@@ -15,10 +15,10 @@ export function ActionBar({ isSearching, setIsSearching, setSearchResult, setSel
   return (
     <div>
       <div className="absolute left-0 top-0 m-1">
-        <div className="cursor-pointer p-1 pb-0 bg-white shadow-md rounded" onClick={() => setSelectingRectangle(true)}>
+        <div className="cursor-pointer p-1 pb-0 bg-light shadow-md rounded" onClick={() => setSelectingRectangle(true)}>
           <Icon component="icon-[ic--baseline-highlight-alt]" />
         </div>
-        <div className="cursor-pointer p-1 mt-1 pb-0 bg-white shadow-md rounded" onClick={() => setIsSearching(!isSearching)}>
+        <div className="cursor-pointer p-1 mt-1 pb-0 bg-light shadow-md rounded" onClick={() => setIsSearching(!isSearching)}>
           <Icon component="icon-[ic--outline-search]" />
         </div>
       </div>