diff --git a/app/client/src/ce/pages/common/AppHeader.tsx b/app/client/src/ce/pages/common/AppHeader.tsx index cb28ed36871d..3ca9f0bd337d 100644 --- a/app/client/src/ce/pages/common/AppHeader.tsx +++ b/app/client/src/ce/pages/common/AppHeader.tsx @@ -4,52 +4,44 @@ import { Route, Switch } from "react-router"; import { VIEWER_PATH, BUILDER_PATH, - SETUP, - SIGNUP_SUCCESS_URL, - USER_AUTH_URL, BUILDER_PATH_DEPRECATED, VIEWER_PATH_DEPRECATED, ADMIN_SETTINGS_CATEGORY_PATH, VIEWER_CUSTOM_PATH, BUILDER_CUSTOM_PATH, BASE_URL, - CUSTOM_WIDGETS_EDITOR_ID_PATH, - CUSTOM_WIDGETS_EDITOR_ID_PATH_CUSTOM, - CUSTOM_WIDGETS_DEPRECATED_EDITOR_ID_PATH, } from "constants/routes"; + import Navigation from "pages/AppViewer/Navigation"; -import type { RouteComponentProps } from "react-router"; -import { Header as AppIDEHeader } from "pages/Editor/IDE/Header"; +import { Header as IDEHeader } from "pages/Editor/IDE/Header"; -export type Props = RouteComponentProps; +const IDE_HEADER_PATHS = [ + BUILDER_PATH_DEPRECATED, + BUILDER_PATH, + BUILDER_CUSTOM_PATH, +]; -export const headerRoot = document.getElementById("header-root"); +const NAVIGATION_PATHS = [ + VIEWER_PATH_DEPRECATED, + VIEWER_PATH, + VIEWER_CUSTOM_PATH, +]; + +const PAGE_HEADER_PATHS = [ADMIN_SETTINGS_CATEGORY_PATH, BASE_URL]; export const Routes = () => { return ( - - - - - - - - - - - - - - + + + + + + + + + + ); }; diff --git a/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx b/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx index 47ef1030766c..7fc8aa4c90b8 100644 --- a/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx +++ b/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useCallback, useState } from "react"; import { Popover, PopoverTrigger, PopoverContent } from "@appsmith/ads"; import { createMessage, HEADER_TITLES } from "ee/constants/messages"; @@ -8,9 +8,9 @@ import { IDEHeaderEditorSwitcher } from "IDE"; const EditorTitle = ({ title }: { title: string }) => { const [active, setActive] = useState(false); - const closeMenu = () => { + const closeMenu = useCallback(() => { setActive(false); - }; + }, []); return ( diff --git a/app/client/src/pages/Editor/IDE/Header/index.tsx b/app/client/src/pages/Editor/IDE/Header/index.tsx index ee4365196a5c..105b92b5fdec 100644 --- a/app/client/src/pages/Editor/IDE/Header/index.tsx +++ b/app/client/src/pages/Editor/IDE/Header/index.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useState } from "react"; +import React, { memo, useCallback, useState } from "react"; import { Flex, Tooltip, @@ -70,7 +70,6 @@ import { useHref } from "pages/Editor/utils"; import { viewerURL } from "ee/RouteBuilder"; import HelpBar from "components/editorComponents/GlobalSearch/HelpBar"; import { EditorTitle } from "./EditorTitle"; -import { useCurrentAppState } from "../hooks/useCurrentAppState"; import { EditorState } from "ee/entities/IDE/constants"; import { EditorSaveIndicator } from "pages/Editor/EditorSaveIndicator"; import type { Page } from "entities/Page"; @@ -78,6 +77,7 @@ import { IDEHeader, IDEHeaderTitle } from "IDE"; import { APPLICATIONS_URL } from "constants/routes"; import { useNavigationMenuData } from "../../EditorName/useNavigationMenuData"; import useLibraryHeaderTitle from "ee/pages/Editor/IDE/Header/useLibraryHeaderTitle"; +import { identifyEntityFromPath } from "navigation/FocusEntity"; const StyledDivider = styled(Divider)` height: 50%; @@ -119,7 +119,7 @@ const HeaderTitleComponent = ({ appState, currentPage }: HeaderTitleProps) => { } }; -const Header = () => { +export const Header = memo(() => { const dispatch = useDispatch(); // selectors @@ -134,7 +134,6 @@ const Header = () => { const isGitConnected = useSelector(getIsGitConnected); const pageId = useSelector(getCurrentPageId) as string; const currentPage = useSelector(getPageById(pageId)); - const appState = useCurrentAppState(); const isSaving = useSelector(getIsPageSaving); const pageSaveError = useSelector(getPageSavingError); @@ -156,6 +155,7 @@ const Header = () => { FEATURE_FLAG.license_private_embeds_enabled, ); + const { appState } = identifyEntityFromPath(location.pathname); const deployLink = useHref(viewerURL, { basePageId: currentPage?.basePageId, }); @@ -352,6 +352,4 @@ const Header = () => { ); -}; - -export { Header }; +});