diff --git a/app/client/cypress/e2e/Regression/Apps/EchoApiCMS_spec.js b/app/client/cypress/e2e/Regression/Apps/EchoApiCMS_spec.js
index 197d01bc3c..4eeb13eca9 100644
--- a/app/client/cypress/e2e/Regression/Apps/EchoApiCMS_spec.js
+++ b/app/client/cypress/e2e/Regression/Apps/EchoApiCMS_spec.js
@@ -75,7 +75,7 @@ describe(
it("4. Send mail and verify post request body", function () {
// navigating to canvas
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ cy.xpath(appPage.pagebutton).click();
cy.get(appPage.submitButton).should("be.visible");
cy.xpath("//span[text()='3']").click({ force: true });
cy.get(appPage.mailButton).closest("div").click();
@@ -89,7 +89,7 @@ describe(
.type("Task completed", { force: true });
cy.get(appPage.confirmButton).closest("div").click({ force: true });
cy.get(appPage.closeButton).closest("div").click({ force: true });
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ cy.xpath(appPage.pagebutton).click({ force: true });
PageLeftPane.switchSegment(PagePaneSegment.Queries);
cy.xpath(appPage.postApi).click({ force: true });
cy.ResponseCheck("Test");
@@ -99,14 +99,14 @@ describe(
it("5. Delete proposal and verify delete request body", function () {
// navigating back to canvas
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ cy.xpath(appPage.pagebutton).click({ force: true });
cy.get(appPage.submitButton).closest("div").should("be.visible");
cy.xpath("//span[text()='Dan.Wyman@hotmail.com']").click({ force: true });
// deleting the proposal and asserting delete call's response
cy.xpath(appPage.deleteButton).click({ force: true });
cy.xpath(appPage.deleteTaskText).should("be.visible");
cy.get(appPage.confirmButton).closest("div").click({ force: true });
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ cy.xpath(appPage.pagebutton).click({ force: true });
EditorNavigation.SelectEntityByName("delete_proposal", EntityType.Api);
cy.ResponseCheck("Dan.Wyman@hotmail.com");
cy.ResponseCheck("Recusan");
diff --git a/app/client/cypress/e2e/Regression/Apps/PromisesApp_spec.js b/app/client/cypress/e2e/Regression/Apps/PromisesApp_spec.js
index 2a348e14a2..faa619eee1 100644
--- a/app/client/cypress/e2e/Regression/Apps/PromisesApp_spec.js
+++ b/app/client/cypress/e2e/Regression/Apps/PromisesApp_spec.js
@@ -7,8 +7,6 @@ import {
} from "../../../support/Objects/ObjectsCore";
import EditorNavigation, {
EntityType,
- PageLeftPane,
- PagePaneSegment,
} from "../../../support/Pages/EditorNavigation";
const commonlocators = require("../../../locators/commonlocators.json");
@@ -61,7 +59,7 @@ describe(
shouldCreateNewJSObj: true,
},
);
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
cy.wait("@getConsolidatedData");
// verify text in the text widget
@@ -115,7 +113,7 @@ describe(
EditorNavigation.SelectEntityByName("JSObject1", EntityType.JSObject);
jsEditor.SelectFunctionDropdown("clearStore");
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
cy.xpath("//span[text()='Clear store']").click({ force: true });
cy.get(".t--draggable-textwidget span")
.eq(5)
diff --git a/app/client/cypress/e2e/Regression/ClientSide/ExplorerTests/Hide_Page_spec.js b/app/client/cypress/e2e/Regression/ClientSide/ExplorerTests/Hide_Page_spec.js
index a3ae877c73..68af153851 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/ExplorerTests/Hide_Page_spec.js
+++ b/app/client/cypress/e2e/Regression/ClientSide/ExplorerTests/Hide_Page_spec.js
@@ -1,6 +1,5 @@
import EditorNavigation, {
EntityType,
- PageLeftPane,
} from "../../../../support/Pages/EditorNavigation";
import * as _ from "../../../../support/Objects/ObjectsCore";
@@ -17,7 +16,6 @@ describe(
entityNameinLeftSidebar: "Page2",
action: "Hide",
});
- PageLeftPane.switchToAddNew();
cy.ClearSearch();
_.deployMode.DeployApp();
cy.get(".t--page-switch-tab").should("have.length", 2);
diff --git a/app/client/cypress/e2e/Regression/ClientSide/Git/GitImport/GitImport_spec.js b/app/client/cypress/e2e/Regression/ClientSide/Git/GitImport/GitImport_spec.js
index c83f453e79..783e3d9f50 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/Git/GitImport/GitImport_spec.js
+++ b/app/client/cypress/e2e/Regression/ClientSide/Git/GitImport/GitImport_spec.js
@@ -166,7 +166,7 @@ describe("Git import flow ", { tags: ["@tag.Git"] }, function () {
// verify jsObject is not duplicated
agHelper.Sleep(2000); //for cloning of table data to finish
EditorNavigation.SelectEntityByName(jsObject, EntityType.JSObject); //Also checking jsobject exists after cloning the page
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1 Copy", EntityType.Page);
cy.xpath("//input[@class='bp3-input' and @value='Success']").should(
"be.visible",
);
@@ -192,7 +192,6 @@ describe("Git import flow ", { tags: ["@tag.Git"] }, function () {
cy.xpath("//input[@value='Success']");
// navigate to Page1 and verify data
cy.get(".t--page-switch-tab").contains("Page1").click({ force: true });
- PageLeftPane.switchSegment(PagePaneSegment.UI);
table.AssertTableLoaded();
// verify api response binded to input widget
cy.xpath("//input[@value='this is a test']");
@@ -212,7 +211,6 @@ describe("Git import flow ", { tags: ["@tag.Git"] }, function () {
cy.xpath("//input[@value='Success']");
// navigate to Page1 and verify data
cy.get(".t--page-switch-tab").contains("Page1 Copy").click({ force: true });
- PageLeftPane.switchSegment(PagePaneSegment.UI);
table.AssertTableLoaded(0, 1, "v1");
cy.xpath("//input[@value='this is a test']");
cy.xpath("//input[@value='Success']");
diff --git a/app/client/cypress/e2e/Regression/ClientSide/SetProperty/SetOptions_Spec.ts b/app/client/cypress/e2e/Regression/ClientSide/SetProperty/SetOptions_Spec.ts
index e09e085cf5..6cae600c1d 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/SetProperty/SetOptions_Spec.ts
+++ b/app/client/cypress/e2e/Regression/ClientSide/SetProperty/SetOptions_Spec.ts
@@ -11,8 +11,6 @@ import {
} from "../../../../support/Objects/ObjectsCore";
import EditorNavigation, {
EntityType,
- PageLeftPane,
- PagePaneSegment,
} from "../../../../support/Pages/EditorNavigation";
describe(
@@ -39,7 +37,7 @@ describe(
},
);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
@@ -62,7 +60,7 @@ describe(
false,
);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
@@ -85,7 +83,7 @@ describe(
false,
);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
@@ -108,7 +106,7 @@ describe(
false,
);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
@@ -131,7 +129,7 @@ describe(
false,
);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
@@ -160,7 +158,7 @@ describe(
}
}`);
jsEditor.RunJSObj();
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
diff --git a/app/client/cypress/e2e/Regression/ClientSide/SetProperty/WidgetPropertySetters2_spec.ts b/app/client/cypress/e2e/Regression/ClientSide/SetProperty/WidgetPropertySetters2_spec.ts
index 7513a69e03..9fe3369221 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/SetProperty/WidgetPropertySetters2_spec.ts
+++ b/app/client/cypress/e2e/Regression/ClientSide/SetProperty/WidgetPropertySetters2_spec.ts
@@ -11,8 +11,6 @@ import {
} from "../../../../support/Objects/ObjectsCore";
import EditorNavigation, {
EntityType,
- PageLeftPane,
- PagePaneSegment,
} from "../../../../support/Pages/EditorNavigation";
describe(
@@ -136,7 +134,6 @@ describe(
);
jsEditor.RunJSObj();
EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
- PageLeftPane.switchSegment(PagePaneSegment.UI);
agHelper
.GetText(
locators._widgetInDeployed(draggableWidgets.INPUT_V2) +
diff --git a/app/client/cypress/e2e/Sanity/Datasources/MySQLNoiseTest_spec.js b/app/client/cypress/e2e/Sanity/Datasources/MySQLNoiseTest_spec.js
index 34818e04f4..d658c58898 100644
--- a/app/client/cypress/e2e/Sanity/Datasources/MySQLNoiseTest_spec.js
+++ b/app/client/cypress/e2e/Sanity/Datasources/MySQLNoiseTest_spec.js
@@ -1,6 +1,5 @@
-import {
- PageLeftPane,
- PagePaneSegment,
+import EditorNavigation, {
+ EntityType,
} from "../../../support/Pages/EditorNavigation";
const datasourceEditor = require("../../../locators/DatasourcesEditor.json");
@@ -48,7 +47,7 @@ describe(
);
cy.SaveAndRunAPI();
cy.ResponseCheck("killed");
- PageLeftPane.switchSegment(PagePaneSegment.UI);
+ EditorNavigation.SelectEntityByName("Page1", EntityType.Page);
cy.wait(2000);
// run kill query
cy.get(".bp3-button-text:contains('Kill Session')").should("be.visible");
diff --git a/app/client/cypress/support/ApiCommands.js b/app/client/cypress/support/ApiCommands.js
index 47b5084adb..cde24de7f6 100644
--- a/app/client/cypress/support/ApiCommands.js
+++ b/app/client/cypress/support/ApiCommands.js
@@ -85,7 +85,7 @@ Cypress.Commands.add("EditApiNameFromExplorer", (apiname) => {
.clear()
.type(apiname, { force: true })
.should("have.value", apiname)
- .blur({ force: true });
+ .blur();
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(3000);
});
diff --git a/app/client/src/pages/Editor/Explorer/Pages/index.tsx b/app/client/src/pages/Editor/Explorer/Pages/index.tsx
index 6609be1909..0cc0b5dfdb 100644
--- a/app/client/src/pages/Editor/Explorer/Pages/index.tsx
+++ b/app/client/src/pages/Editor/Explorer/Pages/index.tsx
@@ -12,32 +12,45 @@ import {
getCurrentPageId,
} from "selectors/editorSelectors";
import { EntityClassNames } from "../Entity";
-import { createNewPageFromEntities } from "actions/pageActions";
+import history, { NavigationMethod } from "utils/history";
+import { createNewPageFromEntities, updatePage } from "actions/pageActions";
+import { defaultPageIcon, pageIcon } from "../ExplorerIcons";
import { ADD_PAGE_TOOLTIP, createMessage } from "@appsmith/constants/messages";
import type { Page } from "@appsmith/constants/ReduxActionConstants";
import { getNextEntityName } from "utils/AppsmithUtils";
+import PageContextMenu from "./PageContextMenu";
+import { resolveAsSpaceChar } from "utils/helpers";
import { getExplorerPinned } from "selectors/explorerSelector";
import { setExplorerPinnedAction } from "actions/explorerActions";
import { selectAllPages } from "@appsmith/selectors/entitiesSelector";
+import { builderURL, widgetListURL } from "@appsmith/RouteBuilder";
import {
getExplorerStatus,
saveExplorerStatus,
} from "@appsmith/pages/Editor/Explorer/helpers";
import AddPageContextMenu from "./AddPageContextMenu";
+import AnalyticsUtil from "utils/AnalyticsUtil";
import { useLocation } from "react-router";
+import { toggleInOnboardingWidgetSelection } from "actions/onboardingActions";
import type { AppState } from "@appsmith/reducers";
import { getCurrentWorkspaceId } from "@appsmith/selectors/selectedWorkspaceSelectors";
import { getInstanceId } from "@appsmith//selectors/tenantSelectors";
import { useFeatureFlag } from "utils/hooks/useFeatureFlag";
import { FEATURE_FLAG } from "@appsmith/entities/FeatureFlag";
-import { getHasCreatePagePermission } from "@appsmith/utils/BusinessFeatures/permissionPageHelpers";
+import {
+ getHasCreatePagePermission,
+ getHasManagePagePermission,
+} from "@appsmith/utils/BusinessFeatures/permissionPageHelpers";
import {
ENTITY_HEIGHT,
RelativeContainer,
StyledEntity,
} from "../Common/components";
import { EntityExplorerResizeHandler } from "../Common/EntityExplorerResizeHandler";
-import { PageElement } from "pages/Editor/IDE/EditorPane/components/PageElement";
+import {
+ PERMISSION_TYPE,
+ isPermitted,
+} from "@appsmith/utils/permissionHelpers";
function Pages() {
const applicationId = useSelector(getCurrentApplicationId);
@@ -65,6 +78,28 @@ function Pages() {
}
}, [currentPageId]);
+ const switchPage = useCallback(
+ (page: Page) => {
+ const navigateToUrl =
+ currentPageId === page.pageId
+ ? widgetListURL({})
+ : builderURL({
+ pageId: page.pageId,
+ });
+ AnalyticsUtil.logEvent("PAGE_NAME_CLICK", {
+ name: page.pageName,
+ fromUrl: location.pathname,
+ type: "PAGES",
+ toUrl: navigateToUrl,
+ });
+ dispatch(toggleInOnboardingWidgetSelection(true));
+ history.push(navigateToUrl, {
+ invokedBy: NavigationMethod.EntityExplorer,
+ });
+ },
+ [location.pathname, currentPageId],
+ );
+
const [isMenuOpen, openMenu] = useState(false);
const workspaceId = useSelector(getCurrentWorkspaceId);
@@ -113,10 +148,59 @@ function Pages() {
isFeatureEnabled,
userAppPermissions,
);
+ const hasExportPermission = isPermitted(
+ userAppPermissions ?? [],
+ PERMISSION_TYPE.EXPORT_APPLICATION,
+ );
const pageElements = useMemo(
- () => pages.map((page) => ),
- [pages, location.pathname],
+ () =>
+ pages.map((page) => {
+ const icon = page.isDefault ? defaultPageIcon : pageIcon;
+ const isCurrentPage = currentPageId === page.pageId;
+ const pagePermissions = page.userPermissions;
+ const canManagePages = getHasManagePagePermission(
+ isFeatureEnabled,
+ pagePermissions,
+ );
+
+ const contextMenu = (
+
+ );
+
+ return (
+ switchPage(page)}
+ active={isCurrentPage}
+ canEditEntityName={canManagePages}
+ className={`page ${isCurrentPage && "activePage"}`}
+ contextMenu={contextMenu}
+ disabled={page.isHidden}
+ entityId={page.pageId}
+ icon={icon}
+ isDefaultExpanded={isCurrentPage}
+ key={page.pageId}
+ name={page.pageName}
+ onNameEdit={resolveAsSpaceChar}
+ searchKeyword={""}
+ step={1}
+ updateEntityName={(id, name) =>
+ updatePage({ id, name, isHidden: !!page.isHidden })
+ }
+ />
+ );
+ }),
+ [pages, currentPageId, applicationId, location.pathname],
);
return (
diff --git a/app/client/src/pages/Editor/IDE/EditorPane/PagesSection.tsx b/app/client/src/pages/Editor/IDE/EditorPane/PagesSection.tsx
index bc7517d6c1..ade47a04f6 100644
--- a/app/client/src/pages/Editor/IDE/EditorPane/PagesSection.tsx
+++ b/app/client/src/pages/Editor/IDE/EditorPane/PagesSection.tsx
@@ -4,22 +4,39 @@ import { animated, useSpring } from "react-spring";
import { useDispatch, useSelector } from "react-redux";
import { useLocation } from "react-router";
-import { selectAllPages } from "@appsmith/selectors/entitiesSelector";
+import {
+ getCurrentPageId,
+ selectAllPages,
+} from "@appsmith/selectors/entitiesSelector";
import type { Page } from "@appsmith/constants/ReduxActionConstants";
-import { getHasCreatePagePermission } from "@appsmith/utils/BusinessFeatures/permissionPageHelpers";
+import PageContextMenu from "pages/Editor/Explorer/Pages/PageContextMenu";
+import { StyledEntity } from "pages/Editor/Explorer/Common/components";
+import { defaultPageIcon, pageIcon } from "pages/Editor/Explorer/ExplorerIcons";
+import {
+ getHasCreatePagePermission,
+ getHasManagePagePermission,
+} from "@appsmith/utils/BusinessFeatures/permissionPageHelpers";
import { useFeatureFlag } from "utils/hooks/useFeatureFlag";
import { FEATURE_FLAG } from "@appsmith/entities/FeatureFlag";
import { getCurrentApplicationId } from "selectors/editorSelectors";
import { EntityClassNames } from "pages/Editor/Explorer/Entity";
+import {
+ isPermitted,
+ PERMISSION_TYPE,
+} from "@appsmith/utils/permissionHelpers";
import { getCurrentApplication } from "@appsmith/selectors/applicationSelectors";
import type { AppState } from "@appsmith/reducers";
-import { createNewPageFromEntities } from "actions/pageActions";
+import { builderURL, widgetListURL } from "@appsmith/RouteBuilder";
+import AnalyticsUtil from "utils/AnalyticsUtil";
+import { toggleInOnboardingWidgetSelection } from "actions/onboardingActions";
+import history, { NavigationMethod } from "utils/history";
+import { resolveAsSpaceChar } from "utils/helpers";
+import { createNewPageFromEntities, updatePage } from "actions/pageActions";
import { setIdeEditorPagesActiveStatus } from "actions/ideActions";
import AddPageContextMenu from "pages/Editor/Explorer/Pages/AddPageContextMenu";
import { getNextEntityName } from "utils/AppsmithUtils";
import { getCurrentWorkspaceId } from "@appsmith/selectors/selectedWorkspaceSelectors";
import { getInstanceId } from "@appsmith/selectors/tenantSelectors";
-import { PageElement } from "pages/Editor/IDE/EditorPane/components/PageElement";
const AnimatedFlex = animated(Flex);
@@ -27,6 +44,7 @@ const PagesSection = () => {
const dispatch = useDispatch();
const location = useLocation();
const pages: Page[] = useSelector(selectAllPages);
+ const currentPageId = useSelector(getCurrentPageId);
const applicationId = useSelector(getCurrentApplicationId);
const userAppPermissions = useSelector(
(state: AppState) => getCurrentApplication(state)?.userPermissions ?? [],
@@ -43,6 +61,11 @@ const PagesSection = () => {
to: { opacity: 1, height: "100%" },
}));
+ const hasExportPermission = isPermitted(
+ userAppPermissions ?? [],
+ PERMISSION_TYPE.EXPORT_APPLICATION,
+ );
+
const canCreatePages = getHasCreatePagePermission(
isFeatureEnabled,
userAppPermissions,
@@ -52,6 +75,29 @@ const PagesSection = () => {
api.start();
}, []);
+ const switchPage = useCallback(
+ (page: Page) => {
+ const navigateToUrl =
+ currentPageId === page.pageId
+ ? widgetListURL({})
+ : builderURL({
+ pageId: page.pageId,
+ });
+ AnalyticsUtil.logEvent("PAGE_NAME_CLICK", {
+ name: page.pageName,
+ fromUrl: location.pathname,
+ type: "PAGES",
+ toUrl: navigateToUrl,
+ });
+ dispatch(toggleInOnboardingWidgetSelection(true));
+ dispatch(setIdeEditorPagesActiveStatus(false));
+ history.push(navigateToUrl, {
+ invokedBy: NavigationMethod.EntityExplorer,
+ });
+ },
+ [location.pathname, currentPageId],
+ );
+
const createPageCallback = useCallback(() => {
const name = getNextEntityName(
"Page",
@@ -72,8 +118,53 @@ const PagesSection = () => {
const onMenuClose = useCallback(() => setIsMenuOpen(false), [setIsMenuOpen]);
const pageElements = useMemo(
- () => pages.map((page) => ),
- [pages, location.pathname],
+ () =>
+ pages.map((page) => {
+ const icon = page.isDefault ? defaultPageIcon : pageIcon;
+ const isCurrentPage = currentPageId === page.pageId;
+ const pagePermissions = page.userPermissions;
+ const canManagePages = getHasManagePagePermission(
+ isFeatureEnabled,
+ pagePermissions,
+ );
+
+ const contextMenu = (
+
+ );
+
+ return (
+ switchPage(page)}
+ active={isCurrentPage}
+ canEditEntityName={canManagePages}
+ className={`page fullWidth ${isCurrentPage && "activePage"}`}
+ contextMenu={contextMenu}
+ disabled={page.isHidden}
+ entityId={page.pageId}
+ icon={icon}
+ isDefaultExpanded={isCurrentPage}
+ key={page.pageId}
+ name={page.pageName}
+ onNameEdit={resolveAsSpaceChar}
+ searchKeyword={""}
+ step={1}
+ updateEntityName={(id, name) =>
+ updatePage({ id, name, isHidden: !!page.isHidden })
+ }
+ />
+ );
+ }),
+ [pages, currentPageId, applicationId, location.pathname],
);
return (
diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/PageElement.tsx b/app/client/src/pages/Editor/IDE/EditorPane/components/PageElement.tsx
deleted file mode 100644
index c9ef7def2d..0000000000
--- a/app/client/src/pages/Editor/IDE/EditorPane/components/PageElement.tsx
+++ /dev/null
@@ -1,108 +0,0 @@
-import React, { useCallback } from "react";
-import { useDispatch, useSelector } from "react-redux";
-import { useLocation } from "react-router";
-
-import type { Page } from "@appsmith/constants/ReduxActionConstants";
-import { defaultPageIcon, pageIcon } from "pages/Editor/Explorer/ExplorerIcons";
-import { getCurrentPageId } from "@appsmith/selectors/entitiesSelector";
-import { getHasManagePagePermission } from "@appsmith/utils/BusinessFeatures/permissionPageHelpers";
-import { useFeatureFlag } from "utils/hooks/useFeatureFlag";
-import { FEATURE_FLAG } from "@appsmith/entities/FeatureFlag";
-import PageContextMenu from "pages/Editor/Explorer/Pages/PageContextMenu";
-import { getCurrentApplicationId } from "selectors/editorSelectors";
-import { EntityClassNames } from "pages/Editor/Explorer/Entity";
-import {
- PERMISSION_TYPE,
- isPermitted,
-} from "@appsmith/utils/permissionHelpers";
-import { getCurrentApplication } from "@appsmith/selectors/applicationSelectors";
-import type { AppState } from "@appsmith/reducers";
-import { StyledEntity } from "pages/Editor/Explorer/Common/components";
-import { resolveAsSpaceChar } from "utils/helpers";
-import { updatePage } from "actions/pageActions";
-import { useGetPageFocusUrl } from "pages/Editor/IDE/hooks";
-import AnalyticsUtil from "utils/AnalyticsUtil";
-import { toggleInOnboardingWidgetSelection } from "actions/onboardingActions";
-import { setIdeEditorPagesActiveStatus } from "actions/ideActions";
-import history, { NavigationMethod } from "utils/history";
-
-const PageElement = ({ page }: { page: Page }) => {
- const dispatch = useDispatch();
- const location = useLocation();
- const navigateToUrl = useGetPageFocusUrl(page.pageId);
-
- const currentPageId = useSelector(getCurrentPageId);
- const isFeatureEnabled = useFeatureFlag(FEATURE_FLAG.license_gac_enabled);
- const applicationId = useSelector(getCurrentApplicationId);
- const userAppPermissions = useSelector(
- (state: AppState) => getCurrentApplication(state)?.userPermissions ?? [],
- );
-
- const icon = page.isDefault ? defaultPageIcon : pageIcon;
- const isCurrentPage = currentPageId === page.pageId;
- const pagePermissions = page.userPermissions;
-
- const canManagePages = getHasManagePagePermission(
- isFeatureEnabled,
- pagePermissions,
- );
- const hasExportPermission = isPermitted(
- userAppPermissions ?? [],
- PERMISSION_TYPE.EXPORT_APPLICATION,
- );
-
- const switchPage = useCallback(
- (page: Page) => {
- AnalyticsUtil.logEvent("PAGE_NAME_CLICK", {
- name: page.pageName,
- fromUrl: location.pathname,
- type: "PAGES",
- toUrl: navigateToUrl,
- });
- dispatch(toggleInOnboardingWidgetSelection(true));
- dispatch(setIdeEditorPagesActiveStatus(false));
- history.push(navigateToUrl, {
- invokedBy: NavigationMethod.EntityExplorer,
- });
- },
- [location.pathname, currentPageId, navigateToUrl],
- );
-
- const contextMenu = (
-
- );
-
- return (
- switchPage(page)}
- active={isCurrentPage}
- canEditEntityName={canManagePages}
- className={`page fullWidth ${isCurrentPage && "activePage"}`}
- contextMenu={contextMenu}
- disabled={page.isHidden}
- entityId={page.pageId}
- icon={icon}
- isDefaultExpanded={isCurrentPage}
- key={page.pageId}
- name={page.pageName}
- onNameEdit={resolveAsSpaceChar}
- searchKeyword={""}
- step={1}
- updateEntityName={(id, name) =>
- updatePage({ id, name, isHidden: !!page.isHidden })
- }
- />
- );
-};
-
-export { PageElement };
diff --git a/app/client/src/pages/Editor/IDE/hooks.ts b/app/client/src/pages/Editor/IDE/hooks.ts
index 96d3edadf5..e904fd6d11 100644
--- a/app/client/src/pages/Editor/IDE/hooks.ts
+++ b/app/client/src/pages/Editor/IDE/hooks.ts
@@ -13,16 +13,11 @@ import { getPropertyPaneWidth } from "selectors/propertyPaneSelectors";
import { getCurrentPageId } from "@appsmith/selectors/entitiesSelector";
import history, { NavigationMethod } from "utils/history";
import {
- builderURL,
jsCollectionListURL,
queryListURL,
widgetListURL,
} from "@appsmith/RouteBuilder";
import { DEFAULT_EDITOR_PANE_WIDTH } from "constants/AppConstants";
-import isEmpty from "lodash/isEmpty";
-import pickBy from "lodash/pickBy";
-import { getFocusInfo } from "selectors/focusHistorySelectors";
-import { getCurrentGitBranch } from "selectors/gitSyncSelectors";
export const useCurrentAppState = () => {
const [appState, setAppState] = useState(EditorState.EDITOR);
@@ -159,42 +154,3 @@ export const useSegmentNavigation = (): {
return { onSegmentChange };
};
-
-export const useGetPageFocusUrl = (pageId: string): string => {
- const editorStateString = "EDITOR_STATE.";
- const focusInfo = useSelector(getFocusInfo);
- const branch = useSelector(getCurrentGitBranch);
- const [focusPageUrl, setFocusPageUrl] = useState(
- builderURL({ pageId: pageId }),
- );
-
- useEffect(() => {
- const editorState = pickBy(
- focusInfo,
- (v, k) =>
- k === editorStateString + pageId + "#" + (branch || "undefined"),
- );
-
- if (isEmpty(editorState)) {
- return;
- }
-
- const segment =
- Object.values(editorState)[0].state?.SelectedSegment ||
- EditorEntityTab.UI;
-
- switch (segment) {
- case EditorEntityTab.UI:
- setFocusPageUrl(widgetListURL({ pageId: pageId }));
- break;
- case EditorEntityTab.JS:
- setFocusPageUrl(jsCollectionListURL({ pageId: pageId }));
- break;
- case EditorEntityTab.QUERIES:
- setFocusPageUrl(queryListURL({ pageId: pageId }));
- break;
- }
- }, [focusInfo, branch]);
-
- return focusPageUrl;
-};