/**
 * WordPress dependencies
 */
import { __experimentalItemGroup as ItemGroup } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { layout, symbol, navigation, styles, page } from '@wordpress/icons';
import { useDispatch, useSelect } from '@wordpress/data';
import { useEffect } from '@wordpress/element';
import { store as coreStore } from '@wordpress/core-data';

/**
 * Internal dependencies
 */
import SidebarNavigationScreen from '../sidebar-navigation-screen';
import SidebarNavigationItem from '../sidebar-navigation-item';
import { SidebarNavigationItemGlobalStyles } from '../sidebar-navigation-screen-global-styles';
import { unlock } from '../../lock-unlock';
import { store as editSiteStore } from '../../store';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
export function MainSidebarNavigationContent({
  isBlockBasedTheme = true
}) {
  return /*#__PURE__*/_jsxs(ItemGroup, {
    className: "edit-site-sidebar-navigation-screen-main",
    children: [isBlockBasedTheme && /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsx(SidebarNavigationItem, {
        uid: "navigation-navigation-item",
        to: "/navigation",
        withChevron: true,
        icon: navigation,
        children: __('Navigation')
      }), /*#__PURE__*/_jsx(SidebarNavigationItemGlobalStyles, {
        to: "/styles",
        uid: "global-styles-navigation-item",
        icon: styles,
        children: __('Styles')
      }), /*#__PURE__*/_jsx(SidebarNavigationItem, {
        uid: "page-navigation-item",
        to: "/page",
        withChevron: true,
        icon: page,
        children: __('Pages')
      }), /*#__PURE__*/_jsx(SidebarNavigationItem, {
        uid: "template-navigation-item",
        to: "/template",
        withChevron: true,
        icon: layout,
        children: __('Templates')
      })]
    }), !isBlockBasedTheme && /*#__PURE__*/_jsx(SidebarNavigationItem, {
      uid: "stylebook-navigation-item",
      to: "/stylebook",
      withChevron: true,
      icon: styles,
      children: __('Styles')
    }), /*#__PURE__*/_jsx(SidebarNavigationItem, {
      uid: "patterns-navigation-item",
      to: "/pattern",
      withChevron: true,
      icon: symbol,
      children: __('Patterns')
    })]
  });
}
export default function SidebarNavigationScreenMain({
  customDescription
}) {
  const isBlockBasedTheme = useSelect(select => select(coreStore).getCurrentTheme()?.is_block_theme, []);
  const {
    setEditorCanvasContainerView
  } = unlock(useDispatch(editSiteStore));

  // Clear the editor canvas container view when accessing the main navigation screen.
  useEffect(() => {
    setEditorCanvasContainerView(undefined);
  }, [setEditorCanvasContainerView]);
  let description;
  if (customDescription) {
    description = customDescription;
  } else if (isBlockBasedTheme) {
    description = __('Customize the appearance of your website using the block editor.');
  } else {
    description = __('Explore block styles and patterns to refine your site.');
  }
  return /*#__PURE__*/_jsx(SidebarNavigationScreen, {
    isRoot: true,
    title: __('Design'),
    description: description,
    content: /*#__PURE__*/_jsx(MainSidebarNavigationContent, {
      isBlockBasedTheme: isBlockBasedTheme
    })
  });
}
//# sourceMappingURL=index.js.map