diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/constants.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/constants.js index f601df39d61397..1edd5915eaf87d 100644 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/constants.js +++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/constants.js @@ -51,16 +51,6 @@ export const TEMPLATES_POSTS_PREFIXES = [ export const TEMPLATES_PAGES_PREFIXES = [ 'page-' ]; -export const TEMPLATES_NEW_OPTIONS = [ - 'front-page', - 'single-post', - 'page', - 'archive', - 'search', - '404', - 'index', -]; - export const TEMPLATE_OVERRIDES = { singular: [ 'single', 'page' ], index: [ 'archive', '404', 'search', 'singular', 'home' ], @@ -68,9 +58,6 @@ export const TEMPLATE_OVERRIDES = { }; export const MENU_ROOT = 'root'; -export const MENU_CONTENT_CATEGORIES = 'content-categories'; -export const MENU_CONTENT_PAGES = 'content-pages'; -export const MENU_CONTENT_POSTS = 'content-posts'; export const MENU_TEMPLATE_PARTS = 'template-parts'; export const MENU_TEMPLATES = 'templates'; export const MENU_TEMPLATES_GENERAL = 'templates-general'; @@ -78,8 +65,6 @@ export const MENU_TEMPLATES_PAGES = 'templates-pages'; export const MENU_TEMPLATES_POSTS = 'templates-posts'; export const MENU_TEMPLATES_UNUSED = 'templates-unused'; -export const SEARCH_DEBOUNCE_IN_MS = 75; - export const MENU_TEMPLATE_PARTS_HEADERS = 'template-parts-headers'; export const MENU_TEMPLATE_PARTS_FOOTERS = 'template-parts-footers'; export const MENU_TEMPLATE_PARTS_SIDEBARS = 'template-parts-sidebars'; diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation-item.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation-item.js deleted file mode 100644 index 43f460f26e367e..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/content-navigation-item.js +++ /dev/null @@ -1,89 +0,0 @@ -/** - * WordPress dependencies - */ -import { __experimentalNavigationItem as NavigationItem } from '@wordpress/components'; -import { useDispatch, useSelect } from '@wordpress/data'; -import { useCallback, useState } from '@wordpress/element'; -import { __ } from '@wordpress/i18n'; -import { getPathAndQueryString } from '@wordpress/url'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { NavigationPanelPreviewFill } from '..'; -import TemplatePreview from './template-preview'; -import { store as editSiteStore } from '../../../store'; - -const getTitle = ( entity ) => { - const title = entity.taxonomy ? entity.name : entity?.title?.rendered; - - // Make sure encoded characters are displayed as the characters they represent. - const titleElement = document.createElement( 'div' ); - titleElement.innerHTML = title; - - return titleElement.textContent || titleElement.innerText || ''; -}; - -export default function ContentNavigationItem( { item } ) { - const [ isPreviewVisible, setIsPreviewVisible ] = useState( false ); - const previewContent = useSelect( - ( select ) => { - if ( ! isPreviewVisible ) { - return null; - } - - const template = select( - coreStore - ).__experimentalGetTemplateForLink( item.link ); - return template?.content; - }, - [ isPreviewVisible ] - ); - const { setPage, setIsNavigationPanelOpened } = useDispatch( - editSiteStore - ); - - const onActivateItem = useCallback( () => { - const { type, slug, link, id } = item; - setPage( { - type, - slug, - path: getPathAndQueryString( link ), - context: { - postType: type, - postId: id, - }, - } ); - setIsNavigationPanelOpened( false ); - }, [ setPage, item ] ); - - if ( ! item ) { - return null; - } - - return ( - <> - setIsPreviewVisible( true ) } - onMouseLeave={ () => setIsPreviewVisible( false ) } - /> - - { isPreviewVisible && previewContent && ( - - - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-categories.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-categories.js deleted file mode 100644 index 8d99cf475012c6..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-categories.js +++ /dev/null @@ -1,85 +0,0 @@ -/** - * WordPress dependencies - */ -import { - __experimentalNavigationMenu as NavigationMenu, - __experimentalNavigationItem as NavigationItem, -} from '@wordpress/components'; -import { __ } from '@wordpress/i18n'; -import { useSelect } from '@wordpress/data'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { MENU_CONTENT_CATEGORIES, MENU_ROOT } from '../constants'; -import ContentNavigationItem from '../content-navigation-item'; -import SearchResults from '../search-results'; -import useDebouncedSearch from '../use-debounced-search'; - -export default function ContentCategoriesMenu() { - const { - search, - searchQuery, - onSearch, - isDebouncing, - } = useDebouncedSearch(); - - const { categories, isResolved } = useSelect( - ( select ) => { - const { getEntityRecords, hasFinishedResolution } = select( - coreStore - ); - const query = searchQuery - ? { - search: searchQuery, - } - : undefined; - const getEntityRecordsArgs = [ 'taxonomy', 'category', query ]; - const hasResolvedPosts = hasFinishedResolution( - 'getEntityRecords', - getEntityRecordsArgs - ); - return { - categories: getEntityRecords( ...getEntityRecordsArgs ), - isResolved: hasResolvedPosts, - }; - }, - [ searchQuery ] - ); - - const shouldShowLoadingForDebouncing = search && isDebouncing; - const showLoading = ! isResolved || shouldShowLoadingForDebouncing; - - return ( - - { search && ! isDebouncing && ( - - ) } - - { ! search && - categories?.map( ( category ) => ( - - ) ) } - - { showLoading && ( - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-pages.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-pages.js deleted file mode 100644 index bb927f44507f13..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-pages.js +++ /dev/null @@ -1,85 +0,0 @@ -/** - * WordPress dependencies - */ -import { - __experimentalNavigationMenu as NavigationMenu, - __experimentalNavigationItem as NavigationItem, -} from '@wordpress/components'; -import { __ } from '@wordpress/i18n'; -import { useSelect } from '@wordpress/data'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { MENU_CONTENT_PAGES, MENU_ROOT } from '../constants'; -import ContentNavigationItem from '../content-navigation-item'; -import SearchResults from '../search-results'; -import useDebouncedSearch from '../use-debounced-search'; - -export default function ContentPagesMenu() { - const { - search, - searchQuery, - onSearch, - isDebouncing, - } = useDebouncedSearch(); - - const { pages, isResolved } = useSelect( - ( select ) => { - const { getEntityRecords, hasFinishedResolution } = select( - coreStore - ); - const query = searchQuery - ? { - search: searchQuery, - } - : undefined; - const getEntityRecordsArgs = [ 'postType', 'page', query ]; - const hasResolvedPosts = hasFinishedResolution( - 'getEntityRecords', - getEntityRecordsArgs - ); - return { - pages: getEntityRecords( ...getEntityRecordsArgs ), - isResolved: hasResolvedPosts, - }; - }, - [ searchQuery ] - ); - - const shouldShowLoadingForDebouncing = search && isDebouncing; - const showLoading = ! isResolved || shouldShowLoadingForDebouncing; - - return ( - - { search && ! isDebouncing && ( - - ) } - - { ! search && - pages?.map( ( page ) => ( - - ) ) } - - { showLoading && ( - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js deleted file mode 100644 index c1593627ffebec..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/content-posts.js +++ /dev/null @@ -1,117 +0,0 @@ -/** - * WordPress dependencies - */ -import { - __experimentalNavigationMenu as NavigationMenu, - __experimentalNavigationItem as NavigationItem, -} from '@wordpress/components'; -import { __ } from '@wordpress/i18n'; -import { useCallback } from '@wordpress/element'; -import { useDispatch, useSelect } from '@wordpress/data'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { MENU_CONTENT_POSTS, MENU_ROOT } from '../constants'; -import ContentNavigationItem from '../content-navigation-item'; -import SearchResults from '../search-results'; -import useDebouncedSearch from '../use-debounced-search'; -import { store as editSiteStore } from '../../../../store'; - -export default function ContentPostsMenu() { - const { - search, - searchQuery, - onSearch, - isDebouncing, - } = useDebouncedSearch(); - - const { posts, showOnFront, isResolved } = useSelect( - ( select ) => { - const { - getEntityRecords, - getEditedEntityRecord, - hasFinishedResolution, - } = select( coreStore ); - const query = searchQuery - ? { - search: searchQuery, - } - : undefined; - const getEntityRecodsArgs = [ 'postType', 'post', query ]; - const hasResolvedPosts = hasFinishedResolution( - 'getEntityRecords', - getEntityRecodsArgs - ); - return { - posts: getEntityRecords( ...getEntityRecodsArgs ), - isResolved: hasResolvedPosts, - showOnFront: getEditedEntityRecord( 'root', 'site' ) - .show_on_front, - }; - }, - [ searchQuery ] - ); - - const { setPage, setIsNavigationPanelOpened } = useDispatch( - editSiteStore - ); - - const onActivateFrontItem = useCallback( () => { - setPage( { - type: 'page', - path: '/', - context: { - queryContext: { page: 1 }, - }, - } ); - setIsNavigationPanelOpened( false ); - }, [ setPage, setIsNavigationPanelOpened ] ); - - const shouldShowLoadingForDebouncing = search && isDebouncing; - const showLoading = ! isResolved || shouldShowLoadingForDebouncing; - - return ( - - { search && ! isDebouncing && ( - - ) } - - { ! search && ( - <> - { showOnFront === 'posts' && ( - - ) } - - { posts?.map( ( post ) => ( - - ) ) } - - ) } - - { showLoading && ( - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/index.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/index.js deleted file mode 100644 index 1a1c6988e38650..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/index.js +++ /dev/null @@ -1,61 +0,0 @@ -/** - * WordPress dependencies - */ -import { - __experimentalNavigationGroup as NavigationGroup, - __experimentalNavigationItem as NavigationItem, - __experimentalNavigationMenu as NavigationMenu, -} from '@wordpress/components'; -import { __ } from '@wordpress/i18n'; - -/** - * Internal dependencies - */ -import { - MENU_TEMPLATES, - MENU_TEMPLATE_PARTS, - MENU_CONTENT_CATEGORIES, - MENU_CONTENT_PAGES, - MENU_CONTENT_POSTS, -} from '../constants'; -import ContentPagesMenu from './content-pages'; -import ContentCategoriesMenu from './content-categories'; -import ContentPostsMenu from './content-posts'; -import TemplatesMenu from './templates'; -import TemplatePartsMenu from './template-parts'; - -export default function SiteMenu() { - return ( - - - - - - - - - - - - - - - - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts-sub.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts-sub.js deleted file mode 100644 index 88252d4ba618ba..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts-sub.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * External dependencies - */ -import { map } from 'lodash'; - -/** - * WordPress dependencies - */ -import { __experimentalNavigationMenu as NavigationMenu } from '@wordpress/components'; - -/** - * Internal dependencies - */ -import TemplateNavigationItem from '../template-navigation-item'; -import { MENU_TEMPLATE_PARTS } from '../constants'; - -export default function TemplatePartsSubMenu( { menu, title, templateParts } ) { - return ( - - { map( templateParts, ( templatePart ) => ( - - ) ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts.js deleted file mode 100644 index 7a3cffbabd61eb..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/template-parts.js +++ /dev/null @@ -1,94 +0,0 @@ -/** - * External dependencies - */ -import { groupBy } from 'lodash'; - -/** - * WordPress dependencies - */ -import { __ } from '@wordpress/i18n'; -import { useSelect } from '@wordpress/data'; -import { - __experimentalNavigationMenu as NavigationMenu, - __experimentalNavigationItem as NavigationItem, -} from '@wordpress/components'; -import { useState, useCallback } from '@wordpress/element'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { - MENU_ROOT, - MENU_TEMPLATE_PARTS, - TEMPLATE_PARTS_SUB_MENUS, -} from '../constants'; -import SearchResults from '../search-results'; -import TemplatePartsSubMenu from './template-parts-sub'; - -export default function TemplatePartsMenu() { - const [ search, setSearch ] = useState( '' ); - const onSearch = useCallback( ( value ) => { - setSearch( value ); - } ); - - const { isLoading, templateParts, templatePartsByArea } = useSelect( - ( select ) => { - const templatePartRecords = select( coreStore ).getEntityRecords( - 'postType', - 'wp_template_part' - ); - - const _templateParts = templatePartRecords || []; - const _templatePartsByArea = groupBy( _templateParts, 'area' ); - - return { - isLoading: templatePartRecords === null, - templateParts: _templateParts, - templatePartsByArea: _templatePartsByArea, - }; - }, - [] - ); - - return ( - <> - - { search && ( - - ) } - - { ! search && - TEMPLATE_PARTS_SUB_MENUS.map( ( { title, menu } ) => ( - - ) ) } - - { ! search && isLoading && ( - - ) } - - - { TEMPLATE_PARTS_SUB_MENUS.map( ( { area, menu, title } ) => ( - - ) ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-sub.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-sub.js deleted file mode 100644 index 9d6322c25a4f81..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-sub.js +++ /dev/null @@ -1,42 +0,0 @@ -/** - * External dependencies - */ -import { map } from 'lodash'; - -/** - * WordPress dependencies - */ -import { __experimentalNavigationMenu as NavigationMenu } from '@wordpress/components'; -import { useMemo } from '@wordpress/element'; - -/** - * Internal dependencies - */ -import TemplateNavigationItem from '../template-navigation-item'; -import { MENU_TEMPLATES } from '../constants'; - -export default function TemplatesSubMenu( { menu, title, templates } ) { - const templatesFiltered = useMemo( - () => - templates - ?.filter( ( { location } ) => location === menu ) - ?.map( ( { template } ) => template ) ?? [], - [ menu, templates ] - ); - - return ( - - { map( templatesFiltered, ( template ) => ( - - ) ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js deleted file mode 100644 index 1e4de3f2358ad0..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js +++ /dev/null @@ -1,147 +0,0 @@ -/** - * External dependencies - */ -import { map, find } from 'lodash'; - -/** - * WordPress dependencies - */ -import { - __experimentalNavigationItem as NavigationItem, - __experimentalNavigationMenu as NavigationMenu, -} from '@wordpress/components'; -import { useSelect } from '@wordpress/data'; -import { __ } from '@wordpress/i18n'; -import { useState, useCallback, useMemo } from '@wordpress/element'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { - MENU_ROOT, - MENU_TEMPLATES, - MENU_TEMPLATES_GENERAL, - MENU_TEMPLATES_PAGES, - MENU_TEMPLATES_POSTS, - MENU_TEMPLATES_UNUSED, -} from '../constants'; -import NewTemplateDropdown from '../new-template-dropdown'; -import TemplateNavigationItem from '../template-navigation-item'; -import SearchResults from '../search-results'; -import TemplatesSubMenu from './templates-sub'; -import { - getTemplatesLocationMap, - getUnusedTemplates, -} from '../template-hierarchy'; - -export default function TemplatesMenu() { - const [ search, setSearch ] = useState( '' ); - const onSearch = useCallback( ( value ) => { - setSearch( value ); - } ); - - const { templates, showOnFront } = useSelect( ( select ) => { - const { getEntityRecords, getEditedEntityRecord } = select( coreStore ); - return { - templates: getEntityRecords( 'postType', 'wp_template' ), - showOnFront: getEditedEntityRecord( 'root', 'site' ).show_on_front, - }; - }, [] ); - - const templatesWithLocation = useMemo( () => { - if ( ! templates ) { - return null; - } - - const unusedTemplates = getUnusedTemplates( templates, showOnFront ); - const templateLocations = getTemplatesLocationMap( templates ); - - return templates.map( ( template ) => ( { - template, - location: find( unusedTemplates, { slug: template.slug } ) - ? MENU_TEMPLATES_UNUSED - : templateLocations[ template.slug ], - } ) ); - }, [ templates ] ); - - const topLevelTemplates = useMemo( - () => - templatesWithLocation - ?.filter( ( { location } ) => location === MENU_TEMPLATES ) - ?.map( ( { template } ) => template ) ?? [], - [ templatesWithLocation ] - ); - - return ( - } - parentMenu={ MENU_ROOT } - hasSearch={ true } - onSearch={ onSearch } - search={ search } - > - { search && ( - - ) } - - { ! search && ( - <> - { map( topLevelTemplates, ( template ) => ( - - ) ) } - - - - - - ) } - - { ! search && templates === null && ( - - ) } - - - - - - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js deleted file mode 100644 index aef8443edfe917..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/navigation-entity-items.js +++ /dev/null @@ -1,53 +0,0 @@ -/** - * WordPress dependencies - */ -import { useDispatch, useSelect } from '@wordpress/data'; -import { __experimentalNavigationItem as NavigationItem } from '@wordpress/components'; -import { getPathAndQueryString } from '@wordpress/url'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import { store as editSiteStore } from '../../../store'; - -const getEntityTitle = ( kind, entity ) => - 'taxonomy' === kind ? entity.name : entity?.title?.rendered; - -export default function NavigationEntityItems( { kind, name, query = {} } ) { - const entities = useSelect( - ( select ) => select( coreStore ).getEntityRecords( kind, name, query ), - [ kind, name, query ] - ); - - const { setPage } = useDispatch( editSiteStore ); - - if ( ! entities ) { - return null; - } - - const onActivateItem = ( { type, slug, link, id } ) => { - setPage( { - type, - slug, - path: getPathAndQueryString( link ), - context: { - postType: type, - postId: id, - }, - } ); - }; - - return entities.map( ( entity ) => { - const key = `content-${ getPathAndQueryString( entity.link ) }`; - - return ( - onActivateItem( entity ) } - /> - ); - } ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js deleted file mode 100644 index a0e3ee5a0062d3..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js +++ /dev/null @@ -1,110 +0,0 @@ -/** - * External dependencies - */ -import { filter, find, includes, map } from 'lodash'; - -/** - * WordPress dependencies - */ -import { - DropdownMenu, - MenuGroup, - MenuItem, - NavigableMenu, -} from '@wordpress/components'; -import { useDispatch, useSelect } from '@wordpress/data'; -import { __ } from '@wordpress/i18n'; -import { Icon, plus } from '@wordpress/icons'; -import { store as editorStore } from '@wordpress/editor'; -import { store as coreStore } from '@wordpress/core-data'; - -/** - * Internal dependencies - */ -import getClosestAvailableTemplate from '../../../utils/get-closest-available-template'; -import { TEMPLATES_NEW_OPTIONS } from './constants'; -import { store as editSiteStore } from '../../../store'; - -export default function NewTemplateDropdown() { - const { defaultTemplateTypes, templates } = useSelect( ( select ) => { - const { - __experimentalGetDefaultTemplateTypes: getDefaultTemplateTypes, - } = select( editorStore ); - const templateEntities = select( coreStore ).getEntityRecords( - 'postType', - 'wp_template' - ); - return { - defaultTemplateTypes: getDefaultTemplateTypes(), - templates: templateEntities, - }; - }, [] ); - const { addTemplate } = useDispatch( editSiteStore ); - - const createTemplate = ( slug ) => { - const closestAvailableTemplate = getClosestAvailableTemplate( - slug, - templates - ); - const { title, description } = find( defaultTemplateTypes, { slug } ); - addTemplate( { - content: closestAvailableTemplate.content.raw, - excerpt: description, - // Slugs need to be strings, so this is for template `404` - slug: slug.toString(), - status: 'publish', - title, - } ); - }; - - const existingTemplateSlugs = map( templates, 'slug' ); - - const missingTemplates = filter( - defaultTemplateTypes, - ( template ) => - includes( TEMPLATES_NEW_OPTIONS, template.slug ) && - ! includes( existingTemplateSlugs, template.slug ) - ); - - if ( ! missingTemplates.length ) { - return null; - } - - return ( - , - isSmall: true, - variant: 'tertiary', - } } - > - { ( { onClose } ) => ( - - - { map( - missingTemplates, - ( { title, description, slug } ) => ( - { - createTemplate( slug ); - onClose(); - } } - > - { title } - - ) - ) } - - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/search-results.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/search-results.js deleted file mode 100644 index 5135b723135042..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/search-results.js +++ /dev/null @@ -1,117 +0,0 @@ -/** - * External dependencies - */ -import { map, sortBy, keyBy } from 'lodash'; - -/** - * WordPress dependencies - */ -import { useMemo } from '@wordpress/element'; -import { __experimentalNavigationGroup as NavigationGroup } from '@wordpress/components'; -import { __ } from '@wordpress/i18n'; - -/** - * Internal dependencies - */ -import { normalizedSearch } from './utils'; -import { useSelect } from '@wordpress/data'; -import { store as editorStore } from '@wordpress/editor'; -import TemplateNavigationItem from './template-navigation-item'; -import ContentNavigationItem from './content-navigation-item'; - -export default function SearchResults( { items, search, disableFilter } ) { - let itemType = null; - if ( items?.length > 0 ) { - if ( items[ 0 ].taxonomy ) { - itemType = 'taxonomy'; - } else { - itemType = items[ 0 ].type; - } - } - - const itemInfos = useSelect( - ( select ) => { - if ( itemType === null || items === null ) { - return []; - } - - if ( itemType === 'wp_template' ) { - const { - __experimentalGetTemplateInfo: getTemplateInfo, - } = select( editorStore ); - - return items.map( ( item ) => ( { - slug: item.slug, - ...getTemplateInfo( item ), - } ) ); - } - - if ( itemType === 'taxonomy' ) { - return items.map( ( item ) => ( { - slug: item.slug, - title: item.name, - description: item.description, - } ) ); - } - - return items.map( ( item ) => ( { - slug: item.slug, - title: item.title?.rendered, - description: item.excerpt?.rendered, - } ) ); - }, - [ items, itemType ] - ); - const itemInfosMap = useMemo( () => keyBy( itemInfos, 'slug' ), [ - itemInfos, - ] ); - - const itemsFiltered = useMemo( () => { - if ( items === null || search.length === 0 ) { - return []; - } - - if ( disableFilter ) { - return items; - } - - return items.filter( ( { slug } ) => { - const { title, description } = itemInfosMap[ slug ]; - - return ( - normalizedSearch( slug, search ) || - normalizedSearch( title, search ) || - normalizedSearch( description, search ) - ); - } ); - }, [ items, itemInfos, search ] ); - - const itemsSorted = useMemo( () => { - if ( ! itemsFiltered ) { - return []; - } - - return sortBy( itemsFiltered, [ - ( { slug } ) => { - const { title } = itemInfosMap[ slug ]; - return ! normalizedSearch( title, search ); - }, - ] ); - }, [ itemsFiltered, search ] ); - - const ItemComponent = - itemType === 'wp_template' || itemType === 'wp_template_part' - ? TemplateNavigationItem - : ContentNavigationItem; - - return ( - - { map( itemsSorted, ( item ) => ( - - ) ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js deleted file mode 100644 index 01218380a25f93..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-navigation-item.js +++ /dev/null @@ -1,83 +0,0 @@ -/** - * WordPress dependencies - */ -import { - Button, - __experimentalNavigationItem as NavigationItem, -} from '@wordpress/components'; -import { useDispatch, useSelect } from '@wordpress/data'; -import { useState } from '@wordpress/element'; -import { __ } from '@wordpress/i18n'; -import { store as editorStore } from '@wordpress/editor'; - -/** - * Internal dependencies - */ -import TemplatePreview from './template-preview'; -import { NavigationPanelPreviewFill } from '../index'; -import { store as editSiteStore } from '../../../store'; - -export default function TemplateNavigationItem( { item } ) { - const { title, description } = useSelect( - ( select ) => - 'wp_template' === item.type - ? select( editorStore ).__experimentalGetTemplateInfo( item ) - : { - title: item?.title?.rendered || item?.slug, - description: '', - }, - [] - ); - const { - setTemplate, - setTemplatePart, - setIsNavigationPanelOpened, - } = useDispatch( editSiteStore ); - const [ isPreviewVisible, setIsPreviewVisible ] = useState( false ); - - if ( ! item ) { - return null; - } - - const onActivateItem = () => { - if ( 'wp_template' === item.type ) { - setTemplate( item.id, item.slug ); - } else { - setTemplatePart( item.id ); - } - setIsNavigationPanelOpened( false ); - }; - - return ( - - - - { isPreviewVisible && ( - - - - ) } - - ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-preview.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-preview.js deleted file mode 100644 index adf069ddbb2d0e..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/template-preview.js +++ /dev/null @@ -1,32 +0,0 @@ -/** - * WordPress dependencies - */ -import { parse } from '@wordpress/blocks'; -import { BlockPreview, BlockContextProvider } from '@wordpress/block-editor'; -import { useMemo } from '@wordpress/element'; - -export default function TemplatePreview( { rawContent, blockContext } ) { - const blocks = useMemo( () => ( rawContent ? parse( rawContent ) : [] ), [ - rawContent, - ] ); - - if ( ! blocks || blocks.length === 0 ) { - return null; - } - - if ( blockContext ) { - return ( -
- - - -
- ); - } - - return ( -
- -
- ); -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/use-debounced-search.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/use-debounced-search.js deleted file mode 100644 index eb1f75dcd61b78..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/use-debounced-search.js +++ /dev/null @@ -1,47 +0,0 @@ -/** - * External dependencies - */ -import { debounce } from 'lodash'; - -/** - * WordPress dependencies - */ -import { useState, useCallback, useEffect } from '@wordpress/element'; - -/** - * Internal dependencies - */ -import { SEARCH_DEBOUNCE_IN_MS } from './constants'; - -export default function useDebouncedSearch() { - // The value used by the NavigationMenu to control the input field. - const [ search, setSearch ] = useState( '' ); - // The value used to actually perform the search query. - const [ searchQuery, setSearchQuery ] = useState( '' ); - const [ isDebouncing, setIsDebouncing ] = useState( false ); - - useEffect( () => { - setIsDebouncing( false ); - }, [ searchQuery ] ); - - const debouncedSetSearchQuery = useCallback( - debounce( setSearchQuery, SEARCH_DEBOUNCE_IN_MS ), - [ setSearchQuery ] - ); - - const onSearch = useCallback( - ( value ) => { - setSearch( value ); - debouncedSetSearchQuery( value ); - setIsDebouncing( true ); - }, - [ setSearch, setIsDebouncing, debouncedSetSearchQuery ] - ); - - return { - search, - searchQuery, - isDebouncing, - onSearch, - }; -} diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/utils.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/utils.js deleted file mode 100644 index 251b90cfe44dfd..00000000000000 --- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/utils.js +++ /dev/null @@ -1,11 +0,0 @@ -/** - * External dependencies - */ -import { deburr } from 'lodash'; - -// @see packages/block-editor/src/components/inserter/search-items.js -export const normalizeInput = ( input ) => - deburr( input ).replace( /^\//, '' ).toLowerCase(); - -export const normalizedSearch = ( title, search ) => - -1 !== normalizeInput( title ).indexOf( normalizeInput( search ) ); diff --git a/packages/edit-site/src/utils/get-closest-available-template.js b/packages/edit-site/src/utils/get-closest-available-template.js deleted file mode 100644 index e73be0204d753a..00000000000000 --- a/packages/edit-site/src/utils/get-closest-available-template.js +++ /dev/null @@ -1,31 +0,0 @@ -/** - * External dependencies - */ -import { find } from 'lodash'; - -export default function getClosestAvailableTemplate( slug, templates ) { - const template = find( templates, { slug } ); - if ( template ) { - return template; - } - - switch ( slug ) { - case 'single': - case 'page': - return getClosestAvailableTemplate( 'singular', templates ); - case 'author': - case 'category': - case 'taxonomy': - case 'date': - case 'tag': - return getClosestAvailableTemplate( 'archive', templates ); - case 'front-page': - return getClosestAvailableTemplate( 'home', templates ); - case 'attachment': - return getClosestAvailableTemplate( 'single', templates ); - case 'privacy-policy': - return getClosestAvailableTemplate( 'page', templates ); - } - - return find( templates, { slug: 'index' } ); -}