From 2b8f08c03ce0d7cf56bd6c8a851150f3ff0a0c7a Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Tue, 27 Sep 2022 13:16:44 +0200 Subject: [PATCH] #406 - Single data entries --- CHANGELOG.md | 12 +++ package.json | 10 ++ .../components/DataView/DataView.tsx | 96 +++++++++++-------- src/helpers/DashboardSettings.ts | 3 +- src/listeners/dashboard/DataListener.ts | 2 +- src/models/DataFile.ts | 1 + src/models/DataFolder.ts | 1 + 7 files changed, 84 insertions(+), 41 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 59604a7b..4cd34d34 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,17 @@ # Change Log +## [8.2.0] - 2022-xx-xx + +### ✨ New features + +### 🎨 Enhancements + +- [#406](https://github.com/estruyf/vscode-front-matter/issues/406): Added support for single data entries in the data dashboard + +### ⚡️ Optimizations + +### 🐞 Fixes + ## [8.1.1] - 2022-09-23 ### 🐞 Fixes diff --git a/package.json b/package.json index 9d694875..70f986d1 100644 --- a/package.json +++ b/package.json @@ -550,6 +550,11 @@ "type": "string", "default": "content", "description": "If you are using data types, you can specify your type ID." + }, + "singleEntry": { + "type": "boolean", + "description": "If you want to use a single entry for your data file.", + "default": false } }, "additionalProperties": false, @@ -601,6 +606,11 @@ "type": "string", "default": "content", "description": "If you are using data types, you can specify your type ID." + }, + "singleEntry": { + "type": "boolean", + "description": "If you want to use a single entry for your data files in the folder.", + "default": false } }, "additionalProperties": false, diff --git a/src/dashboardWebView/components/DataView/DataView.tsx b/src/dashboardWebView/components/DataView/DataView.tsx index 0f4d9a41..8f3939df 100644 --- a/src/dashboardWebView/components/DataView/DataView.tsx +++ b/src/dashboardWebView/components/DataView/DataView.tsx @@ -3,7 +3,7 @@ import { Header } from '../Header'; import { useRecoilValue } from 'recoil'; import { SettingsSelector } from '../../state'; import { DataForm } from './DataForm'; -import { useCallback, useEffect, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import { DataFile } from '../../../models/DataFile'; import { Messenger } from '@estruyf/vscode/dist/client'; import { DashboardMessage } from '../../DashboardMessage'; @@ -27,7 +27,7 @@ export interface IDataViewProps {} export const DataView: React.FunctionComponent = (props: React.PropsWithChildren) => { const [ selectedData, setSelectedData ] = useState(null); const [ selectedIndex, setSelectedIndex ] = useState(null); - const [ dataEntries, setDataEntries ] = useState(null); + const [ dataEntries, setDataEntries ] = useState(null); const settings = useRecoilValue(SettingsSelector); const setSchema = (dataFile: DataFile) => { @@ -57,6 +57,12 @@ export const DataView: React.FunctionComponent = (props: React.P const onSubmit = useCallback((data: any) => { + if (selectedData?.singleEntry) { + // Needs to add a single entry + updateData(data); + return; + } + const dataClone: any[] = Object.assign([], dataEntries); if (selectedIndex !== null && selectedIndex !== undefined) { dataClone[selectedIndex] = data; @@ -102,6 +108,14 @@ export const DataView: React.FunctionComponent = (props: React.P }); }, [selectedData]); + const dataEntry = useMemo(() => { + if (selectedData?.singleEntry) { + return dataEntries || {}; + } + + return (dataEntries && selectedIndex !== null && selectedIndex !== undefined) ? dataEntries[selectedIndex] : null; + }, [selectedData, , dataEntries, selectedIndex]); + useEffect(() => { Messenger.listen(messageListener); @@ -171,49 +185,53 @@ export const DataView: React.FunctionComponent = (props: React.P { selectedData ? ( <> -
-

Your {selectedData?.title?.toLowerCase() || ""} data items

+ { + !selectedData.singleEntry && ( +
+

Your {selectedData?.title?.toLowerCase() || ""} data items

-
- { - (dataEntries && dataEntries.length > 0) ? ( - <> - - { - (dataEntries || []).map((dataEntry, idx) => ( - setSelectedIndex(index)} - onDeleteItem={deleteItem} - /> - )) - } - - - - ) : ( -
-

No {selectedData.title.toLowerCase()} data entries found

-
- ) - } -
-
-
+
+ { + (dataEntries && dataEntries.length > 0) ? ( + <> + + { + (dataEntries as any[] || []).map((dataEntry, idx) => ( + setSelectedIndex(index)} + onDeleteItem={deleteItem} + /> + )) + } + + + + ) : ( +
+

No {selectedData.title.toLowerCase()} data entries found

+
+ ) + } +
+
+ ) + } +

Create or modify your {selectedData.title.toLowerCase()} data

{ selectedData ? ( setSelectedIndex(null)} /> ) : ( diff --git a/src/helpers/DashboardSettings.ts b/src/helpers/DashboardSettings.ts index 58357923..c40cc197 100644 --- a/src/helpers/DashboardSettings.ts +++ b/src/helpers/DashboardSettings.ts @@ -113,7 +113,8 @@ export class DashboardSettings { fileType: dataFile.fsPath.endsWith('.json') ? 'json' : 'yaml', labelField: folder.labelField, schema: folder.schema, - type: folder.type + type: folder.type, + singleEntry: typeof folder.singleEntry === 'boolean' ? folder.singleEntry : false, } as DataFile) } } diff --git a/src/listeners/dashboard/DataListener.ts b/src/listeners/dashboard/DataListener.ts index 5155d55b..10530503 100644 --- a/src/listeners/dashboard/DataListener.ts +++ b/src/listeners/dashboard/DataListener.ts @@ -36,7 +36,7 @@ export class DataListener extends BaseListener { * @param msgData */ private static processDataUpdate(msgData: any) { - const { file, fileType, entries } = msgData as { file: string, fileType: string, entries: any[] }; + const { file, fileType, entries } = msgData as { file: string, fileType: string, entries: unknown | unknown[] }; const absPath = Folders.getAbsFilePath(file); if (!existsSync(absPath)) { diff --git a/src/models/DataFile.ts b/src/models/DataFile.ts index 48a375f6..ef449f72 100644 --- a/src/models/DataFile.ts +++ b/src/models/DataFile.ts @@ -6,4 +6,5 @@ export interface DataFile { labelField: string; schema?: any; type?: string; + singleEntry?: boolean; } \ No newline at end of file diff --git a/src/models/DataFolder.ts b/src/models/DataFolder.ts index 20337ed2..3f48a5c3 100644 --- a/src/models/DataFolder.ts +++ b/src/models/DataFolder.ts @@ -6,4 +6,5 @@ export interface DataFolder { labelField: string; schema?: any; type?: string; + singleEntry?: boolean; } \ No newline at end of file