Added Default Values for first component in Storyboard

I added the first default values to our component and did some troubleshooting to get the component showing up in the storyboard canvas.
BimberLab · Apr 8, 2024 · 094e0a7 · 094e0a7
1 parent 5ebeb5b
commit 094e0a7
Show file tree

Hide file tree

Showing 2 changed files with 79 additions and 5 deletions.
diff --git a/stories/Field-type-info.jsx b/stories/Field-type-info.jsx
@@ -1,9 +1,22 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ValueComponent from '../packages/discvr-ui-components/field-type-info'
+import {ValueComponent} from '../packages/discvr-ui-components/field-type-info'
 
 
-export const fieldType = ValueComponent({filter, index, highlightedInputs, handleFilterChange, allowedGroupNames, fieldTypeInfo});
+export const fieldType = ({filter, index, highlightedInputs, handleFilterChange, allowedGroupNames, fieldTypeInfo}) => { 
+    //ValueComponent({filter, index, highlightedInputs, handleFilterChange, allowedGroupNames, fieldTypeInfo})
+
+    return (
+        <ValueComponent
+            filter={filter}
+            index={index}
+            highlightedInputs={highlightedInputs}
+            handleFilterChange={handleFilterChange}
+            allowedGroupNames={allowedGroupNames}
+            fieldTypeInfo={fieldTypeInfo}
+        />
+    ); 
+};
 
 fieldType.PropTypes = {
 
@@ -27,7 +40,7 @@ fieldType.PropTypes = {
 
     allowedGroupNames: PropTypes.any,
 
-    fieldTypeInfo: PropTypes.shape(
+    fieldTypeInfo: PropTypes.arrayOf(PropTypes.shape(
         {
             name: PropTypes.string,
             label: PropTypes.string,
@@ -45,13 +58,53 @@ fieldType.PropTypes = {
             flex: PropTypes.number,
             supportsFilter: PropTypes.bool
         }
-    )
+    ))
 };
 
 fieldType.defaultProps = {
     filter: {
         field:  '',
         operator: '',
         value: ''
-    }
+    },
+    index: 0,
+    highlightedInputs: [{field:false, operator:false, value:false},{field:false, operator:false, value:false}],
+    handleFilterChange: (_index, _key, _value) => ({ field: "", operator: "", value: "" }),
+    allowedGroupNames: null,
+    fieldTypeInfo: [{
+        name: '',
+        label: '',
+        description: '',
+        type: '',
+        isInDefaultColumns: false,
+        isMultiValued: false,
+        isHidden: false,
+        colWidth: 0,
+        formatString: '',
+        orderKey: 0,
+        allowableValues: [],
+        category: '',
+        url: '',
+        flex: 0,
+        supportsFilter: false
+    },
+    {
+        name: '',
+        label: '',
+        description: '',
+        type: '',
+        isInDefaultColumns: false,
+        isMultiValued: false,
+        isHidden: false,
+        colWidth: 0,
+        formatString: '',
+        orderKey: 0,
+        allowableValues: [],
+        category: '',
+        url: '',
+        flex: 0,
+        supportsFilter: false
+    }]
+
+
 }
diff --git a/stories/Field-type-info.stories.js b/stories/Field-type-info.stories.js
@@ -0,0 +1,21 @@
+import { fn } from '@storybook/test';
+import { fieldType } from './Field-type-info';
+
+export default {
+    title: 'Field-type-info',
+    component: fieldType,
+    parameters: {
+        layout: 'centered'
+    },
+    tags: ['autodocs'],
+    argTypes: {
+
+    },
+    args: { handleFilterChange: fn() },
+};
+
+export const Primary = {
+    args: {
+
+    },
+  };