diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx index 7a20b2540..06de7ee26 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx @@ -3,6 +3,7 @@ import { StyleSchema, } from '@blocknote/core'; import { useBlockNoteEditor } from '@blocknote/react'; +import { useTreeContext } from '@gouvfr-lasuite/ui-kit'; import type { KeyboardEvent } from 'react'; import { useEffect, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; @@ -26,12 +27,13 @@ import { import FoundPageIcon from '@/docs/doc-editor/assets/doc-found.svg'; import AddPageIcon from '@/docs/doc-editor/assets/doc-plus.svg'; import { + Doc, getEmojiAndTitle, useCreateChildDocTree, useDocStore, useTrans, } from '@/docs/doc-management'; -import { DocSearchSubPageContent, DocSearchTarget } from '@/docs/doc-search'; +import { DocSearchContent, DocSearchTarget } from '@/docs/doc-search'; import { useResponsiveStore } from '@/stores'; const inputStyle = css` @@ -87,7 +89,7 @@ export const SearchPage = ({ const { isDesktop } = useResponsiveStore(); const { untitledDocument } = useTrans(); const isEditable = editor.isEditable; - + const treeContext = useTreeContext(); /** * createReactInlineContentSpec add automatically the focus after * the inline content, so we need to set the focus on the input @@ -226,9 +228,11 @@ export const SearchPage = ({ `} $margin={{ top: '0.5rem' }} > - { if (!isEditable) { return; @@ -256,7 +260,7 @@ export const SearchPage = ({ editor.focus(); }} - renderElement={(doc) => { + renderSearchElement={(doc) => { const { emoji, titleWithoutEmoji } = getEmojiAndTitle( doc.title || untitledDocument, ); diff --git a/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchContent.tsx b/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchContent.tsx index e6b098007..6ab9ac752 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchContent.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchContent.tsx @@ -1,10 +1,11 @@ import { t } from 'i18next'; -import { useEffect, useMemo, useState } from 'react'; +import { useEffect, useState } from 'react'; import { InView } from 'react-intersection-observer'; import { Box } from '@/components/'; import { QuickSearchData, QuickSearchGroup } from '@/components/quick-search'; import { useInfiniteSearchDocs } from '@/docs/doc-management/api/useSearchDocs'; +import { DocSearchTarget } from '@/docs/doc-search'; import { Doc } from '../../doc-management'; @@ -17,6 +18,8 @@ type DocSearchContentProps = { isSearchNotMandatory?: boolean; onSelect: (doc: Doc) => void; onLoadingChange?: (loading: boolean) => void; + target?: DocSearchTarget; + parentPath?: string; renderSearchElement?: (doc: Doc) => React.ReactNode; }; @@ -27,6 +30,8 @@ export const DocSearchContent = ({ onSelect, onLoadingChange, renderSearchElement, + target, + parentPath, isSearchNotMandatory, }: DocSearchContentProps) => { const { @@ -36,10 +41,17 @@ export const DocSearchContent = ({ isLoading, fetchNextPage, hasNextPage, - } = useInfiniteSearchDocs({ - page: 1, - q: search, - }); + } = useInfiniteSearchDocs( + { + q: search, + page: 1, + target, + parentPath, + }, + { + enabled: target !== DocSearchTarget.CURRENT || !!parentPath, + }, + ); const loading = isFetching || isRefetching || isLoading; const [docsData, setDocsData] = useState>({ @@ -85,6 +97,8 @@ export const DocSearchContent = ({ groupName, isSearchNotMandatory, loading, + hasNextPage, + fetchNextPage, ]); useEffect(() => { diff --git a/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx b/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx index bb14f1c1a..f4cf0b1d4 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx @@ -1,4 +1,5 @@ import { Modal, ModalSize } from '@gouvfr-lasuite/cunningham-react'; +import { TreeContextType, useTreeContext } from '@gouvfr-lasuite/ui-kit'; import Image from 'next/image'; import { useRouter } from 'next/router'; import { useState } from 'react'; @@ -8,45 +9,39 @@ import { useDebouncedCallback } from 'use-debounce'; import { Box, ButtonCloseModal, Text } from '@/components'; import { QuickSearch } from '@/components/quick-search'; import { Doc, useDocUtils } from '@/docs/doc-management'; +import { + DocSearchFilters, + DocSearchFiltersValues, + DocSearchTarget, +} from '@/docs/doc-search'; import { useResponsiveStore } from '@/stores'; import EmptySearchIcon from '../assets/illustration-docs-empty.png'; import { DocSearchContent } from './DocSearchContent'; -import { - DocSearchFilters, - DocSearchFiltersValues, - DocSearchTarget, -} from './DocSearchFilters'; -import { DocSearchItem } from './DocSearchItem'; -import { DocSearchSubPageContent } from './DocSearchSubPageContent'; type DocSearchModalGlobalProps = { onClose: () => void; isOpen: boolean; showFilters?: boolean; defaultFilters?: DocSearchFiltersValues; + treeContext?: TreeContextType | null; }; const DocSearchModalGlobal = ({ showFilters = false, defaultFilters, + treeContext, ...modalProps }: DocSearchModalGlobalProps) => { const { t } = useTranslation(); const [loading, setLoading] = useState(false); - const router = useRouter(); - const isDocPage = router.pathname === '/docs/[id]'; - const [search, setSearch] = useState(''); const [filters, setFilters] = useState( defaultFilters ?? {}, ); - - const target = filters.target ?? DocSearchTarget.ALL; const { isDesktop } = useResponsiveStore(); - const handleInputSearch = useDebouncedCallback(setSearch, 300); const handleSelect = (doc: Doc) => { @@ -121,24 +116,22 @@ const DocSearchModalGlobal = ({ )} {search && ( - <> - {target === DocSearchTarget.ALL && ( - - )} - {isDocPage && target === DocSearchTarget.CURRENT && ( - } - /> - )} - + )} @@ -157,6 +150,7 @@ const DocSearchModalDetail = ({ }: DocSearchModalDetailProps) => { const { hasChildren, isChild } = useDocUtils(doc); const isWithChildren = isChild || hasChildren; + const treeContext = useTreeContext(); let defaultFilters = DocSearchTarget.ALL; let showFilters = false; @@ -170,6 +164,7 @@ const DocSearchModalDetail = ({ {...modalProps} showFilters={showFilters} defaultFilters={{ target: defaultFilters }} + treeContext={treeContext} /> ); }; diff --git a/src/frontend/apps/impress/src/features/docs/doc-search/components/index.ts b/src/frontend/apps/impress/src/features/docs/doc-search/components/index.ts index 2952e6ad9..4d3ff2b0d 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-search/components/index.ts +++ b/src/frontend/apps/impress/src/features/docs/doc-search/components/index.ts @@ -1,4 +1,3 @@ export * from './DocSearchContent'; export * from './DocSearchModal'; export * from './DocSearchFilters'; -export * from './DocSearchSubPageContent';