From 9744cf0117d73b64b14ebfc7765fa93aafbd82e4 Mon Sep 17 00:00:00 2001
From: Elio Struyf <elio@struyfconsulting.be>
Date: Fri, 14 Jan 2022 13:00:27 +0100
Subject: [PATCH] #193 - Added data type support

---
 package.json                                  | 44 ++++++++++++++++++-
 src/constants/settings.ts                     |  1 +
 .../components/DataView/DataView.tsx          | 26 +++++++++--
 .../components/DataView/SortableItem.tsx      |  9 ++--
 src/dashboardWebView/models/Settings.ts       |  2 +
 src/helpers/DashboardSettings.ts              |  6 ++-
 src/models/DataFile.ts                        |  3 +-
 src/models/DataType.ts                        |  4 ++
 8 files changed, 85 insertions(+), 10 deletions(-)
 create mode 100644 src/models/DataType.ts

diff --git a/package.json b/package.json
index 3d7e2ce5..752057cb 100644
--- a/package.json
+++ b/package.json
@@ -358,6 +358,11 @@
                 "default": {},
                 "description": "The JSON schema for your data which will be used to render the data form.",
                 "additionalProperties": true
+              },
+              "type": {
+                "type": "string",
+                "default": "content",
+                "description": "If you are using data types, you can specify your type ID."
               }
             },
             "additionalProperties": false,
@@ -365,8 +370,45 @@
               "id",
               "title",
               "file",
-              "schema",
               "labelField"
+            ],
+            "anyOf": [
+              {
+                "required": [
+                  "schema"
+                ]
+              },
+              {
+                "required": [
+                  "type"
+                ]
+              }
+            ]
+          },
+          "scope": "Data"
+        },
+        "frontMatter.data.types": {
+          "type": "array",
+          "default": [],
+          "markdownDescription": "Specify the data types. These types can be used in for your data files. [Check in the docs](https://frontmatter.codes/docs/settings#frontmatter.data.types)",
+          "items": {
+            "type": "object",
+            "default": {},
+            "properties": {
+              "id": {
+                "type": "string",
+                "description": "Your unique ID you want to use for your data type."
+              },
+              "schema": {
+                "type": "object",
+                "default": {},
+                "description": "The JSON schema for your data which will be used to render the data form.",
+                "additionalProperties": true
+              }
+            },
+            "required": [
+              "id",
+              "schema"
             ]
           },
           "scope": "Data"
diff --git a/src/constants/settings.ts b/src/constants/settings.ts
index 166fa47e..45c612e4 100644
--- a/src/constants/settings.ts
+++ b/src/constants/settings.ts
@@ -56,6 +56,7 @@ export const SETTINGS_DASHBOARD_OPENONSTART = "dashboard.openOnStart";
 export const SETTINGS_DASHBOARD_MEDIA_SNIPPET = "dashboard.mediaSnippet";
 
 export const SETTINGS_DATA_FILES = "data.files";
+export const SETTINGS_DATA_TYPES = "data.types";
 
 export const SETTINGS_FRAMEWORK_ID = "framework.id";
 
diff --git a/src/dashboardWebView/components/DataView/DataView.tsx b/src/dashboardWebView/components/DataView/DataView.tsx
index bb619e70..4c107d34 100644
--- a/src/dashboardWebView/components/DataView/DataView.tsx
+++ b/src/dashboardWebView/components/DataView/DataView.tsx
@@ -18,6 +18,7 @@ import { SortableItem } from './SortableItem';
 import { ChevronRightIcon } from '@heroicons/react/outline';
 import { ToastContainer, toast, Slide } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
+import { DataType } from '../../../models/DataType';
 
 export interface IDataViewProps {}
 
@@ -75,7 +76,7 @@ export const DataView: React.FunctionComponent<IDataViewProps> = (props: React.P
     });
 
     // Show toast message
