@journeyapps-labs/reactor-mod-data-browser 3.2.1 → 3.4.0

package/src/forms/types/number-handler.tsx

@@ -1,4 +1,4 @@
-import { NumberType, Variable } from '@journeyapps/db';
+import { IntegerType, NumberType, Variable } from '@journeyapps/db';
 import { DialogStore2, FormInput, NumberInput, ioc } from '@journeyapps-labs/reactor-mod';
 import { TypeHandler } from './shared/type-handler';
 import { Condition, SimpleFilter, Statement, StatementMatch } from '../../core/query/filters';
@@ -68,7 +68,8 @@ class NumberFilterForm extends ConditionalFilterForm<number> {
 }
 
 export const numberHandler: TypeHandler = {
-  matches: (type) => type instanceof NumberType,
+  matches: (type) => type instanceof NumberType || type instanceof IntegerType,
+  getTypeLabel: (type) => (type instanceof IntegerType ? 'Integer' : 'Number'),
   encode: async (value: number) => value,
   decode: async (value: number) => value,
   encodeToScalar: async (value: number) => value,

package/src/forms/types/shared/type-handler.ts

@@ -9,6 +9,7 @@ export type ScalarValue = string | number | boolean | null;
 
 export interface TypeHandler<T extends Type = Type, ENCODED = any, DECODED = any> {
   matches: (type: Type) => boolean;
+  getTypeLabel?: (type: T) => string;
   generateField: (event: { label: string; name: string; type: T }) => FormInput;
   generateDisplay: (event: {
     label: string;

package/src/forms/types/single-choice-handler.tsx

@@ -6,6 +6,7 @@ import { Condition, SimpleFilter, Statement } from '../../core/query/filters';
 
 export const singleChoiceHandler: TypeHandler = {
   matches: (type) => type instanceof SingleChoiceType,
+  getTypeLabel: () => 'Single choice',
   encode: async (value: string) => value,
   decode: async (value: string) => value,
   encodeToScalar: async (value: string) => value,

package/src/forms/types/single-choice-integer-handler.tsx

@@ -6,6 +6,7 @@ import { Condition, SimpleFilter, Statement } from '../../core/query/filters';
 
 export const singleChoiceIntegerHandler: TypeHandler = {
   matches: (type) => type instanceof SingleChoiceIntegerType,
+  getTypeLabel: () => 'Single choice integer',
   encode: async (value: string) => parseInt(value),
   decode: async (value: number) => `${value}`,
   encodeToScalar: async (value: string) => value,

package/src/forms/types/text-handler.tsx

@@ -150,6 +150,7 @@ class TextFilterForm extends ConditionalFilterForm<string> {
 export const textHandler = (context: TypeHandlerContext): TypeHandler<TextType, string, string> => {
   return {
     matches: (type) => type instanceof TextType,
+    getTypeLabel: () => 'Text',
     encode: async (value: string) => value,
     decode: async (value: string) => value,
     encodeToScalar: async (value: string) => value,

package/src/panels/model-json/ModelJsonPanelWidget.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { useEffect, useState } from 'react';
+import { JSX, useEffect, useState } from 'react';
 import { observer } from 'mobx-react';
 import styled from '@emotion/styled';
 import { BorderLayoutWidget, LoadingPanelWidget, PanelToolbarWidget } from '@journeyapps-labs/reactor-mod';
-import { saveFile, copyTextToClipboard } from '@journeyapps-labs/lib-reactor-utils';
+import { copyTextToClipboard, saveFile } from '@journeyapps-labs/lib-reactor-utils';
 import { ModelJsonPanelModel } from './ModelJsonPanelFactory';
 import { SimpleEditorWidget } from '@journeyapps-labs/reactor-mod-editor';
 
@@ -25,7 +25,7 @@ namespace S {
 }
 
 export const ModelJsonPanelWidget: React.FC<QueryPanelWidgetProps> = observer((props) => {
-  const [json, setJson] = useState(null);
+  const [json, setJson] = useState<string | null>(null);
 
   useEffect(() => {
     if (!props.model?.model?.data) {
@@ -39,8 +39,8 @@ export const ModelJsonPanelWidget: React.FC<QueryPanelWidgetProps> = observer((p
     }
   }, [props.model.model?.data]);
 
-  let top = null;
-  if (props.model.model) {
+  let top: JSX.Element;
+  if (props.model.model && json) {
     top = (
       <PanelToolbarWidget
         btns={[
@@ -67,6 +67,8 @@ export const ModelJsonPanelWidget: React.FC<QueryPanelWidgetProps> = observer((p
             label: 'ID',
             value: props.model?.id
           },
+
+          // @ts-ignore FIXME, this can take null
           props.model?.field
             ? {
                 label: 'Field',
@@ -83,7 +85,7 @@ export const ModelJsonPanelWidget: React.FC<QueryPanelWidgetProps> = observer((p
       {() => {
         return (
           <BorderLayoutWidget top={top}>
-            <S.SimpleEditor lang="application/json" path={`${props.model.model.id}`} text={json} />
+            <S.SimpleEditor lang="application/json" path={`${props.model.model.id}`} text={json!} />
           </BorderLayoutWidget>
         );
       }}

package/src/panels/query/QueryPanelFactory.tsx

@@ -4,7 +4,7 @@ import { QueryPanelWidget } from './QueryPanelWidget';
 import { AbstractQuery } from '../../core/query/AbstractQuery';
 import { ConnectionStore } from '../../stores/ConnectionStore';
 import { observable } from 'mobx';
-import { WorkspaceModelFactoryEvent } from '@projectstorm/react-workspaces-core';
+import { WorkspaceEngine, WorkspaceModelFactoryEvent } from '@projectstorm/react-workspaces-core';
 import { AbstractSerializableQuery } from '../../core/query/AbstractSerializableQuery';
 import { SavedQueryStore } from '../../stores/SavedQueryStore';
 import { AbstractConnection } from '../../core/AbstractConnection';
@@ -48,7 +48,7 @@ export class QueryPanelModel extends ReactorPanelModel {
     };
   }
 
-  fromArray(data: ReturnType<this['toArray']>, engine) {
+  fromArray(data: ReturnType<this['toArray']>, engine: WorkspaceEngine) {
     super.fromArray(data, engine);
     this.current_page = data.current_page || 0;
   }

package/src/panels/query/table-controls/FilterControlsWidget.tsx

@@ -31,6 +31,7 @@ export const FilterControlsWidget: React.FC<FilterControlsWidgetProps> = (props)
           return {
             key: field.key,
             title: field.label,
+            group: field.group,
             action: async () => {
               await props.simpleQuery.filterState.setupFilterForField(field.key, event.nativeEvent as any);
               props.goToPage?.(0);

package/src/stores/ConnectionStore.ts

@@ -1,6 +1,6 @@
 import { AbstractStore, LocalStorageSerializer } from '@journeyapps-labs/reactor-mod';
 import { AbstractConnection, AbstractConnectionSerialized } from '../core/AbstractConnection';
-import { action, computed, observable, runInAction, when } from 'mobx';
+import { computed, observable, runInAction, when } from 'mobx';
 import { AbstractConnectionFactory } from '../core/AbstractConnectionFactory';
 import { getDefaultConnectionColor } from '../core/connection-colors';
 
@@ -51,9 +51,18 @@ export class ConnectionStore extends AbstractStore<ConnectionStoreSerialized> {
   }
 
   async deserializeConnection(data: AbstractConnectionSerialized) {
-    let conn = this._connectionFactories.get(data.factory).generateConnection();
+    let conn = this._connectionFactories.get(data.factory)?.generateConnection();
+    if (!conn) {
+      return null;
+    }
+
     conn.id = data.id;
-    await conn._deSerialize(data.payload);
+    try {
+      await conn._deSerialize(data.payload);
+    } catch (ex) {
+      this.logger.error(`Failed to deserialize connection: [${conn.id}]`, ex);
+      return null;
+    }
     conn.color = data.color || getDefaultConnectionColor(conn.id);
     return conn;
   }
@@ -66,9 +75,11 @@ export class ConnectionStore extends AbstractStore<ConnectionStoreSerialized> {
           return this.deserializeConnection(connSer);
         })
       );
-      connections.forEach((c) => {
-        this.addConnection(c);
-      });
+      connections
+        .filter((c) => !!c)
+        .forEach((c) => {
+          this.addConnection(c);
+        });
     });
   }