From 3eb23d7501bc997d8becc23fe6ea76dac75f1292 Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Mon, 22 Jan 2024 11:52:11 +0100 Subject: [PATCH 01/18] Enhancement: configurable dashboard grid #737 --- CHANGELOG.md | 1 + src/dashboardWebView/components/Contents/Contents.tsx | 2 +- src/dashboardWebView/components/Contents/List.tsx | 2 +- src/dashboardWebView/components/Layout/PageLayout.tsx | 2 +- src/dashboardWebView/components/Media/List.tsx | 2 +- src/localization/localization.enum.ts | 2 +- 6 files changed, 6 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 39f0ecbb..1365045e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ ### 🎨 Enhancements - [#727](https://github.com/estruyf/vscode-front-matter/pull/727): Updated Japanese translations thanks to [mayumihara](https://github.com/mayumih387) +- [#737](https://github.com/estruyf/vscode-front-matter/issues/737): Optimize the grid layout of the content and media dashboards ### ⚡️ Optimizations diff --git a/src/dashboardWebView/components/Contents/Contents.tsx b/src/dashboardWebView/components/Contents/Contents.tsx index ce6d7101..3ac3ada3 100644 --- a/src/dashboardWebView/components/Contents/Contents.tsx +++ b/src/dashboardWebView/components/Contents/Contents.tsx @@ -34,7 +34,7 @@ export const Contents: React.FunctionComponent = ({ return ( -
+
{loading ? : }
diff --git a/src/dashboardWebView/components/Contents/List.tsx b/src/dashboardWebView/components/Contents/List.tsx index 31aafc37..d862d5ac 100644 --- a/src/dashboardWebView/components/Contents/List.tsx +++ b/src/dashboardWebView/components/Contents/List.tsx @@ -16,7 +16,7 @@ export const List: React.FunctionComponent = ({ let className = ''; if (view === DashboardViewType.Grid) { - className = `grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4`; + className = `grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 2xl:grid-cols-5 gap-4`; } else if (view === DashboardViewType.List) { className = `-mx-4`; } diff --git a/src/dashboardWebView/components/Layout/PageLayout.tsx b/src/dashboardWebView/components/Layout/PageLayout.tsx index 5c92d5bd..93d24a72 100644 --- a/src/dashboardWebView/components/Layout/PageLayout.tsx +++ b/src/dashboardWebView/components/Layout/PageLayout.tsx @@ -26,7 +26,7 @@ export const PageLayout: React.FunctionComponent = ({
{children} diff --git a/src/dashboardWebView/components/Media/List.tsx b/src/dashboardWebView/components/Media/List.tsx index 2df77458..2b88532b 100644 --- a/src/dashboardWebView/components/Media/List.tsx +++ b/src/dashboardWebView/components/Media/List.tsx @@ -13,7 +13,7 @@ export const List: React.FunctionComponent = ({ return (
    {children}
diff --git a/src/localization/localization.enum.ts b/src/localization/localization.enum.ts index 452cd2eb..54e508de 100644 --- a/src/localization/localization.enum.ts +++ b/src/localization/localization.enum.ts @@ -700,7 +700,7 @@ export enum LocalizationKey { */ dashboardMediaMediaFolderDefault = 'dashboard.media.media.folder.default', /** - * No media files to show. You can drag & drop new files by holding your [shift] key. + * No media files to show. You can drag&drop new files by holding your [shift] key. */ dashboardMediaMediaPlaceholder = 'dashboard.media.media.placeholder', /** From b981ed6c4f157496cf45041bd4dc33aaeeed80e9 Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Tue, 23 Jan 2024 20:10:48 +0100 Subject: [PATCH 02/18] Issue: Open Preview button stops working #738 --- CHANGELOG.md | 1 + src/commands/Preview.ts | 3 +++ 2 files changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1365045e..6c8c0d24 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ - [#721](https://github.com/estruyf/vscode-front-matter/issues/721): Fix keywords regex to support unicode characters - [#725](https://github.com/estruyf/vscode-front-matter/issues/725): Fix for opening menu of pinned items - [#730](https://github.com/estruyf/vscode-front-matter/issues/730): Add debounce to the input fields +- [#738](https://github.com/estruyf/vscode-front-matter/issues/738): Fix when re-opening the preview after closing it ## [9.4.0] - 2023-12-12 - [Release notes](https://beta.frontmatter.codes/updates/v9.4.0) diff --git a/src/commands/Preview.ts b/src/commands/Preview.ts index 0f28e902..835b6030 100644 --- a/src/commands/Preview.ts +++ b/src/commands/Preview.ts @@ -97,6 +97,9 @@ export class Preview { const cspSource = webView.webview.cspSource; webView.onDidDispose(() => { + if (crntFilePath && this.webviews[crntFilePath]) { + delete this.webviews[crntFilePath]; + } webView.dispose(); }); From fbbfaa572e62f04ff9604a1907b90d1329ecc0d4 Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Wed, 24 Jan 2024 15:44:33 +0100 Subject: [PATCH 03/18] #741 - content processing message --- CHANGELOG.md | 1 + l10n/bundle.l10n.json | 2 ++ src/dashboardWebView/DashboardCommand.ts | 1 + src/dashboardWebView/components/App.tsx | 2 +- .../components/Common/Spinner.tsx | 18 ++++++++++++++++-- .../components/Contents/Contents.tsx | 9 ++++----- .../components/Contents/Overview.tsx | 4 +--- .../components/Header/RefreshDashboardData.tsx | 4 ++-- .../components/Media/MediaHeaderTop.tsx | 6 +++--- src/dashboardWebView/hooks/useMedia.tsx | 2 +- src/dashboardWebView/hooks/useMessages.tsx | 4 ++-- src/dashboardWebView/hooks/usePages.tsx | 1 - src/dashboardWebView/state/atom/LoadingAtom.ts | 5 +++-- src/listeners/dashboard/PagesListener.ts | 5 ++++- src/listeners/dashboard/SettingsListener.ts | 4 ++-- src/localization/localization.enum.ts | 4 ++++ src/models/LoadingType.ts | 1 + src/models/index.ts | 1 + 18 files changed, 49 insertions(+), 25 deletions(-) create mode 100644 src/models/LoadingType.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 6c8c0d24..c8ae0e92 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ - [#727](https://github.com/estruyf/vscode-front-matter/pull/727): Updated Japanese translations thanks to [mayumihara](https://github.com/mayumih387) - [#737](https://github.com/estruyf/vscode-front-matter/issues/737): Optimize the grid layout of the content and media dashboards +- [#741](https://github.com/estruyf/vscode-front-matter/issues/741): Added message on the content dashboard when content is processed ### ⚡️ Optimizations diff --git a/l10n/bundle.l10n.json b/l10n/bundle.l10n.json index 8a0bbae0..7daf8e15 100644 --- a/l10n/bundle.l10n.json +++ b/l10n/bundle.l10n.json @@ -36,6 +36,8 @@ "common.openSettings": "Open settings", "common.back": "Back", + "loading.initPages": "Loading content", + "notifications.outputChannel.link": "output window", "notifications.outputChannel.description": "Check the {0} for more details.", diff --git a/src/dashboardWebView/DashboardCommand.ts b/src/dashboardWebView/DashboardCommand.ts index 465d2ebd..52e75c5d 100644 --- a/src/dashboardWebView/DashboardCommand.ts +++ b/src/dashboardWebView/DashboardCommand.ts @@ -1,4 +1,5 @@ export enum DashboardCommand { + initializing = 'initializing', loading = 'loading', pages = 'pages', searchPages = 'searchPages', diff --git a/src/dashboardWebView/components/App.tsx b/src/dashboardWebView/components/App.tsx index 213c9e61..9548681a 100644 --- a/src/dashboardWebView/components/App.tsx +++ b/src/dashboardWebView/components/App.tsx @@ -123,7 +123,7 @@ Stack: ${componentStack}` } /> } + element={} /> } /> } /> diff --git a/src/dashboardWebView/components/Common/Spinner.tsx b/src/dashboardWebView/components/Common/Spinner.tsx index 0b87e2a0..6659732b 100644 --- a/src/dashboardWebView/components/Common/Spinner.tsx +++ b/src/dashboardWebView/components/Common/Spinner.tsx @@ -1,9 +1,14 @@ import * as React from 'react'; +import { LoadingType } from '../../../models'; +import * as l10n from '@vscode/l10n'; +import { LocalizationKey } from '../../../localization'; -export interface ISpinnerProps { } +export interface ISpinnerProps { + type?: LoadingType; +} export const Spinner: React.FunctionComponent = ( - _: React.PropsWithChildren + { type }: React.PropsWithChildren ) => { return (
@@ -12,6 +17,15 @@ export const Spinner: React.FunctionComponent = ( >
+ + { + type === 'initPages' && ( +
+ {l10n.t(LocalizationKey.loadingInitPages)} + +
+ ) + }
); }; \ No newline at end of file diff --git a/src/dashboardWebView/components/Contents/Contents.tsx b/src/dashboardWebView/components/Contents/Contents.tsx index 3ac3ada3..0db5a4df 100644 --- a/src/dashboardWebView/components/Contents/Contents.tsx +++ b/src/dashboardWebView/components/Contents/Contents.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { useRecoilValue } from 'recoil'; import { Page } from '../../models'; -import { SettingsSelector } from '../../state'; +import { LoadingAtom, SettingsSelector } from '../../state'; import { Overview } from './Overview'; import { Spinner } from '../Common/Spinner'; import { SponsorMsg } from '../Layout/SponsorMsg'; @@ -14,13 +14,12 @@ import { PageLayout } from '../Layout/PageLayout'; export interface IContentsProps { pages: Page[]; - loading: boolean; } export const Contents: React.FunctionComponent = ({ - pages, - loading + pages }: React.PropsWithChildren) => { + const loading = useRecoilValue(LoadingAtom); const settings = useRecoilValue(SettingsSelector); const { pageItems } = usePages(pages); @@ -35,7 +34,7 @@ export const Contents: React.FunctionComponent = ({ return (
- {loading ? : } + {loading ? : }
{ - setLoading(true); + setLoading("initPages"); resetSearch(); resetSorting(); resetFolder(); @@ -47,7 +47,7 @@ export const RefreshDashboardData: React.FunctionComponent { - setLoading(true); + setLoading("initPages"); resetPage(); resetSearch(); Messenger.send(DashboardMessage.refreshMedia, { folder: selectedFolder }); diff --git a/src/dashboardWebView/components/Media/MediaHeaderTop.tsx b/src/dashboardWebView/components/Media/MediaHeaderTop.tsx index 944438c9..47a99767 100644 --- a/src/dashboardWebView/components/Media/MediaHeaderTop.tsx +++ b/src/dashboardWebView/components/Media/MediaHeaderTop.tsx @@ -37,7 +37,7 @@ export const MediaHeaderTop: React.FunctionComponent< const mediaUpdate = (message: MessageEvent>) => { if (message.data.command === DashboardCommand.mediaUpdate) { - setLoading(true); + setLoading("loading"); Messenger.send(DashboardMessage.getMedia, { page, folder: selectedFolder || '', @@ -51,7 +51,7 @@ export const MediaHeaderTop: React.FunctionComponent< prevSelectedFolder !== null || settings?.dashboardState?.media.selectedFolder !== selectedFolder ) { - setLoading(true); + setLoading("loading"); setPage(0); setLastUpdated(new Date().getTime().toString()); } @@ -63,7 +63,7 @@ export const MediaHeaderTop: React.FunctionComponent< React.useEffect(() => { if (debounceGetMedia) { - setLoading(true); + setLoading("loading"); Messenger.send(DashboardMessage.getMedia, { page, diff --git a/src/dashboardWebView/hooks/useMedia.tsx b/src/dashboardWebView/hooks/useMedia.tsx index fc711ad2..0ea22ae8 100644 --- a/src/dashboardWebView/hooks/useMedia.tsx +++ b/src/dashboardWebView/hooks/useMedia.tsx @@ -75,7 +75,7 @@ export default function useMedia() { const messageListener = useCallback((message: MessageEvent>) => { if (message.data.command === DashboardCommand.media) { const payload: MediaPaths = message.data.payload as MediaPaths; - setLoading(false); + setLoading("loading"); setMedia(payload.media); setTotal(payload.total); setFolders(payload.folders); diff --git a/src/dashboardWebView/hooks/useMessages.tsx b/src/dashboardWebView/hooks/useMessages.tsx index b85072ab..f9f41d7a 100644 --- a/src/dashboardWebView/hooks/useMessages.tsx +++ b/src/dashboardWebView/hooks/useMessages.tsx @@ -53,7 +53,7 @@ export default function useMessages() { break; case DashboardCommand.pages: setPages(message.payload); - setLoading(false); + setLoading(undefined); break; case DashboardCommand.searchReady: setSearchReady(true); @@ -73,7 +73,7 @@ export default function useMessages() { useEffect(() => { Messenger.listen(messageListener); - setLoading(true); + setLoading("loading"); Messenger.send(DashboardMessage.getViewType); Messenger.send(DashboardMessage.getTheme); Messenger.send(DashboardMessage.getData); diff --git a/src/dashboardWebView/hooks/usePages.tsx b/src/dashboardWebView/hooks/usePages.tsx index e3629e15..cb8a468e 100644 --- a/src/dashboardWebView/hooks/usePages.tsx +++ b/src/dashboardWebView/hooks/usePages.tsx @@ -1,5 +1,4 @@ import { useState, useEffect, useCallback } from 'react'; -import { SortOption } from '../constants/SortOption'; import { Tab } from '../constants/Tab'; import { Page } from '../models/Page'; import { useRecoilState, useRecoilValue } from 'recoil'; diff --git a/src/dashboardWebView/state/atom/LoadingAtom.ts b/src/dashboardWebView/state/atom/LoadingAtom.ts index 73a84324..ac3e3535 100644 --- a/src/dashboardWebView/state/atom/LoadingAtom.ts +++ b/src/dashboardWebView/state/atom/LoadingAtom.ts @@ -1,6 +1,7 @@ import { atom } from 'recoil'; +import { LoadingType } from '../../../models'; -export const LoadingAtom = atom({ +export const LoadingAtom = atom({ key: 'LoadingAtom', - default: false + default: undefined }); diff --git a/src/listeners/dashboard/PagesListener.ts b/src/listeners/dashboard/PagesListener.ts index f4b111b7..8133f093 100644 --- a/src/listeners/dashboard/PagesListener.ts +++ b/src/listeners/dashboard/PagesListener.ts @@ -18,6 +18,7 @@ import { DataListener } from '../panel'; import Fuse from 'fuse.js'; import { PagesParser } from '../../services/PagesParser'; import { unlinkAsync, rmdirAsync } from '../../utils'; +import { LoadingType } from '../../models'; export class PagesListener extends BaseListener { private static watchers: { [path: string]: FileSystemWatcher } = {}; @@ -211,6 +212,8 @@ export class PagesListener extends BaseListener { if (cb) { cb(cachedPages); } + } else { + this.sendMsg(DashboardCommand.loading, 'initPages' as LoadingType); } } else { PagesParser.reset(); @@ -223,7 +226,7 @@ export class PagesListener extends BaseListener { this.sendMsg(DashboardCommand.searchReady, true); await this.createSearchIndex(pages); - this.sendMsg(DashboardCommand.loading, false); + this.sendMsg(DashboardCommand.loading, undefined as LoadingType); if (cb) { cb(pages); diff --git a/src/listeners/dashboard/SettingsListener.ts b/src/listeners/dashboard/SettingsListener.ts index bcbad6bc..74492212 100644 --- a/src/listeners/dashboard/SettingsListener.ts +++ b/src/listeners/dashboard/SettingsListener.ts @@ -12,7 +12,7 @@ import { DashboardCommand } from '../../dashboardWebView/DashboardCommand'; import { DashboardMessage } from '../../dashboardWebView/DashboardMessage'; import { DashboardSettings, Extension, Notifications, Settings } from '../../helpers'; import { FrameworkDetector } from '../../helpers/FrameworkDetector'; -import { Framework, Template, PostMessageData, StaticFolder } from '../../models'; +import { Framework, Template, PostMessageData, StaticFolder, LoadingType } from '../../models'; import { BaseListener } from './BaseListener'; import { Cache } from '../../commands/Cache'; import { Preview } from '../../commands'; @@ -98,7 +98,7 @@ export class SettingsListener extends BaseListener { public static async switchProject(project: string) { if (project) { - this.sendMsg(DashboardCommand.loading, true); + this.sendMsg(DashboardCommand.loading, 'loading' as LoadingType); Settings.setProject(project); await Cache.clear(false); diff --git a/src/localization/localization.enum.ts b/src/localization/localization.enum.ts index 54e508de..e5440e98 100644 --- a/src/localization/localization.enum.ts +++ b/src/localization/localization.enum.ts @@ -143,6 +143,10 @@ export enum LocalizationKey { * Back */ commonBack = 'common.back', + /** + * Loading content + */ + loadingInitPages = 'loading.initPages', /** * output window */ diff --git a/src/models/LoadingType.ts b/src/models/LoadingType.ts new file mode 100644 index 00000000..1ad170f1 --- /dev/null +++ b/src/models/LoadingType.ts @@ -0,0 +1 @@ +export type LoadingType = 'initPages' | 'loading' | undefined; diff --git a/src/models/index.ts b/src/models/index.ts index 68886aa7..1f4ef199 100644 --- a/src/models/index.ts +++ b/src/models/index.ts @@ -13,6 +13,7 @@ export * from './DataType'; export * from './DraftField'; export * from './Framework'; export * from './GitSettings'; +export * from './LoadingType'; export * from './MediaPaths'; export * from './Mode'; export * from './PanelSettings'; From 7240747e867ccd27949d72dcd26118a35025bb84 Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Fri, 26 Jan 2024 10:23:37 +0100 Subject: [PATCH 04/18] Add backer link --- .../components/Header/Header.tsx | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/src/dashboardWebView/components/Header/Header.tsx b/src/dashboardWebView/components/Header/Header.tsx index bd606d42..20b3090c 100644 --- a/src/dashboardWebView/components/Header/Header.tsx +++ b/src/dashboardWebView/components/Header/Header.tsx @@ -17,6 +17,7 @@ import { MediaHeaderBottom } from '../Media/MediaHeaderBottom'; import { Tabs } from './Tabs'; import { CustomScript } from '../../../models'; import { ArrowTopRightOnSquareIcon, BoltIcon, PlusIcon } from '@heroicons/react/24/outline'; +import { HeartIcon } from '@heroicons/react/24/solid'; import { useLocation, useNavigate } from 'react-router-dom'; import { routePaths } from '../..'; import { useEffect, useMemo } from 'react'; @@ -31,6 +32,7 @@ import * as l10n from '@vscode/l10n'; import { LocalizationKey } from '../../../localization'; import { SettingsLink } from '../SettingsView/SettingsLink'; import { Link } from '../Common/Link'; +import { SPONSOR_LINK } from '../../../constants'; export interface IHeaderProps { header?: React.ReactNode; @@ -147,13 +149,13 @@ export const Header: React.FunctionComponent = ({
-
+
{ settings?.websiteUrl && ( {settings?.websiteUrl} @@ -163,6 +165,19 @@ export const Header: React.FunctionComponent = ({ ) } + { + !settings?.isBacker && ( + + {l10n.t(LocalizationKey.commonSupport)} +
From 5f92ad33ffdfceedef80fa9e19ad74e3aab5e93f Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Fri, 26 Jan 2024 16:42:57 +0100 Subject: [PATCH 05/18] #743 - Fix for storing yaml --- CHANGELOG.md | 1 + package-lock.json | 48 ++++--------------- package.json | 3 +- src/dashboardWebView/DashboardMessage.ts | 1 + .../components/DataView/DataView.tsx | 17 +------ .../components/DataView/SortableItem.tsx | 14 ++---- src/helpers/FrameworkDetector.ts | 4 +- src/listeners/dashboard/DashboardListener.ts | 5 ++ src/listeners/dashboard/DataListener.ts | 10 ++-- 9 files changed, 31 insertions(+), 72 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c8ae0e92..93d35a23 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,6 +20,7 @@ - [#725](https://github.com/estruyf/vscode-front-matter/issues/725): Fix for opening menu of pinned items - [#730](https://github.com/estruyf/vscode-front-matter/issues/730): Add debounce to the input fields - [#738](https://github.com/estruyf/vscode-front-matter/issues/738): Fix when re-opening the preview after closing it +- [#743](https://github.com/estruyf/vscode-front-matter/issues/743): Fix for storing data in YAML data files ## [9.4.0] - 2023-12-12 - [Release notes](https://beta.frontmatter.codes/updates/v9.4.0) diff --git a/package-lock.json b/package-lock.json index 49705814..edf1191f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,7 +23,7 @@ "@types/chai": "^4.3.4", "@types/glob": "7.1.3", "@types/invariant": "^2.2.35", - "@types/js-yaml": "3.12.1", + "@types/js-yaml": "^4.0.9", "@types/lodash.omit": "^4.5.7", "@types/lodash.uniqby": "4.7.6", "@types/lodash.xor": "^4.5.7", @@ -90,7 +90,6 @@ "react-quill": "^2.0.0", "react-router-dom": "^6.8.0", "react-sortable-hoc": "^2.0.0", - "react-toastify": "^8.2.0", "recoil": "^0.4.1", "remark-gfm": "^3.0.1", "rimraf": "^3.0.2", @@ -1042,9 +1041,10 @@ "license": "MIT" }, "node_modules/@types/js-yaml": { - "version": "3.12.1", - "dev": true, - "license": "MIT" + "version": "4.0.9", + "resolved": "https://registry.npmjs.org/@types/js-yaml/-/js-yaml-4.0.9.tgz", + "integrity": "sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==", + "dev": true }, "node_modules/@types/json-schema": { "version": "7.0.9", @@ -3111,14 +3111,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/clsx": { - "version": "1.1.1", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6" - } - }, "node_modules/color-convert": { "version": "1.9.3", "dev": true, @@ -10225,19 +10217,6 @@ "react-dom": "^16.3.0 || ^17.0.0" } }, - "node_modules/react-toastify": { - "version": "8.2.0", - "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.2.0.tgz", - "integrity": "sha512-Pg2Ju7NngAamarFvLwqrFomJ57u/Ay6i6zfLurt/qPynWkAkOthu6vxfqYpJCyNhHRhR4hu7+bySSeWWJu6PAg==", - "dev": true, - "dependencies": { - "clsx": "^1.1.1" - }, - "peerDependencies": { - "react": ">=16", - "react-dom": ">=16" - } - }, "node_modules/read": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz", @@ -13999,7 +13978,9 @@ "dev": true }, "@types/js-yaml": { - "version": "3.12.1", + "version": "4.0.9", + "resolved": "https://registry.npmjs.org/@types/js-yaml/-/js-yaml-4.0.9.tgz", + "integrity": "sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==", "dev": true }, "@types/json-schema": { @@ -15522,10 +15503,6 @@ "mimic-response": "^1.0.0" } }, - "clsx": { - "version": "1.1.1", - "dev": true - }, "color-convert": { "version": "1.9.3", "dev": true, @@ -20287,15 +20264,6 @@ "prop-types": "^15.5.7" } }, - "react-toastify": { - "version": "8.2.0", - "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.2.0.tgz", - "integrity": "sha512-Pg2Ju7NngAamarFvLwqrFomJ57u/Ay6i6zfLurt/qPynWkAkOthu6vxfqYpJCyNhHRhR4hu7+bySSeWWJu6PAg==", - "dev": true, - "requires": { - "clsx": "^1.1.1" - } - }, "read": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz", diff --git a/package.json b/package.json index 8957161e..47c622f1 100644 --- a/package.json +++ b/package.json @@ -2566,7 +2566,7 @@ "@types/chai": "^4.3.4", "@types/glob": "7.1.3", "@types/invariant": "^2.2.35", - "@types/js-yaml": "3.12.1", + "@types/js-yaml": "^4.0.9", "@types/lodash.omit": "^4.5.7", "@types/lodash.uniqby": "4.7.6", "@types/lodash.xor": "^4.5.7", @@ -2633,7 +2633,6 @@ "react-quill": "^2.0.0", "react-router-dom": "^6.8.0", "react-sortable-hoc": "^2.0.0", - "react-toastify": "^8.2.0", "recoil": "^0.4.1", "remark-gfm": "^3.0.1", "rimraf": "^3.0.2", diff --git a/src/dashboardWebView/DashboardMessage.ts b/src/dashboardWebView/DashboardMessage.ts index ab53e96d..9aa31534 100644 --- a/src/dashboardWebView/DashboardMessage.ts +++ b/src/dashboardWebView/DashboardMessage.ts @@ -74,6 +74,7 @@ export enum DashboardMessage { runCustomScript = 'runCustomScript', sendTelemetry = 'sendTelemetry', logError = 'logError', + showNotification = 'showNotification', // Settings getSettings = 'getSettings', diff --git a/src/dashboardWebView/components/DataView/DataView.tsx b/src/dashboardWebView/components/DataView/DataView.tsx index f74f21cb..686352dd 100644 --- a/src/dashboardWebView/components/DataView/DataView.tsx +++ b/src/dashboardWebView/components/DataView/DataView.tsx @@ -16,20 +16,17 @@ import { EmptyView } from './EmptyView'; import { Container } from './SortableContainer'; import { SortableItem } from './SortableItem'; import { ChevronRightIcon, CircleStackIcon } from '@heroicons/react/24/outline'; -import { ToastContainer, toast, Slide } from 'react-toastify'; -import 'react-toastify/dist/ReactToastify.css'; import { DataType } from '../../../models/DataType'; import { TelemetryEvent } from '../../../constants'; import { NavigationItem } from '../Layout'; import useThemeColors from '../../hooks/useThemeColors'; import * as l10n from '@vscode/l10n'; import { LocalizationKey } from '../../../localization'; -import { NavigationType } from '../../models'; export interface IDataViewProps { } export const DataView: React.FunctionComponent = ( - props: React.PropsWithChildren + _: React.PropsWithChildren ) => { const [selectedData, setSelectedData] = useState(null); const [selectedIndex, setSelectedIndex] = useState(null); @@ -112,15 +109,7 @@ export const DataView: React.FunctionComponent = ( entries: data }); - // Show toast message - toast.success('Updated your data entries', { - position: 'top-right', - autoClose: 2000, - hideProgressBar: true, - closeOnClick: true, - pauseOnHover: false, - transition: Slide - }); + Messenger.send(DashboardMessage.showNotification, 'Updated your data entries'); }, [selectedData] ); @@ -319,8 +308,6 @@ export const DataView: React.FunctionComponent = ( isBacker={settings?.isBacker} /> - - DataView metrics
); diff --git a/src/dashboardWebView/components/DataView/SortableItem.tsx b/src/dashboardWebView/components/DataView/SortableItem.tsx index 291a6b74..c1533bb2 100644 --- a/src/dashboardWebView/components/DataView/SortableItem.tsx +++ b/src/dashboardWebView/components/DataView/SortableItem.tsx @@ -1,7 +1,6 @@ -import { PencilIcon, ChevronDownIcon, TrashIcon } from '@heroicons/react/24/outline'; +import { PencilIcon, TrashIcon, ChevronUpDownIcon } from '@heroicons/react/24/outline'; import * as React from 'react'; import { SortableHandle, SortableElement } from 'react-sortable-hoc'; -import useThemeColors from '../../hooks/useThemeColors'; import { LinkButton } from '../Common/LinkButton'; import { Alert } from '../Modals/Alert'; import * as l10n from '@vscode/l10n'; @@ -16,7 +15,7 @@ export interface ISortableItemProps { onDeleteItem: (index: number) => void; } -const DragHandle = SortableHandle(() => ); +const DragHandle = SortableHandle(() => ); export const SortableItem = SortableElement( ({ @@ -27,7 +26,6 @@ export const SortableItem = SortableElement( onDeleteItem }: ISortableItemProps) => { const [showAlert, setShowAlert] = React.useState(false); - const { getColors } = useThemeColors(); const deleteItemConfirm = () => { setShowAlert(true); @@ -37,12 +35,8 @@ export const SortableItem = SortableElement( <>
  • Date: Fri, 26 Jan 2024 16:52:28 +0100 Subject: [PATCH 06/18] Style updates in data view --- .../uniforms-frontmatter/ListDelField.tsx | 2 +- .../uniforms-frontmatter/LongTextField.tsx | 1 + .../uniforms-frontmatter/TextField.tsx | 1 + src/dashboardWebView/styles.css | 19 ++----------------- 4 files changed, 5 insertions(+), 18 deletions(-) diff --git a/src/components/uniforms-frontmatter/ListDelField.tsx b/src/components/uniforms-frontmatter/ListDelField.tsx index e5972c4f..5afca01e 100644 --- a/src/components/uniforms-frontmatter/ListDelField.tsx +++ b/src/components/uniforms-frontmatter/ListDelField.tsx @@ -29,7 +29,7 @@ function ListDel({ disabled, name, readOnly, ...props }: ListDelFieldProps) { return (