-    toast.success("Wow so easy!", {
+    toast.success("Your entry was submitted", {
       position: "top-right",
       autoClose: 2000,
       hideProgressBar: true,
@@ -115,6 +116,25 @@ export const DataView: React.FunctionComponent<IDataViewProps> = (props: React.P
       Messenger.unlisten(messageListener);
     }
   }, []);
+
+  // Retrieve the data files, check if they have a schema or ID, if not, they shouldn't be shown
+  const dataFiles = (settings?.dataFiles || []).map((dataFile: DataFile) => {
+    if (!dataFile.schema && !dataFile.id) {
+      return null;
+    }
+
+    const clonedFile = Object.assign({}, dataFile);
+
+    if (clonedFile.type) {
+      const dataType = settings?.dataTypes?.find((dataType: DataType) => dataType.id === clonedFile.type);
+      if (!dataType) {
+        return null;
+      }
+      clonedFile.schema = Object.assign({}, dataType.schema);
+    }
+
+    return clonedFile;
+  }).filter(d => d !== null) as DataFile[];
   
   return (
     <div className="flex flex-col h-full overflow-auto  inset-y-0">
@@ -130,8 +150,8 @@ export const DataView: React.FunctionComponent<IDataViewProps> = (props: React.P
             <nav className={`flex-1 py-4 -mx-4 `}>
               <div className={`divide-y divide-gray-200 dark:divide-vulcan-300 border-t border-b border-gray-200 dark:border-vulcan-300`}>
                 {
-                  (settings?.dataFiles && settings.dataFiles.length > 0) && (
-                    settings.dataFiles.map((dataFile) => (
+                  (dataFiles && dataFiles.length > 0) && (
+                    dataFiles.map((dataFile) => (
                       <button
                         key={dataFile.id}
                         type='button'
diff --git a/src/dashboardWebView/components/DataView/SortableItem.tsx b/src/dashboardWebView/components/DataView/SortableItem.tsx
index 5e51c88a..b68054db 100644
--- a/src/dashboardWebView/components/DataView/SortableItem.tsx
+++ b/src/dashboardWebView/components/DataView/SortableItem.tsx
@@ -1,4 +1,4 @@
-import { PencilIcon, SelectorIcon, XIcon } from '@heroicons/react/outline';
+import { PencilIcon, SelectorIcon, TrashIcon, XIcon } from '@heroicons/react/outline';
 import * as React from 'react';
 import { SortableHandle, SortableElement } from 'react-sortable-hoc';
 import { Alert } from '../Modals/Alert';
@@ -43,7 +43,7 @@ export const SortableItem = SortableElement(({ value, selectedIndex, crntIndex,
             className={`text-gray-500 dark:text-whisper-900 hover:text-gray-600 dark:hover:text-whisper-500`}
             title={`Delete "${value}"`}
             onClick={() => deleteItemConfirm()}>
-            <XIcon className='w-4 h-4' />
+            <TrashIcon className='w-4 h-4' />
             <span className='sr-only'>Delete</span>
           </button>
         </div>
@@ -57,7 +57,10 @@ export const SortableItem = SortableElement(({ value, selectedIndex, crntIndex,
             okBtnText={`Delete`}
             cancelBtnText={`Cancel`}
             dismiss={() => setShowAlert(false)}
-            trigger={() => onDeleteItem(crntIndex)} />
+            trigger={() => {
+              setShowAlert(false);
+              onDeleteItem(crntIndex);
+            }} />
         )
       }
     </>
diff --git a/src/dashboardWebView/models/Settings.ts b/src/dashboardWebView/models/Settings.ts
index c8cfaa04..92c2363a 100644
--- a/src/dashboardWebView/models/Settings.ts
+++ b/src/dashboardWebView/models/Settings.ts
@@ -1,3 +1,4 @@
+import { DataType } from './../../models/DataType';
 import { VersionInfo } from '../../models/VersionInfo';
 import { ContentFolder } from '../../models/ContentFolder';
 import { ContentType, CustomScript, DraftField, Framework, SortingSetting } from '../../models';
@@ -26,6 +27,7 @@ export interface Settings {
   dashboardState: DashboardState;
   scripts: CustomScript[];
   dataFiles: DataFile[] | undefined;
+  dataTypes: DataType[] | undefined;
 }
 
 export interface DashboardState {
diff --git a/src/helpers/DashboardSettings.ts b/src/helpers/DashboardSettings.ts
index 1c2e2080..1d11a876 100644
--- a/src/helpers/DashboardSettings.ts
+++ b/src/helpers/DashboardSettings.ts
@@ -1,9 +1,10 @@
 import { Folders } from "../commands/Folders";
 import { Template } from "../commands/Template";
-import { ExtensionState, SETTINGS_CONTENT_DRAFT_FIELD, SETTINGS_CONTENT_SORTING, SETTINGS_CONTENT_SORTING_DEFAULT, SETTINGS_CONTENT_STATIC_FOLDER, SETTINGS_DASHBOARD_MEDIA_SNIPPET, SETTINGS_DASHBOARD_OPENONSTART, SETTINGS_DATA_FILES, SETTINGS_FRAMEWORK_ID, SETTINGS_MEDIA_SORTING_DEFAULT, SETTING_CUSTOM_SCRIPTS, SETTING_TAXONOMY_CONTENT_TYPES } from "../constants";
+import { ExtensionState, SETTINGS_CONTENT_DRAFT_FIELD, SETTINGS_CONTENT_SORTING, SETTINGS_CONTENT_SORTING_DEFAULT, SETTINGS_CONTENT_STATIC_FOLDER, SETTINGS_DASHBOARD_MEDIA_SNIPPET, SETTINGS_DASHBOARD_OPENONSTART, SETTINGS_DATA_FILES, SETTINGS_DATA_TYPES, SETTINGS_FRAMEWORK_ID, SETTINGS_MEDIA_SORTING_DEFAULT, SETTING_CUSTOM_SCRIPTS, SETTING_TAXONOMY_CONTENT_TYPES } from "../constants";
 import { DashboardViewType, SortingOption, Settings as ISettings } from "../dashboardWebView/models";
 import { CustomScript, DraftField, ScriptType, SortingSetting, TaxonomyType } from "../models";
 import { DataFile } from "../models/DataFile";
+import { DataType } from "../models/DataType";
 import { Extension } from "./Extension";
 import { FrameworkDetector } from "./FrameworkDetector";
 import { Settings } from "./SettingsHelper";
@@ -46,7 +47,8 @@ export class DashboardSettings {
           selectedFolder: await ext.getState<string | undefined>(ExtensionState.SelectedFolder, "workspace")
         }
       },
-      dataFiles: Settings.get<DataFile[]>(SETTINGS_DATA_FILES)
+      dataFiles: Settings.get<DataFile[]>(SETTINGS_DATA_FILES),
+      dataTypes: Settings.get<DataType[]>(SETTINGS_DATA_TYPES)
     } as ISettings
   }
 }
\ No newline at end of file
diff --git a/src/models/DataFile.ts b/src/models/DataFile.ts
index dc073595..016a632f 100644
--- a/src/models/DataFile.ts
+++ b/src/models/DataFile.ts
@@ -3,5 +3,6 @@ export interface DataFile {
   title: string;
   file: string;
   labelField: string;
-  schema: any;
+  schema?: any;
+  type?: string;
 }
\ No newline at end of file
diff --git a/src/models/DataType.ts b/src/models/DataType.ts
new file mode 100644
index 00000000..4469a1f1
--- /dev/null
+++ b/src/models/DataType.ts
@@ -0,0 +1,4 @@
+export interface DataType {
+  id: string;
+  schema: any;
+}
\ No newline at end of file