show json icon in perspectives

packages/datalib/src/PerspectiveDataPattern.ts

@@ -7,7 +7,7 @@ import _isBoolean from 'lodash/isBoolean';
 import _isArray from 'lodash/isArray';
 import { safeJsonParse } from 'dbgate-tools';
 
-export type PerspectiveDataPatternColumnType = 'null' | 'string' | 'number' | 'boolean' | 'json';
+export type PerspectiveDataPatternColumnType = 'null' | 'oid' | 'string' | 'number' | 'boolean' | 'json';
 
 export interface PerspectiveDataPatternColumn {
   name: string;
@@ -29,6 +29,7 @@ function detectValueType(value): PerspectiveDataPatternColumnType {
   if (_isString(value)) return 'string';
   if (_isNumber(value)) return 'number';
   if (_isBoolean(value)) return 'boolean';
+  if (value?.$oid) return 'oid';
   if (_isPlainObject(value) || _isArray(value)) return 'json';
   if (value == null) return 'null';
 }

packages/datalib/src/PerspectiveTreeNode.ts

@@ -818,6 +818,9 @@ export class PerspectivePatternColumnNode extends PerspectiveTreeNode {
   // }
 
   get icon() {
+    if (this.column.types.includes('json')) {
+      return 'img json';
+    }
     return 'img column';
   }
 
@@ -885,6 +888,10 @@ export class PerspectivePatternColumnNode extends PerspectiveTreeNode {
   }
 
   get filterInfo(): PerspectiveFilterColumnInfo {
+    if (this.isChildColumn) {
+      return null;
+    }
+
     return {
       columnName: this.columnName,
       filterType: this.filterType,

packages/web/src/designer/ColumnLine.svelte

@@ -61,6 +61,9 @@
   }
 
   $: sortOrderProps = settings?.getSortOrderProps ? settings?.getSortOrderProps(designerId, column.columnName) : null;
+  $: iconOverride = settings?.getColumnIconOverride
+    ? settings?.getColumnIconOverride(designerId, column.columnName)
+    : null;
 </script>
 
 <div
@@ -144,7 +147,7 @@
       }}
     />
   {/if}
-  <ColumnLabel {...column} {foreignKey} forceIcon />
+  <ColumnLabel {...column} {foreignKey} forceIcon {iconOverride} />
   {#if designerColumn?.filter}
     <FontIcon icon="img filter" />
   {/if}

packages/web/src/elements/ColumnLabel.svelte

@@ -23,8 +23,9 @@
   export let foreignKey;
   export let conid = undefined;
   export let database = undefined;
+  export let iconOverride = undefined;
 
-  $: icon = getColumnIcon($$props, forceIcon);
+  $: icon = iconOverride || getColumnIcon($$props, forceIcon);
 </script>
 
 <span class="label" class:notNull>

packages/web/src/perspectives/PerspectiveCell.svelte

@@ -23,7 +23,7 @@
       {:else}
         <span class="null"> (no image)</span>
       {/if}
-    {:else if _.isArray(value) || _.isPlainObject(value)}
+    {:else if !value.$oid && (_.isArray(value) || _.isPlainObject(value))}
       <JSONTree {value} slicedKeyCount={1} disableContextMenu />
     {:else}
       <CellValue {rowData} {value} />

packages/web/src/perspectives/PerspectiveDesigner.svelte

@@ -241,6 +241,14 @@
       const orderIndex = sort.length > 1 ? _.findIndex(sort, x => x.columnName == columnName) : -1;
       return { order, orderIndex };
     },
+    getColumnIconOverride: (designerId, columnName) => {
+      const pattern = dataPatterns?.[designerId];
+      const column = pattern?.columns.find(x => x.name == columnName);
+      if (column?.types?.includes('json')) {
+        return 'img json';
+      }
+      return null;
+    },
     isColumnFiltered: (designerId, columnName) => {
       return !!config.nodes.find(x => x.designerId == designerId)?.filters?.[columnName];
     },