diff --git a/CHANGELOG.md b/CHANGELOG.md index 334479e2..c47d6338 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -33,6 +33,7 @@ - [#703](https://github.com/estruyf/vscode-front-matter/issues/703): Fix retrieval of Astro Collections for `pnpm` projects - [#704](https://github.com/estruyf/vscode-front-matter/issues/704): Fix `zod` schema script for optional fields - [#707](https://github.com/estruyf/vscode-front-matter/issues/707): Fix `clearEmpty` issue with `draft` and `boolean` fields which are by default set to `true` +- [#712](https://github.com/estruyf/vscode-front-matter/issues/712): Keep the search context when deleting media files ## [9.3.1] - 2023-10-27 diff --git a/src/dashboardWebView/hooks/useMedia.tsx b/src/dashboardWebView/hooks/useMedia.tsx index 08737d43..8318cf44 100644 --- a/src/dashboardWebView/hooks/useMedia.tsx +++ b/src/dashboardWebView/hooks/useMedia.tsx @@ -1,6 +1,6 @@ import { Messenger } from '@estruyf/vscode/dist/client'; import { EventData } from '@estruyf/vscode/dist/models'; -import { useState, useEffect, useCallback } from 'react'; +import { useState, useEffect, useCallback, useMemo } from 'react'; import { useRecoilState, useRecoilValue } from 'recoil'; import { MediaInfo, MediaPaths } from '../../models'; import { DashboardCommand } from '../DashboardCommand'; @@ -52,40 +52,51 @@ export default function useMedia() { } }, [search, prevSearch]); - const getMedia = useCallback(() => { + const allMedia = useMemo(() => { + console.log('getMedia', searchedMedia); return searchedMedia.slice(page * pageSetNr, (page + 1) * pageSetNr); }, [searchedMedia, page, pageSetNr]); - const messageListener = ( - message: MessageEvent> - ) => { - if (message.data.command === DashboardCommand.media) { - const payload: MediaPaths = message.data.payload as MediaPaths; - setLoading(false); - setMedia(payload.media); - setTotal(payload.total); - setFolders(payload.folders); - setSelectedFolder(payload.selectedFolder); - setSearchedMedia(payload.media); - setAllContentFolders(payload.allContentFolders); - setAllStaticFolders(payload.allStaticfolders); - } - }; - - useEffect(() => { + const searchMedia = (search: string, media: MediaInfo[]) => { + console.log('searchMedia start', search, media); if (search) { const fuse = new Fuse(media, fuseOptions); const results = fuse.search(search); const newSearchedMedia = results.map((page) => page.item); + console.log('searchMedia end', search, newSearchedMedia); setSearchedMedia(newSearchedMedia); setTotal(results.length); return; } + console.log('searchMedia end skip', search, media); setTotal(media.length); setSearchedMedia(media); + } + + const messageListener = useCallback((message: MessageEvent>) => { + if (message.data.command === DashboardCommand.media) { + console.log('messageListener', search, message.data); + const payload: MediaPaths = message.data.payload as MediaPaths; + setLoading(false); + setMedia(payload.media); + setTotal(payload.total); + setFolders(payload.folders); + setSelectedFolder(payload.selectedFolder); + if (search) { + searchMedia(search, payload.media); + } else { + setSearchedMedia(payload.media); + } + setAllContentFolders(payload.allContentFolders); + setAllStaticFolders(payload.allStaticfolders); + } + }, [search]); + + useEffect(() => { + searchMedia(search, media); }, [search, media]); useEffect(() => { @@ -94,9 +105,9 @@ export default function useMedia() { return () => { Messenger.unlisten(messageListener); }; - }, []); + }, [search]); return { - media: getMedia() + media: allMedia }; }