From cd519bb8a963cc66401a6ee5b2830ac429538f28 Mon Sep 17 00:00:00 2001 From: Sagar Khalasi Date: Mon, 17 Feb 2025 12:52:38 +0530 Subject: [PATCH 01/35] fix: Fix from for promise failure (#39295) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Description > [!TIP] > _Add a TL;DR when the description is longer than 500 words or extremely technical (helps the content, marketing, and DevRel team)._ > > _Please also include relevant motivation and context. List any dependencies that are required for this change. Add links to Notion, Figma or any other documents that might be relevant to the PR._ Fixes #`Issue Number` _or_ Fixes `Issue URL` > [!WARNING] > _If no issue exists, please create an issue first, and check with the maintainers if the issue is valid._ ## Automation /ok-to-test tags="@tag.AppUrl" ### :mag: Cypress test results > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: > Commit: 0701248cbd6cd53a9777f00933cc56fb45abcfcf > Cypress dashboard. > Tags: `@tag.AppUrl` > Spec: >
Mon, 17 Feb 2025 05:49:10 UTC ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No ## Summary by CodeRabbit ## Summary by CodeRabbit - **Tests** - Streamlined redirection tests by removing an unnecessary sign out step. - Enhanced URL validation with improved logging to ensure correct encoding. - Refined the testing process to robustly verify that redirection parameters are accurately passed. --- .../OtherUIFeatures/ApplicationURL_spec.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/app/client/cypress/e2e/Regression/ClientSide/OtherUIFeatures/ApplicationURL_spec.js b/app/client/cypress/e2e/Regression/ClientSide/OtherUIFeatures/ApplicationURL_spec.js index c0abbd8e1dce..ffa6ccfaee53 100644 --- a/app/client/cypress/e2e/Regression/ClientSide/OtherUIFeatures/ApplicationURL_spec.js +++ b/app/client/cypress/e2e/Regression/ClientSide/OtherUIFeatures/ApplicationURL_spec.js @@ -144,10 +144,19 @@ describe("Slug URLs", { tags: ["@tag.AppUrl"] }, () => { it("4. Checks redirect url", () => { cy.url().then((url) => { - homePage.Signout(true); const redirectUrl = `${url}?embed=true&a=b`; + cy.stub(agHelper, "VisitNAssert").as("visitStub"); + + // Call your function that handles redirection agHelper.VisitNAssert(redirectUrl); - agHelper.AssertURL(`?redirectUrl=${encodeURIComponent(redirectUrl)}`); + + // Assert that the stubbed function was called with the correct redirectUrl + cy.get("@visitStub").should("have.been.calledWith", redirectUrl); + cy.wrap(redirectUrl).then((redirectUrl) => { + const encodedRedirectUrl = `?redirectUrl=${encodeURIComponent(redirectUrl)}`; + cy.log(encodedRedirectUrl); + agHelper.AssertURL(encodedRedirectUrl); + }); }); }); }); From 22688f994f4a7f068a2a322e792313c4af14dac5 Mon Sep 17 00:00:00 2001 From: Hetu Nandu Date: Mon, 17 Feb 2025 13:04:23 +0530 Subject: [PATCH 02/35] chore: AppIDE Folder Structure (#39165) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Description Updates the folder structure and file breakup according to the new IDE folder structure Fixes #39048 Fixes #39049 Fixes #39051 ## Automation /ok-to-test tags="@tag.All" ### :mag: Cypress test results > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: > Commit: 54cd1a3b4679ae8bd0687ddb063692a26be1d7b9 > Cypress dashboard. > Tags: `@tag.All` > Spec: >
Sun, 16 Feb 2025 08:44:30 UTC ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No --- .../Widgets/Audio/AudioRecorder1_spec.ts | 6 +- app/client/public/index.html | 2 +- .../Components}/EntityContextMenu.tsx | 0 .../Components}/PaneHeader.tsx | 0 .../Components}/SectionHeader.tsx | 4 +- .../Components}/SegmentAddHeader.tsx | 0 .../IDE/Interfaces/GroupedAddOperations.ts | 7 + app/client/src/IDE/hooks/index.ts | 1 + .../IDE/hooks/useCurrentAppState.ts | 2 +- .../src/IDE/hooks/useIsInSideBySideEditor.ts | 10 +- .../hooks/useNameEditorState.ts | 10 +- .../src/IDE/utils/getCurrentEntityInfo.ts | 66 +++++ .../src/IDE/utils/isInSideBySideEditor.ts | 21 ++ app/client/src/ce/AppRouter.tsx | 8 +- app/client/src/ce/navigation/FocusSetters.ts | 2 +- .../components/JSAdd}/getJSUrl.test.ts | 0 .../components/JSAdd}/getJSUrl.ts | 0 .../pages/AppIDE/components/JSAdd/hooks.tsx | 22 ++ .../JSAdd}/useGroupAddJsOperations.test.ts | 2 +- .../components/JSListItem}/ListItem.tsx | 2 +- .../components/JSListItem}/old/ListItem.tsx | 0 .../LibrariesList}/LibrarySidePane.tsx | 2 +- .../components/MissingModuleNotification.tsx | 7 + .../components/QueryAdd}/getQueryUrl.test.ts | 0 .../components/QueryAdd}/getQueryUrl.ts | 0 .../useGroupedAddQueryOperations.tsx} | 246 +++++------------- .../components/QueryEntityItem}/ListItem.tsx | 2 +- .../QueryEntityItem}/old/ListItem.tsx | 0 .../constants/SidebarButtons.ts | 0 .../Header/useLibraryHeaderTitle.ts | 0 .../EditorPane => AppIDE/layout}/constants.ts | 0 .../layout/routers/JSEditor/constants.ts | 28 ++ .../layout/routers/MainPane/constants.ts | 103 ++++++++ .../layout/routers/QueryEditor/constants.ts | 43 +++ .../routers}/utils/getJSEntityItemUrl.test.ts | 0 .../routers}/utils/getJSEntityItemUrl.ts | 0 .../utils/getQueryEntityItemUrl.test.ts | 0 .../routers}/utils/getQueryEntityItemUrl.ts | 0 .../pages/Editor/IDE/EditorPane/JS/hooks.tsx | 156 ----------- .../JS/utils/getJSContextMenuByIdeType.tsx | 20 -- .../utils/getQueryContextMenuByIdeType.tsx | 20 -- .../MainPane/useMissingModuleNotification.tsx | 5 - .../pages/Editor/IDE/MainPane/useRoutes.tsx | 143 ---------- app/client/src/ce/pages/common/AppHeader.tsx | 2 +- .../src/ce/selectors/appIDESelectors.ts | 2 +- .../pages/AppIDE/components/JSAdd/getJSUrl.ts | 1 + .../pages/AppIDE/components/JSAdd/hooks.tsx | 1 + .../AppIDE/components/JSListItem/ListItem.tsx | 1 + .../components/JSListItem/old/ListItem.tsx | 1 + .../LibrariesList/LibrarySidePane.tsx | 1 + .../components/MissingModuleNotification.tsx | 1 + .../AppIDE/components/QueryAdd/getQueryUrl.ts | 1 + .../QueryAdd/useGroupedAddQueryOperations.tsx | 1 + .../components/QueryEntityItem/ListItem.tsx | 1 + .../QueryEntityItem/old/ListItem.tsx | 1 + .../pages/AppIDE/constants/SidebarButtons.ts | 1 + .../Header/useLibraryHeaderTitle.ts | 4 + .../src/ee/pages/AppIDE/layouts/constants.ts | 1 + .../layouts/routers/JSEditor/constants.ts | 1 + .../layouts/routers/MainPane/constants.ts | 1 + .../layouts/routers/QueryEditor/constants.ts | 1 + .../routers/utils/getJSEntityItemUrl.ts | 1 + .../routers/utils/getQueryEntityItemUrl.ts | 1 + .../Editor/IDE/EditorPane/JS/ListItem.tsx | 1 - .../pages/Editor/IDE/EditorPane/JS/hooks.ts | 1 - .../Editor/IDE/EditorPane/JS/old/ListItem.tsx | 1 - .../JS/utils/getJSContextMenuByIdeType.tsx | 1 - .../EditorPane/JS/utils/getJSEntityItemUrl.ts | 1 - .../IDE/EditorPane/JS/utils/getJSUrl.ts | 1 - .../Editor/IDE/EditorPane/Query/ListItem.tsx | 1 - .../Editor/IDE/EditorPane/Query/hooks.ts | 1 - .../IDE/EditorPane/Query/old/ListItem.tsx | 1 - .../utils/getQueryContextMenuByIdeType.ts | 1 - .../Query/utils/getQueryEntityItemUrl.ts | 1 - .../IDE/EditorPane/Query/utils/getQueryUrl.ts | 1 - .../pages/Editor/IDE/EditorPane/constants.ts | 1 - .../IDE/Header/useLibraryHeaderTitle.ts | 3 - .../Editor/IDE/LeftPane/LibrarySidePane.tsx | 3 - .../MainPane/useMissingModuleNotification.tsx | 3 - .../ee/pages/Editor/IDE/MainPane/useRoutes.ts | 3 - .../Editor/IDE/constants/SidebarButtons.ts | 1 - .../dropTarget/OnBoarding/OnBoarding.test.tsx | 9 +- .../{Editor/index.tsx => AppIDE/AppIDE.tsx} | 42 +-- .../loader.tsx => AppIDE/AppIDELoader.tsx} | 40 ++- .../components/AppPluginActionToolbar.tsx | 0 .../ContextMenuItems/ConvertToModule.tsx | 0 .../components/ContextMenuItems/Copy.tsx | 0 .../components/ContextMenuItems/Delete.tsx | 0 .../components/ContextMenuItems/Move.tsx | 0 .../ContextMenuItems/PageMenuItem.tsx | 0 .../components/ContextMenuItems/Rename.tsx | 0 .../ContextMenuItems/ShowBindings.tsx | 0 .../components/ContextMenuItems/index.ts | 0 .../ConvertToModuleCallout.tsx | 0 .../ConvertToModuleDisabler.tsx | 0 .../components/ConvertToModule/index.tsx | 0 .../components/ToolbarMenu/ToolbarMenu.tsx | 0 .../components/ToolbarMenu/index.ts | 0 .../AppPluginActionEditor/index.tsx | 0 .../AppPluginActionEditor/loader.tsx | 20 ++ .../components/AppSettings/AppSettings.tsx} | 18 +- .../components}/DraggablePageList.tsx | 0 .../EmbedSettings/MakeApplicationForkable.tsx | 0 .../components}/EmbedSettings/index.tsx | 0 .../components}/GeneralSettings.tsx | 2 +- .../components}/ImportAppSettings.tsx | 0 .../NavigationSettings/ButtonGroupSetting.tsx | 2 +- .../NavigationSettings/ColorStyleIcon.tsx | 0 .../NavigationSettings/ImageInput.tsx | 0 .../NavigationSettings/LogoInput.tsx | 6 +- .../StyledPropertyHelpLabel.tsx | 0 .../NavigationSettings/SwitchSetting.tsx | 2 +- .../SwitchSettingForLogoConfiguration.tsx | 2 +- .../components}/NavigationSettings/index.tsx | 13 +- .../components}/NavigationSettings/utils.ts | 0 .../AppSettings/components}/PageSettings.tsx | 4 +- .../components}/TextLoaderIcon.tsx | 0 .../components/AppSettings/index.tsx} | 5 +- .../AppIDE/components/AppSettings/types.ts | 11 + .../components/AppSettings/utils.ts} | 0 .../src/pages/AppIDE/components/GitModals.tsx | 30 +++ .../components/JSAdd/JSAddView.tsx} | 15 +- .../pages/AppIDE/components/JSAdd/index.ts | 1 + .../pages/AppIDE/components/JSAdd/loader.tsx | 19 ++ .../components/JSAdd/useJSAdd.test.tsx} | 4 +- .../pages/AppIDE/components/JSAdd/useJSAdd.ts | 54 ++++ .../JSEntityItem}/AppJSContextMenuItems.tsx | 0 .../components/JSEntityItem}/JSEntityItem.tsx | 14 +- .../AppIDE/components/JSEntityItem/index.ts | 1 + .../components/JSExplorer}/BlankState.tsx | 2 +- .../components/JSExplorer}/Explorer.tsx | 4 +- .../components/JSExplorer/JSSegmentList.tsx} | 10 +- .../AppIDE/components/JSExplorer/index.tsx | 2 + .../LibrariesList}/AddLibraryPopover.tsx | 2 +- .../LibrariesList}/JSLibrariesSection.tsx | 4 +- .../PageList}/AddPageContextMenu.tsx | 0 .../components/PageList}/PageContextMenu.tsx | 0 .../components/PageList}/PageElement.tsx | 2 +- .../components/PageList}/PagesSection.tsx | 0 .../hooks/useGetPageFocusUrl.test.tsx} | 4 +- .../PageList/hooks/useGetPageFocusUrl.ts | 31 +++ .../components/PropertyPaneWrapper.tsx | 2 +- .../ProtectedCallout.test.tsx | 12 +- .../ProtectedCallout}/ProtectedCallout.tsx | 4 +- .../components/ProtectedCallout/index.ts | 1 + .../QueryAdd}/CreateNewQueryModal.tsx | 2 +- .../components/QueryAdd/QueryAddView.tsx} | 8 +- .../pages/AppIDE/components/QueryAdd/index.ts | 1 + .../AppIDE/components/QueryAdd/loader.tsx | 19 ++ .../components/QueryAdd/useQueryAdd.tsx | 38 +++ .../AppQueryContextMenuItems.tsx | 2 +- .../QueryEntityItem}/QueryEntityItem.tsx | 14 +- .../components/QueryEntityItem/index.ts | 1 + .../components/QueryExplorer}/BlankState.tsx | 2 +- .../components/QueryExplorer}/Explorer.tsx | 4 +- .../components/QueryExplorer}/List.tsx | 10 +- .../components/QueryExplorer}/index.tsx | 2 +- .../UIEntityListTree/UIEntityListTree.tsx | 2 +- .../UIEntityListTree/WidgetContextMenu.tsx | 0 .../UIEntityListTree/WidgetTypeIcon.tsx | 0 .../UIEntityListTree/hooks/useDeleteWidget.ts | 0 .../hooks/useSwitchToWidget.ts | 0 .../hooks/useWidgetTreeExpandedState.ts | 0 .../components}/UIEntityListTree/index.ts | 0 .../UIEntityListTree/utils/enhanceTree.ts | 0 .../components/UIList/UIList.test.tsx} | 2 +- .../components/UIList/UIList.tsx} | 2 +- .../components/WidgetAdd.tsx} | 2 +- .../utils.ts => AppIDE/constants.ts} | 2 + .../AppIDE/hooks/useCurrentEditorState.ts | 35 +++ app/client/src/pages/AppIDE/index.ts | 1 + .../layout}/AnimatedLayout.tsx | 15 +- .../Layout => AppIDE/layout}/StaticLayout.tsx | 21 +- .../layout/components}/Editor.tsx | 11 +- .../layout/components/EditorPane.tsx} | 0 .../layout/components}/EditorTabs/AddTab.tsx | 2 +- .../components}/EditorTabs/EditableTab.tsx | 2 +- .../EditorTabs/Editortabs.test.tsx | 2 +- .../layout/components}/EditorTabs/List.tsx | 6 +- .../EditorTabs/ScreenModeToggle.tsx | 0 .../components}/EditorTabs/constants.ts | 4 +- .../layout/components/EditorTabs/hooks.ts | 96 +++++++ .../layout/components}/EditorTabs/index.tsx | 9 +- .../layout/components}/Explorer.tsx | 12 +- .../components}/Header/DeployButton.tsx | 0 .../layout/components}/Header/EditorTitle.tsx | 2 +- .../layout/components}/Header/index.tsx | 6 +- .../SegmentSwitcher}/SegmentSwitcher.tsx | 3 +- .../SegmentSwitcher/useSegmentNavigation.ts | 46 ++++ .../IDE/Layout => AppIDE/layout}/constants.ts | 0 .../hooks/useEditorStateLeftPaneWidth.ts | 2 +- .../layout}/hooks/useGridLayoutTemplate.ts | 4 +- .../hooks/useWidgetSelectionBlockListener.ts | 45 ++++ .../{Editor/IDE => AppIDE/layout}/index.tsx | 4 +- .../layout/routers/JSEditor/JSEditor.tsx} | 4 +- .../routers/JSEditor}/JSRender.test.tsx | 2 +- .../AppIDE/layout/routers/JSEditor/index.ts | 1 + .../layout/routers/LeftPane.tsx} | 26 +- .../layout/routers/MainPane/MainPane.tsx | 39 +++ .../AppIDE/layout/routers/MainPane/index.ts | 1 + .../layout/routers/QueryEditor}/Editor.tsx | 4 +- .../routers/QueryEditor}/QueryRender.test.tsx | 2 +- .../layout/routers/QueryEditor/index.ts | 1 + .../layout/routers/RightPane.tsx} | 2 +- .../IDE => AppIDE/layout/routers}/Sidebar.tsx | 4 +- .../UISegmentLeftPane}/UIRender.test.tsx | 2 +- .../UISegmentLeftPane/UISegmentLeftPane.tsx} | 4 +- .../hooks/useShowSnapShotBanner.ts | 2 +- .../CreateDatasourceButton.tsx} | 38 ++- .../DataSidePane.test.tsx | 2 +- .../DataSidePane.tsx | 10 +- .../src/pages/Editor/DataSidePane/index.ts | 1 + .../Explorer/Widgets/WidgetContextMenu.tsx | 2 +- .../Editor/FirstTimeUserOnboarding/loader.ts | 11 + .../GlobalHotKeys/GlobalHotKeys.test.tsx | 4 +- .../pages/Editor/IDE/EditorPane/JS/index.tsx | 2 - .../Editor/IDE/EditorPane/components/types.ts | 7 - .../pages/Editor/IDE/EditorPane/constants.ts | 1 - .../src/pages/Editor/IDE/Layout/index.ts | 2 - .../src/pages/Editor/IDE/MainPane/index.tsx | 30 --- app/client/src/pages/Editor/IDE/constants.ts | 1 - app/client/src/pages/Editor/IDE/hooks.ts | 225 ---------------- .../JSEditor/AppJSEditorContextMenu.tsx | 2 +- .../src/pages/Editor/JSEditor/index.tsx | 15 +- .../src/pages/Editor/JSEditor/loader.tsx | 19 ++ .../pages/Editor/ThemePropertyPane/index.tsx | 2 +- .../CanvasInteractions.test.tsx} | 2 +- .../WidgetsEditor/WidgetEditorContainer.tsx | 2 +- .../WidgetsEditor/WidgetEditorHeader.tsx | 7 +- .../components/CodeModeTooltip.tsx | 2 +- .../LayoutSystemBasedPageViewer.tsx | 2 +- .../NavigationAdjustedPageViewer.tsx | 2 +- .../components/NavigationPreview.tsx | 2 +- .../components/WidgetEditorNavigation.tsx | 2 +- .../commons/EditorSettingsPaneContainer.tsx | 2 +- .../Editor/commons/EditorWrapperContainer.tsx | 2 +- app/client/src/pages/Editor/utils.tsx | 92 +------ .../uiReducers/appSettingsPaneReducer.ts | 2 +- app/client/src/sagas/AnalyticsSaga.ts | 3 +- app/client/src/sagas/IDESaga.tsx | 4 +- .../selectors/appSettingsPaneSelectors.tsx | 2 +- app/client/src/selectors/jsPaneSelectors.ts | 2 +- .../src/utils/hooks/useHoverToFocusWidget.ts | 2 +- app/client/test/testMockedWidgets.tsx | 3 +- 244 files changed, 1190 insertions(+), 1239 deletions(-) rename app/client/src/{pages/Editor/IDE/EditorPane/components => IDE/Components}/EntityContextMenu.tsx (100%) rename app/client/src/{pages/Editor/IDE/LeftPane => IDE/Components}/PaneHeader.tsx (100%) rename app/client/src/{pages/Editor/AppSettingsPane/AppSettings => IDE/Components}/SectionHeader.tsx (93%) rename app/client/src/{pages/Editor/IDE/EditorPane/components => IDE/Components}/SegmentAddHeader.tsx (100%) create mode 100644 app/client/src/IDE/Interfaces/GroupedAddOperations.ts rename app/client/src/{pages/Editor => }/IDE/hooks/useCurrentAppState.ts (91%) rename app/client/src/{pages/Editor/IDE/EditorPane => IDE}/hooks/useNameEditorState.ts (75%) create mode 100644 app/client/src/IDE/utils/getCurrentEntityInfo.ts create mode 100644 app/client/src/IDE/utils/isInSideBySideEditor.ts rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS/utils => AppIDE/components/JSAdd}/getJSUrl.test.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS/utils => AppIDE/components/JSAdd}/getJSUrl.ts (100%) create mode 100644 app/client/src/ce/pages/AppIDE/components/JSAdd/hooks.tsx rename app/client/src/ce/pages/{Editor/IDE/EditorPane/__tests__/JS => AppIDE/components/JSAdd}/useGroupAddJsOperations.test.ts (91%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS => AppIDE/components/JSListItem}/ListItem.tsx (68%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS => AppIDE/components/JSListItem}/old/ListItem.tsx (100%) rename app/client/src/ce/pages/{Editor/IDE/LeftPane => AppIDE/components/LibrariesList}/LibrarySidePane.tsx (72%) create mode 100644 app/client/src/ce/pages/AppIDE/components/MissingModuleNotification.tsx rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query/utils => AppIDE/components/QueryAdd}/getQueryUrl.test.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query/utils => AppIDE/components/QueryAdd}/getQueryUrl.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query/hooks.tsx => AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx} (51%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryEntityItem}/ListItem.tsx (67%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryEntityItem}/old/ListItem.tsx (100%) rename app/client/src/ce/pages/{Editor/IDE => AppIDE}/constants/SidebarButtons.ts (100%) rename app/client/src/ce/pages/{Editor/IDE => AppIDE/layout/components}/Header/useLibraryHeaderTitle.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane => AppIDE/layout}/constants.ts (100%) create mode 100644 app/client/src/ce/pages/AppIDE/layout/routers/JSEditor/constants.ts create mode 100644 app/client/src/ce/pages/AppIDE/layout/routers/MainPane/constants.ts create mode 100644 app/client/src/ce/pages/AppIDE/layout/routers/QueryEditor/constants.ts rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS => AppIDE/layout/routers}/utils/getJSEntityItemUrl.test.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/JS => AppIDE/layout/routers}/utils/getJSEntityItemUrl.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query => AppIDE/layout/routers}/utils/getQueryEntityItemUrl.test.ts (100%) rename app/client/src/ce/pages/{Editor/IDE/EditorPane/Query => AppIDE/layout/routers}/utils/getQueryEntityItemUrl.ts (100%) delete mode 100644 app/client/src/ce/pages/Editor/IDE/EditorPane/JS/hooks.tsx delete mode 100644 app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx delete mode 100644 app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.tsx delete mode 100644 app/client/src/ce/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx delete mode 100644 app/client/src/ce/pages/Editor/IDE/MainPane/useRoutes.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/JSAdd/getJSUrl.ts create mode 100644 app/client/src/ee/pages/AppIDE/components/JSAdd/hooks.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/JSListItem/ListItem.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/JSListItem/old/ListItem.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/MissingModuleNotification.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/QueryAdd/getQueryUrl.ts create mode 100644 app/client/src/ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/QueryEntityItem/ListItem.tsx create mode 100644 app/client/src/ee/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx create mode 100644 app/client/src/ee/pages/AppIDE/constants/SidebarButtons.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/components/Header/useLibraryHeaderTitle.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/constants.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/routers/JSEditor/constants.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/routers/MainPane/constants.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/routers/QueryEditor/constants.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/routers/utils/getJSEntityItemUrl.ts create mode 100644 app/client/src/ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/ListItem.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/hooks.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/ListItem.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/hooks.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/EditorPane/constants.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx delete mode 100644 app/client/src/ee/pages/Editor/IDE/MainPane/useRoutes.ts delete mode 100644 app/client/src/ee/pages/Editor/IDE/constants/SidebarButtons.ts rename app/client/src/pages/{Editor/index.tsx => AppIDE/AppIDE.tsx} (85%) rename app/client/src/pages/{Editor/loader.tsx => AppIDE/AppIDELoader.tsx} (57%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/AppPluginActionToolbar.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/ConvertToModule.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/Copy.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/Delete.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/Move.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/PageMenuItem.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/Rename.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/ShowBindings.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ContextMenuItems/index.ts (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleCallout.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleDisabler.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ConvertToModule/index.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ToolbarMenu/ToolbarMenu.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/components/ToolbarMenu/index.ts (100%) rename app/client/src/pages/{Editor => AppIDE/components}/AppPluginActionEditor/index.tsx (100%) create mode 100644 app/client/src/pages/AppIDE/components/AppPluginActionEditor/loader.tsx rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings/index.tsx => AppIDE/components/AppSettings/AppSettings.tsx} (94%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/DraggablePageList.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/EmbedSettings/MakeApplicationForkable.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/EmbedSettings/index.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/GeneralSettings.tsx (98%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/ImportAppSettings.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/ButtonGroupSetting.tsx (96%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/ColorStyleIcon.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/ImageInput.tsx (100%) rename app/client/src/pages/{Editor => AppIDE/components/AppSettings/components}/NavigationSettings/LogoInput.tsx (90%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/StyledPropertyHelpLabel.tsx (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/SwitchSetting.tsx (96%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/SwitchSettingForLogoConfiguration.tsx (95%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/index.tsx (97%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/NavigationSettings/utils.ts (100%) rename app/client/src/pages/{Editor/AppSettingsPane/AppSettings => AppIDE/components/AppSettings/components}/PageSettings.tsx (99%) rename app/client/src/pages/{Editor/AppSettingsPane/Components => AppIDE/components/AppSettings/components}/TextLoaderIcon.tsx (100%) rename app/client/src/pages/{Editor/IDE/LeftPane/AppSettings.tsx => AppIDE/components/AppSettings/index.tsx} (76%) create mode 100644 app/client/src/pages/AppIDE/components/AppSettings/types.ts rename app/client/src/pages/{Editor/AppSettingsPane/Utils.ts => AppIDE/components/AppSettings/utils.ts} (100%) create mode 100644 app/client/src/pages/AppIDE/components/GitModals.tsx rename app/client/src/pages/{Editor/IDE/EditorPane/JS/Add.tsx => AppIDE/components/JSAdd/JSAddView.tsx} (91%) create mode 100644 app/client/src/pages/AppIDE/components/JSAdd/index.ts create mode 100644 app/client/src/pages/AppIDE/components/JSAdd/loader.tsx rename app/client/src/{ce/pages/Editor/IDE/EditorPane/__tests__/JS/JSSegment.test.tsx => pages/AppIDE/components/JSAdd/useJSAdd.test.tsx} (96%) create mode 100644 app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.ts rename app/client/src/pages/{Editor/IDE/EditorPane/JS/EntityItem => AppIDE/components/JSEntityItem}/AppJSContextMenuItems.tsx (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/JS/EntityItem => AppIDE/components/JSEntityItem}/JSEntityItem.tsx (90%) create mode 100644 app/client/src/pages/AppIDE/components/JSEntityItem/index.ts rename app/client/src/pages/{Editor/IDE/EditorPane/JS => AppIDE/components/JSExplorer}/BlankState.tsx (94%) rename app/client/src/pages/{Editor/IDE/EditorPane/JS => AppIDE/components/JSExplorer}/Explorer.tsx (82%) rename app/client/src/pages/{Editor/IDE/EditorPane/JS/List.tsx => AppIDE/components/JSExplorer/JSSegmentList.tsx} (94%) create mode 100644 app/client/src/pages/AppIDE/components/JSExplorer/index.tsx rename app/client/src/pages/{Editor/IDE/LeftPane => AppIDE/components/LibrariesList}/AddLibraryPopover.tsx (95%) rename app/client/src/pages/{Editor/IDE/LeftPane => AppIDE/components/LibrariesList}/JSLibrariesSection.tsx (86%) rename app/client/src/pages/{Editor/IDE/EditorPane/Pages => AppIDE/components/PageList}/AddPageContextMenu.tsx (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/Pages => AppIDE/components/PageList}/PageContextMenu.tsx (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/Pages => AppIDE/components/PageList}/PageElement.tsx (98%) rename app/client/src/pages/{Editor/IDE/EditorPane/Pages => AppIDE/components/PageList}/PagesSection.tsx (100%) rename app/client/src/pages/{Editor/IDE/hooks.test.tsx => AppIDE/components/PageList/hooks/useGetPageFocusUrl.test.tsx} (96%) create mode 100644 app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.ts rename app/client/src/pages/{Editor/WidgetsEditor => AppIDE}/components/PropertyPaneWrapper.tsx (82%) rename app/client/src/pages/{Editor/IDE => AppIDE/components/ProtectedCallout}/ProtectedCallout.test.tsx (86%) rename app/client/src/pages/{Editor/IDE => AppIDE/components/ProtectedCallout}/ProtectedCallout.tsx (97%) create mode 100644 app/client/src/pages/AppIDE/components/ProtectedCallout/index.ts rename app/client/src/pages/{Editor/IDE/RightPane/components => AppIDE/components/QueryAdd}/CreateNewQueryModal.tsx (92%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query/Add.tsx => AppIDE/components/QueryAdd/QueryAddView.tsx} (90%) create mode 100644 app/client/src/pages/AppIDE/components/QueryAdd/index.ts create mode 100644 app/client/src/pages/AppIDE/components/QueryAdd/loader.tsx create mode 100644 app/client/src/pages/AppIDE/components/QueryAdd/useQueryAdd.tsx rename app/client/src/pages/{Editor/IDE/EditorPane/Query/EntityItem => AppIDE/components/QueryEntityItem}/AppQueryContextMenuItems.tsx (95%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query/EntityItem => AppIDE/components/QueryEntityItem}/QueryEntityItem.tsx (91%) create mode 100644 app/client/src/pages/AppIDE/components/QueryEntityItem/index.ts rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryExplorer}/BlankState.tsx (94%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryExplorer}/Explorer.tsx (93%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryExplorer}/List.tsx (93%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/components/QueryExplorer}/index.tsx (52%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/UIEntityListTree.tsx (97%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/WidgetContextMenu.tsx (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/WidgetTypeIcon.tsx (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/hooks/useDeleteWidget.ts (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/hooks/useSwitchToWidget.ts (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/hooks/useWidgetTreeExpandedState.ts (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/index.ts (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/components}/UIEntityListTree/utils/enhanceTree.ts (100%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI/List.test.tsx => AppIDE/components/UIList/UIList.test.tsx} (99%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI/List.tsx => AppIDE/components/UIList/UIList.tsx} (98%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI/Add.tsx => AppIDE/components/WidgetAdd.tsx} (96%) rename app/client/src/pages/{Editor/IDE/EditorPane/utils.ts => AppIDE/constants.ts} (76%) create mode 100644 app/client/src/pages/AppIDE/hooks/useCurrentEditorState.ts create mode 100644 app/client/src/pages/AppIDE/index.ts rename app/client/src/pages/{Editor/IDE/Layout => AppIDE/layout}/AnimatedLayout.tsx (87%) rename app/client/src/pages/{Editor/IDE/Layout => AppIDE/layout}/StaticLayout.tsx (85%) rename app/client/src/pages/{Editor/IDE/EditorPane => AppIDE/layout/components}/Editor.tsx (81%) rename app/client/src/pages/{Editor/IDE/EditorPane/index.tsx => AppIDE/layout/components/EditorPane.tsx} (100%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/AddTab.tsx (93%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/EditableTab.tsx (96%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/Editortabs.test.tsx (99%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/List.tsx (78%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/ScreenModeToggle.tsx (100%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/constants.ts (84%) create mode 100644 app/client/src/pages/AppIDE/layout/components/EditorTabs/hooks.ts rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/EditorTabs/index.tsx (95%) rename app/client/src/pages/{Editor/IDE/EditorPane => AppIDE/layout/components}/Explorer.tsx (82%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/Header/DeployButton.tsx (100%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/Header/EditorTitle.tsx (92%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/components}/Header/index.tsx (97%) rename app/client/src/pages/{Editor/IDE/EditorPane/components => AppIDE/layout/components/SegmentSwitcher}/SegmentSwitcher.tsx (88%) create mode 100644 app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/useSegmentNavigation.ts rename app/client/src/pages/{Editor/IDE/Layout => AppIDE/layout}/constants.ts (100%) rename app/client/src/pages/{Editor/IDE/Layout => AppIDE/layout}/hooks/useEditorStateLeftPaneWidth.ts (95%) rename app/client/src/pages/{Editor/IDE/Layout => AppIDE/layout}/hooks/useGridLayoutTemplate.ts (96%) create mode 100644 app/client/src/pages/AppIDE/layout/hooks/useWidgetSelectionBlockListener.ts rename app/client/src/pages/{Editor/IDE => AppIDE/layout}/index.tsx (87%) rename app/client/src/pages/{Editor/IDE/EditorPane/JS/Editor.tsx => AppIDE/layout/routers/JSEditor/JSEditor.tsx} (78%) rename app/client/src/pages/{Editor/IDE/EditorPane/JS => AppIDE/layout/routers/JSEditor}/JSRender.test.tsx (99%) create mode 100644 app/client/src/pages/AppIDE/layout/routers/JSEditor/index.ts rename app/client/src/pages/{Editor/IDE/LeftPane/index.tsx => AppIDE/layout/routers/LeftPane.tsx} (78%) create mode 100644 app/client/src/pages/AppIDE/layout/routers/MainPane/MainPane.tsx create mode 100644 app/client/src/pages/AppIDE/layout/routers/MainPane/index.ts rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/layout/routers/QueryEditor}/Editor.tsx (78%) rename app/client/src/pages/{Editor/IDE/EditorPane/Query => AppIDE/layout/routers/QueryEditor}/QueryRender.test.tsx (99%) create mode 100644 app/client/src/pages/AppIDE/layout/routers/QueryEditor/index.ts rename app/client/src/pages/{Editor/IDE/RightPane/index.tsx => AppIDE/layout/routers/RightPane.tsx} (88%) rename app/client/src/pages/{Editor/IDE => AppIDE/layout/routers}/Sidebar.tsx (93%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI => AppIDE/layout/routers/UISegmentLeftPane}/UIRender.test.tsx (98%) rename app/client/src/pages/{Editor/IDE/EditorPane/UI/index.tsx => AppIDE/layout/routers/UISegmentLeftPane/UISegmentLeftPane.tsx} (94%) rename app/client/src/pages/Editor/{IDE/LeftPane/CreateDatasourcePopover.tsx => DataSidePane/CreateDatasourceButton.tsx} (61%) rename app/client/src/pages/Editor/{IDE/LeftPane => DataSidePane}/DataSidePane.test.tsx (98%) rename app/client/src/pages/Editor/{IDE/LeftPane => DataSidePane}/DataSidePane.tsx (95%) create mode 100644 app/client/src/pages/Editor/DataSidePane/index.ts create mode 100644 app/client/src/pages/Editor/FirstTimeUserOnboarding/loader.ts delete mode 100644 app/client/src/pages/Editor/IDE/EditorPane/JS/index.tsx delete mode 100644 app/client/src/pages/Editor/IDE/EditorPane/components/types.ts delete mode 100644 app/client/src/pages/Editor/IDE/EditorPane/constants.ts delete mode 100644 app/client/src/pages/Editor/IDE/Layout/index.ts delete mode 100644 app/client/src/pages/Editor/IDE/MainPane/index.tsx delete mode 100644 app/client/src/pages/Editor/IDE/constants.ts delete mode 100644 app/client/src/pages/Editor/IDE/hooks.ts create mode 100644 app/client/src/pages/Editor/JSEditor/loader.tsx rename app/client/src/pages/Editor/{IDE/AppsmithIDE.test.tsx => WidgetsEditor/CanvasInteractions.test.tsx} (99%) diff --git a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Audio/AudioRecorder1_spec.ts b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Audio/AudioRecorder1_spec.ts index 1906771330e9..ad61fcc57a6e 100644 --- a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Audio/AudioRecorder1_spec.ts +++ b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Audio/AudioRecorder1_spec.ts @@ -135,18 +135,18 @@ describe( agHelper.Sleep(1000); propPane.SelectColorFromColorPicker("iconcolor", -15); agHelper.AssertCSS( - widgetLocators.recorderComplete, + widgetLocators.recorderPrompt, "background-color", "rgb(255, 193, 61)", ); propPane.EnterJSContext("Box shadow", "Small"); agHelper - .GetElement(widgetLocators.recorderComplete) + .GetElement(widgetLocators.recorderPrompt) .should("have.css", "box-shadow") .and("not.eq", "none"); propPane.EnterJSContext("Border radius", "none"); agHelper.AssertCSS( - widgetLocators.recorderComplete, + widgetLocators.recorderPrompt, "border-radius", "3px", 0, diff --git a/app/client/public/index.html b/app/client/public/index.html index 3b792978b958..fd1a95acc830 100755 --- a/app/client/public/index.html +++ b/app/client/public/index.html @@ -51,7 +51,7 @@ // 1) Give your import a name (use the `webpackChunkName` comment: `import(/* webpackChunkName: "my-name" */ "./my-file")`) // 2) Add the name into the `chunksToPreload` array below let chunksToPreload = { - 'edit-mode': [...getChunkUrls("editor"), ...getChunkUrls("global-search")], + 'edit-mode': [...getChunkUrls("AppIDE"), ...getChunkUrls("global-search")], 'view-mode': getChunkUrls("AppViewer") }; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/EntityContextMenu.tsx b/app/client/src/IDE/Components/EntityContextMenu.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/components/EntityContextMenu.tsx rename to app/client/src/IDE/Components/EntityContextMenu.tsx diff --git a/app/client/src/pages/Editor/IDE/LeftPane/PaneHeader.tsx b/app/client/src/IDE/Components/PaneHeader.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/LeftPane/PaneHeader.tsx rename to app/client/src/IDE/Components/PaneHeader.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/SectionHeader.tsx b/app/client/src/IDE/Components/SectionHeader.tsx similarity index 93% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/SectionHeader.tsx rename to app/client/src/IDE/Components/SectionHeader.tsx index c48ad80ee14b..b2c1d54fe63b 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/SectionHeader.tsx +++ b/app/client/src/IDE/Components/SectionHeader.tsx @@ -37,7 +37,7 @@ const SubTitle = styled.div` color: var(--ads-v2-color-fg); `; -class SectionHeader extends React.Component { +export class SectionHeader extends React.Component { render(): React.ReactNode { return ( { ); } } - -export default SectionHeader; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentAddHeader.tsx b/app/client/src/IDE/Components/SegmentAddHeader.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/components/SegmentAddHeader.tsx rename to app/client/src/IDE/Components/SegmentAddHeader.tsx diff --git a/app/client/src/IDE/Interfaces/GroupedAddOperations.ts b/app/client/src/IDE/Interfaces/GroupedAddOperations.ts new file mode 100644 index 000000000000..dd82c728ed5d --- /dev/null +++ b/app/client/src/IDE/Interfaces/GroupedAddOperations.ts @@ -0,0 +1,7 @@ +import type { ActionOperation } from "components/editorComponents/GlobalSearch/utils"; + +export type GroupedAddOperations = Array<{ + title?: string; + className: string; + operations: ActionOperation[]; +}>; diff --git a/app/client/src/IDE/hooks/index.ts b/app/client/src/IDE/hooks/index.ts index 8fe85b2a9d84..2ae8c7ef5671 100644 --- a/app/client/src/IDE/hooks/index.ts +++ b/app/client/src/IDE/hooks/index.ts @@ -1,2 +1,3 @@ export { useIsInSideBySideEditor } from "./useIsInSideBySideEditor"; export { useIsEditorInitialised } from "ee/IDE/hooks/useIsEditorInitialised"; +export { useCurrentAppState } from "./useCurrentAppState"; diff --git a/app/client/src/pages/Editor/IDE/hooks/useCurrentAppState.ts b/app/client/src/IDE/hooks/useCurrentAppState.ts similarity index 91% rename from app/client/src/pages/Editor/IDE/hooks/useCurrentAppState.ts rename to app/client/src/IDE/hooks/useCurrentAppState.ts index 9d36e085644a..485d1ee37cc7 100644 --- a/app/client/src/pages/Editor/IDE/hooks/useCurrentAppState.ts +++ b/app/client/src/IDE/hooks/useCurrentAppState.ts @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { EditorState } from "IDE/enums"; +import { EditorState } from "../enums"; import { useLocation } from "react-router"; import { identifyEntityFromPath } from "navigation/FocusEntity"; diff --git a/app/client/src/IDE/hooks/useIsInSideBySideEditor.ts b/app/client/src/IDE/hooks/useIsInSideBySideEditor.ts index 8ceb91ba95a0..b2632c1a80aa 100644 --- a/app/client/src/IDE/hooks/useIsInSideBySideEditor.ts +++ b/app/client/src/IDE/hooks/useIsInSideBySideEditor.ts @@ -1,12 +1,10 @@ import { useSelector } from "react-redux"; import { useLocation } from "react-router"; -import { getIDEViewMode } from "../../selectors/ideSelectors"; -import { identifyEntityFromPath } from "../../navigation/FocusEntity"; -import { - getCurrentEntityInfo, - isInSideBySideEditor, -} from "../../pages/Editor/utils"; +import { getIDEViewMode } from "selectors/ideSelectors"; +import { identifyEntityFromPath } from "navigation/FocusEntity"; +import { isInSideBySideEditor } from "../utils/isInSideBySideEditor"; +import { getCurrentEntityInfo } from "../utils/getCurrentEntityInfo"; /** * Checks if current component is in side-by-side editor mode. diff --git a/app/client/src/pages/Editor/IDE/EditorPane/hooks/useNameEditorState.ts b/app/client/src/IDE/hooks/useNameEditorState.ts similarity index 75% rename from app/client/src/pages/Editor/IDE/EditorPane/hooks/useNameEditorState.ts rename to app/client/src/IDE/hooks/useNameEditorState.ts index 364bf7a23432..db82e52ddbcd 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/hooks/useNameEditorState.ts +++ b/app/client/src/IDE/hooks/useNameEditorState.ts @@ -1,7 +1,9 @@ import { useCallback } from "react"; import { useDispatch, useSelector } from "react-redux"; -import { initExplorerEntityNameEdit } from "actions/explorerActions"; -import { ReduxActionTypes } from "ee/constants/ReduxActionConstants"; +import { + endExplorerEntityNameEdit, + initExplorerEntityNameEdit, +} from "actions/explorerActions"; import { getUpdatingEntity, getEditingEntityName, @@ -22,9 +24,7 @@ export function useNameEditorState() { ); const exitEditMode = useCallback(() => { - dispatch({ - type: ReduxActionTypes.END_EXPLORER_ENTITY_NAME_EDIT, - }); + dispatch(endExplorerEntityNameEdit()); }, [dispatch]); return { diff --git a/app/client/src/IDE/utils/getCurrentEntityInfo.ts b/app/client/src/IDE/utils/getCurrentEntityInfo.ts new file mode 100644 index 000000000000..f3850d05d801 --- /dev/null +++ b/app/client/src/IDE/utils/getCurrentEntityInfo.ts @@ -0,0 +1,66 @@ +import { FocusEntity } from "navigation/FocusEntity"; +import { + EditorEntityTab, + EditorEntityTabState, +} from "../Interfaces/EditorTypes"; + +/** + * Resolve segment and segmentMode based on entity type. + */ +export function getCurrentEntityInfo(entity: FocusEntity) { + switch (entity) { + case FocusEntity.QUERY: + case FocusEntity.API: + case FocusEntity.QUERY_MODULE_INSTANCE: + return { + segment: EditorEntityTab.QUERIES, + segmentMode: EditorEntityTabState.Edit, + }; + case FocusEntity.QUERY_LIST: + return { + segment: EditorEntityTab.QUERIES, + segmentMode: EditorEntityTabState.List, + }; + case FocusEntity.QUERY_ADD: + return { + segment: EditorEntityTab.QUERIES, + segmentMode: EditorEntityTabState.Add, + }; + case FocusEntity.JS_OBJECT: + case FocusEntity.JS_MODULE_INSTANCE: + return { + segment: EditorEntityTab.JS, + segmentMode: EditorEntityTabState.Edit, + }; + case FocusEntity.JS_OBJECT_ADD: + return { + segment: EditorEntityTab.JS, + segmentMode: EditorEntityTabState.Add, + }; + case FocusEntity.JS_OBJECT_LIST: + return { + segment: EditorEntityTab.JS, + segmentMode: EditorEntityTabState.List, + }; + case FocusEntity.CANVAS: + return { + segment: EditorEntityTab.UI, + segmentMode: EditorEntityTabState.Add, + }; + case FocusEntity.WIDGET: + return { + segment: EditorEntityTab.UI, + segmentMode: EditorEntityTabState.Edit, + }; + case FocusEntity.WIDGET_LIST: + return { + segment: EditorEntityTab.UI, + segmentMode: EditorEntityTabState.List, + }; + default: + return { + segment: EditorEntityTab.UI, + segmentMode: EditorEntityTabState.Add, + }; + } +} diff --git a/app/client/src/IDE/utils/isInSideBySideEditor.ts b/app/client/src/IDE/utils/isInSideBySideEditor.ts new file mode 100644 index 000000000000..c06060396a0a --- /dev/null +++ b/app/client/src/IDE/utils/isInSideBySideEditor.ts @@ -0,0 +1,21 @@ +import { EditorEntityTab, EditorViewMode } from "../Interfaces/EditorTypes"; +import { EditorState } from "../enums"; + +/** + * Check if use is currently working is side-by-side editor mode. + */ +export function isInSideBySideEditor({ + appState, + segment, + viewMode, +}: { + viewMode: EditorViewMode; + appState: EditorState; + segment: EditorEntityTab; +}) { + return ( + viewMode === EditorViewMode.SplitScreen && + appState === EditorState.EDITOR && + segment !== EditorEntityTab.UI + ); +} diff --git a/app/client/src/ce/AppRouter.tsx b/app/client/src/ce/AppRouter.tsx index 0675d4ba7bc1..9e78b3b25e53 100644 --- a/app/client/src/ce/AppRouter.tsx +++ b/app/client/src/ce/AppRouter.tsx @@ -32,7 +32,7 @@ import { } from "constants/routes"; import WorkspaceLoader from "pages/workspace/loader"; import ApplicationListLoader from "pages/Applications/loader"; -import EditorLoader from "pages/Editor/loader"; +import AppIDE from "pages/AppIDE/AppIDELoader"; import AppViewerLoader from "pages/AppViewer/loader"; import LandingScreen from "../LandingScreen"; import UserAuth from "pages/UserAuth"; @@ -116,7 +116,7 @@ export function Routes() { exact path={CUSTOM_WIDGETS_DEPRECATED_EDITOR_ID_PATH} /> - + - + + {/* diff --git a/app/client/src/ce/navigation/FocusSetters.ts b/app/client/src/ce/navigation/FocusSetters.ts index 4d5aa3197b08..d96bfdf97c03 100644 --- a/app/client/src/ce/navigation/FocusSetters.ts +++ b/app/client/src/ce/navigation/FocusSetters.ts @@ -7,7 +7,7 @@ import { import { PluginType } from "entities/Plugin"; import type { FocusEntityInfo } from "navigation/FocusEntity"; import { FocusEntity } from "navigation/FocusEntity"; -import { getQueryEntityItemUrl } from "ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl"; +import { getQueryEntityItemUrl } from "ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl"; export function setSelectedDatasource(id?: string) { if (id) { diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.test.ts b/app/client/src/ce/pages/AppIDE/components/JSAdd/getJSUrl.test.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.test.ts rename to app/client/src/ce/pages/AppIDE/components/JSAdd/getJSUrl.test.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts b/app/client/src/ce/pages/AppIDE/components/JSAdd/getJSUrl.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts rename to app/client/src/ce/pages/AppIDE/components/JSAdd/getJSUrl.ts diff --git a/app/client/src/ce/pages/AppIDE/components/JSAdd/hooks.tsx b/app/client/src/ce/pages/AppIDE/components/JSAdd/hooks.tsx new file mode 100644 index 000000000000..70022fd6bfd4 --- /dev/null +++ b/app/client/src/ce/pages/AppIDE/components/JSAdd/hooks.tsx @@ -0,0 +1,22 @@ +import { createNewJSCollection } from "actions/jsPaneActions"; +import type { GroupedAddOperations } from "IDE/Interfaces/GroupedAddOperations"; +import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; +import { JsFileIconV2 } from "pages/Editor/Explorer/ExplorerIcons"; +import { SEARCH_ITEM_TYPES } from "components/editorComponents/GlobalSearch/utils"; + +export const useGroupedAddJsOperations = (): GroupedAddOperations => { + return [ + { + className: "t--blank-js", + operations: [ + { + title: createMessage(EDITOR_PANE_TEXTS.js_blank_object_item), + desc: "", + icon: JsFileIconV2(16, 16), + kind: SEARCH_ITEM_TYPES.actionOperation, + action: (pageId) => createNewJSCollection(pageId, "ENTITY_EXPLORER"), + }, + ], + }, + ]; +}; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/useGroupAddJsOperations.test.ts b/app/client/src/ce/pages/AppIDE/components/JSAdd/useGroupAddJsOperations.test.ts similarity index 91% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/useGroupAddJsOperations.test.ts rename to app/client/src/ce/pages/AppIDE/components/JSAdd/useGroupAddJsOperations.test.ts index c15389a3ae9d..7c167512d92e 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/useGroupAddJsOperations.test.ts +++ b/app/client/src/ce/pages/AppIDE/components/JSAdd/useGroupAddJsOperations.test.ts @@ -1,5 +1,5 @@ import { EDITOR_PANE_TEXTS, createMessage } from "ee/constants/messages"; -import { useGroupedAddJsOperations } from "../../JS/hooks"; +import { useGroupedAddJsOperations } from "./hooks"; describe("useGroupedAddJsOperations", () => { it("returns an array of grouped operations", () => { diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/ListItem.tsx b/app/client/src/ce/pages/AppIDE/components/JSListItem/ListItem.tsx similarity index 68% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/ListItem.tsx rename to app/client/src/ce/pages/AppIDE/components/JSListItem/ListItem.tsx index 2edc10d68940..6904e477c2fb 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/ListItem.tsx +++ b/app/client/src/ce/pages/AppIDE/components/JSListItem/ListItem.tsx @@ -1,6 +1,6 @@ import React from "react"; import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; -import { JSEntityItem } from "pages/Editor/IDE/EditorPane/JS/EntityItem/JSEntityItem"; +import { JSEntityItem } from "pages/AppIDE/components/JSEntityItem"; export const JSEntity = (props: { item: EntityItem }) => { return ; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx b/app/client/src/ce/pages/AppIDE/components/JSListItem/old/ListItem.tsx similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx rename to app/client/src/ce/pages/AppIDE/components/JSListItem/old/ListItem.tsx diff --git a/app/client/src/ce/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx b/app/client/src/ce/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx similarity index 72% rename from app/client/src/ce/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx rename to app/client/src/ce/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx index 3203c1b5b64e..720035cecc11 100644 --- a/app/client/src/ce/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx +++ b/app/client/src/ce/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx @@ -1,5 +1,5 @@ import React from "react"; -import JSLibrariesSection from "pages/Editor/IDE/LeftPane/JSLibrariesSection"; +import JSLibrariesSection from "pages/AppIDE/components/LibrariesList/JSLibrariesSection"; import { IDESidePaneWrapper } from "IDE"; const LibrarySidePane = () => { diff --git a/app/client/src/ce/pages/AppIDE/components/MissingModuleNotification.tsx b/app/client/src/ce/pages/AppIDE/components/MissingModuleNotification.tsx new file mode 100644 index 000000000000..31a72945305a --- /dev/null +++ b/app/client/src/ce/pages/AppIDE/components/MissingModuleNotification.tsx @@ -0,0 +1,7 @@ +import type { ReactElement } from "react"; + +function MissingModuleNotification(): ReactElement | null { + return null; +} + +export default MissingModuleNotification; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.test.ts b/app/client/src/ce/pages/AppIDE/components/QueryAdd/getQueryUrl.test.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.test.ts rename to app/client/src/ce/pages/AppIDE/components/QueryAdd/getQueryUrl.test.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts b/app/client/src/ce/pages/AppIDE/components/QueryAdd/getQueryUrl.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts rename to app/client/src/ce/pages/AppIDE/components/QueryAdd/getQueryUrl.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx b/app/client/src/ce/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx similarity index 51% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx rename to app/client/src/ce/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx index 34bcdc29ea8b..ffff528078e6 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx +++ b/app/client/src/ce/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx @@ -1,80 +1,82 @@ -import { lazy, Suspense, useCallback, useMemo } from "react"; -import React from "react"; -import history from "utils/history"; -import { useLocation } from "react-router"; -import { FocusEntity, identifyEntityFromPath } from "navigation/FocusEntity"; -import { useDispatch, useSelector } from "react-redux"; -import { useFilteredFileOperations } from "components/editorComponents/GlobalSearch/GlobalSearchHooks"; import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; +import { useDispatch, useSelector } from "react-redux"; import { getCurrentPageId, getPagePermissions, } from "selectors/editorSelectors"; import { getHasCreateActionPermission } from "ee/utils/BusinessFeatures/permissionPageHelpers"; -import type { ActionOperation } from "components/editorComponents/GlobalSearch/utils"; -import { SEARCH_ITEM_TYPES } from "components/editorComponents/GlobalSearch/utils"; -import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; -import { getQueryUrl } from "ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl"; +import { useFilteredFileOperations } from "components/editorComponents/GlobalSearch/GlobalSearchHooks"; +import { FocusEntity } from "navigation/FocusEntity"; import { - ADD_PATH, - API_EDITOR_ID_PATH, - BUILDER_CUSTOM_PATH, - BUILDER_PATH, - BUILDER_PATH_DEPRECATED, -} from "ee/constants/routes/appRoutes"; -import { SAAS_EDITOR_API_ID_PATH } from "pages/Editor/SaaSEditor/constants"; -import type { UseRoutes } from "IDE/Interfaces/UseRoutes"; + type ActionOperation, + SEARCH_ITEM_TYPES, +} from "components/editorComponents/GlobalSearch/utils"; +import type { GroupedAddOperations } from "IDE/Interfaces/GroupedAddOperations"; +import type { + EntityGroupProps, + EntityItemProps, + ListItemProps, +} from "@appsmith/ads"; +import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import type { AppState } from "ee/reducers"; +import { useCallback, useMemo } from "react"; import keyBy from "lodash/keyBy"; +import { createAddClassName } from "pages/AppIDE/constants"; import { getPluginEntityIcon } from "pages/Editor/Explorer/ExplorerIcons"; -import { - type EntityGroupProps, - type ListItemProps, - type EntityItemProps, -} from "@appsmith/ads"; -import { createAddClassName } from "pages/Editor/IDE/EditorPane/utils"; -import { getIDEViewMode } from "selectors/ideSelectors"; -import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; -import { setListViewActiveState } from "actions/ideActions"; -import { retryPromise } from "utils/AppsmithUtils"; -import Skeleton from "widgets/Skeleton"; -export const useQueryAdd = () => { - const location = useLocation(); +export const useAddQueryListItems = () => { const dispatch = useDispatch(); - const currentEntityInfo = identifyEntityFromPath(location.pathname); - const ideViewMode = useSelector(getIDEViewMode); + const pageId = useSelector(getCurrentPageId) as string; + const plugins = useSelector((state: AppState) => { + return state.entities.plugins.list; + }); + const pluginGroups = useMemo(() => keyBy(plugins, "id"), [plugins]); - const openAddQuery = useCallback(() => { - if (currentEntityInfo.entity === FocusEntity.QUERY_ADD) { - if (ideViewMode === EditorViewMode.SplitScreen) { - dispatch(setListViewActiveState(false)); + const onCreateItemClick = useCallback( + (item: ActionOperation) => { + if (item.action) { + dispatch(item.action(pageId, "ENTITY_EXPLORER")); + } else if (item.redirect) { + item.redirect(pageId, "ENTITY_EXPLORER"); } + }, + [pageId, dispatch], + ); - return; - } - - const url = getQueryUrl(currentEntityInfo); - - history.push(url); - }, [currentEntityInfo, dispatch, ideViewMode]); + const getListItems = (data: ActionOperation[]) => { + return data.map((fileOperation) => { + let title = + fileOperation.entityExplorerTitle || + fileOperation.dsName || + fileOperation.title; - const closeAddQuery = useCallback(() => { - const url = getQueryUrl(currentEntityInfo, false); + title = + fileOperation.focusEntityType === FocusEntity.QUERY_MODULE_INSTANCE + ? fileOperation.title + : title; + const className = createAddClassName(title); + const icon = + fileOperation.icon || + (fileOperation.pluginId && + getPluginEntityIcon(pluginGroups[fileOperation.pluginId])); - history.push(url); - }, [currentEntityInfo]); + return { + startIcon: icon, + className: className, + title, + description: + fileOperation.focusEntityType === FocusEntity.QUERY_MODULE_INSTANCE + ? fileOperation.dsName + : "", + descriptionType: "inline", + onClick: onCreateItemClick.bind(null, fileOperation), + } as ListItemProps; + }); + }; - return { openAddQuery, closeAddQuery }; + return { getListItems }; }; - -export type GroupedAddOperations = Array<{ - title?: string; - className: string; - operations: ActionOperation[]; -}>; - export const useGroupedAddQueryOperations = () => { const isFeatureEnabled = useFeatureFlag(FEATURE_FLAG.license_gac_enabled); const pagePermissions = useSelector(getPagePermissions); @@ -144,133 +146,3 @@ export const useGroupedAddQueryOperations = () => { return groupedItems; }; - -const PluginActionEditor = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "PluginActionEditor" */ "pages/Editor/AppPluginActionEditor" - ), - ), -); - -const AddQuery = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "AddQuery" */ "pages/Editor/IDE/EditorPane/Query/Add" - ), - ), -); - -const QueryEmpty = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "QueryEmpty" */ "../../../../../../PluginActionEditor/components/PluginActionForm/components/UQIEditor/QueriesBlankState" - ), - ), -); - -export const useQueryEditorRoutes = (path: string): UseRoutes => { - const skeleton = useMemo(() => , []); - - return useMemo( - () => [ - { - key: "AddQuery", - exact: true, - component: () => ( - - - - ), - path: [`${path}${ADD_PATH}`, `${path}/:baseQueryId${ADD_PATH}`], - }, - { - key: "PluginActionEditor", - component: () => { - return ( - - - - ); - }, - path: [ - BUILDER_PATH + API_EDITOR_ID_PATH, - BUILDER_CUSTOM_PATH + API_EDITOR_ID_PATH, - BUILDER_PATH_DEPRECATED + API_EDITOR_ID_PATH, - BUILDER_PATH + SAAS_EDITOR_API_ID_PATH, - BUILDER_CUSTOM_PATH + SAAS_EDITOR_API_ID_PATH, - BUILDER_PATH_DEPRECATED + SAAS_EDITOR_API_ID_PATH, - path + "/:baseQueryId", - ], - exact: true, - }, - { - key: "QueryEmpty", - component: () => ( - - - - ), - exact: true, - path: [path], - }, - ], - [path, skeleton], - ); -}; - -export const useAddQueryListItems = () => { - const dispatch = useDispatch(); - const pageId = useSelector(getCurrentPageId) as string; - const plugins = useSelector((state: AppState) => { - return state.entities.plugins.list; - }); - const pluginGroups = useMemo(() => keyBy(plugins, "id"), [plugins]); - - const onCreateItemClick = useCallback( - (item: ActionOperation) => { - if (item.action) { - dispatch(item.action(pageId, "ENTITY_EXPLORER")); - } else if (item.redirect) { - item.redirect(pageId, "ENTITY_EXPLORER"); - } - }, - [pageId, dispatch], - ); - - const getListItems = (data: ActionOperation[]) => { - return data.map((fileOperation) => { - let title = - fileOperation.entityExplorerTitle || - fileOperation.dsName || - fileOperation.title; - - title = - fileOperation.focusEntityType === FocusEntity.QUERY_MODULE_INSTANCE - ? fileOperation.title - : title; - const className = createAddClassName(title); - const icon = - fileOperation.icon || - (fileOperation.pluginId && - getPluginEntityIcon(pluginGroups[fileOperation.pluginId])); - - return { - startIcon: icon, - className: className, - title, - description: - fileOperation.focusEntityType === FocusEntity.QUERY_MODULE_INSTANCE - ? fileOperation.dsName - : "", - descriptionType: "inline", - onClick: onCreateItemClick.bind(null, fileOperation), - } as ListItemProps; - }); - }; - - return { getListItems }; -}; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/ListItem.tsx b/app/client/src/ce/pages/AppIDE/components/QueryEntityItem/ListItem.tsx similarity index 67% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/ListItem.tsx rename to app/client/src/ce/pages/AppIDE/components/QueryEntityItem/ListItem.tsx index f877949a889a..bfb22a902fbb 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/ListItem.tsx +++ b/app/client/src/ce/pages/AppIDE/components/QueryEntityItem/ListItem.tsx @@ -1,5 +1,5 @@ import React from "react"; -import { QueryEntityItem } from "pages/Editor/IDE/EditorPane/Query/EntityItem/QueryEntityItem"; +import { QueryEntityItem } from "pages/AppIDE/components/QueryEntityItem"; import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; export const ActionEntityItem = (props: { item: EntityItem }) => { diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx b/app/client/src/ce/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx rename to app/client/src/ce/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx diff --git a/app/client/src/ce/pages/Editor/IDE/constants/SidebarButtons.ts b/app/client/src/ce/pages/AppIDE/constants/SidebarButtons.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/constants/SidebarButtons.ts rename to app/client/src/ce/pages/AppIDE/constants/SidebarButtons.ts diff --git a/app/client/src/ce/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts b/app/client/src/ce/pages/AppIDE/layout/components/Header/useLibraryHeaderTitle.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts rename to app/client/src/ce/pages/AppIDE/layout/components/Header/useLibraryHeaderTitle.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/constants.ts b/app/client/src/ce/pages/AppIDE/layout/constants.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/constants.ts rename to app/client/src/ce/pages/AppIDE/layout/constants.ts diff --git a/app/client/src/ce/pages/AppIDE/layout/routers/JSEditor/constants.ts b/app/client/src/ce/pages/AppIDE/layout/routers/JSEditor/constants.ts new file mode 100644 index 000000000000..32e2793cd844 --- /dev/null +++ b/app/client/src/ce/pages/AppIDE/layout/routers/JSEditor/constants.ts @@ -0,0 +1,28 @@ +import type { UseRoutes } from "IDE/Interfaces/UseRoutes"; +import { ADD_PATH } from "ee/constants/routes/appRoutes"; +import AddJS from "pages/AppIDE/components/JSAdd/loader"; +import JSEditor from "pages/Editor/JSEditor/loader"; +import JSBlankState from "pages/Editor/JSEditor/JSBlankState"; + +export const JSEditorRoutes = (path: string): UseRoutes => { + return [ + { + exact: true, + key: "AddJS", + component: AddJS, + path: [`${path}${ADD_PATH}`, `${path}/:baseCollectionId${ADD_PATH}`], + }, + { + exact: true, + key: "JSEditor", + component: JSEditor, + path: [path + "/:baseCollectionId"], + }, + { + key: "JSEmpty", + component: JSBlankState, + exact: true, + path: [path], + }, + ]; +}; diff --git a/app/client/src/ce/pages/AppIDE/layout/routers/MainPane/constants.ts b/app/client/src/ce/pages/AppIDE/layout/routers/MainPane/constants.ts new file mode 100644 index 000000000000..33e26a766533 --- /dev/null +++ b/app/client/src/ce/pages/AppIDE/layout/routers/MainPane/constants.ts @@ -0,0 +1,103 @@ +import WidgetsEditor from "pages/Editor/WidgetsEditor"; +import { + ADD_PATH, + API_EDITOR_ID_ADD_PATH, + API_EDITOR_ID_PATH, + APP_LIBRARIES_EDITOR_PATH, + APP_PACKAGES_EDITOR_PATH, + APP_SETTINGS_EDITOR_PATH, + BUILDER_CHECKLIST_PATH, + BUILDER_CUSTOM_PATH, + BUILDER_PATH, + BUILDER_PATH_DEPRECATED, + DATA_SOURCES_EDITOR_ID_PATH, + DATA_SOURCES_EDITOR_LIST_PATH, + INTEGRATION_EDITOR_PATH, + JS_COLLECTION_EDITOR_PATH, + JS_COLLECTION_ID_PATH, + LIST_PATH, + QUERIES_EDITOR_BASE_PATH, + QUERIES_EDITOR_ID_ADD_PATH, + QUERIES_EDITOR_ID_PATH, + WIDGETS_EDITOR_BASE_PATH, + WIDGETS_EDITOR_ID_PATH, +} from "ee/constants/routes/appRoutes"; +import { + SAAS_EDITOR_API_ID_ADD_PATH, + SAAS_EDITOR_API_ID_PATH, + SAAS_EDITOR_DATASOURCE_ID_PATH, + SAAS_EDITOR_PATH, +} from "pages/Editor/SaaSEditor/constants"; +import CreateNewDatasourceTab from "pages/Editor/IntegrationEditor/CreateNewDatasourceTab"; +import { FirstTimeUserOnboardingChecklist } from "pages/Editor/FirstTimeUserOnboarding/loader"; +import DataSourceEditor from "pages/Editor/DataSourceEditor"; +import DatasourceBlankState from "pages/Editor/DataSourceEditor/DatasourceBlankState"; +import DatasourceForm from "pages/Editor/SaaSEditor/DatasourceForm"; + +export const MainPaneRoutes = (path: string) => [ + { + key: "Canvas", + component: WidgetsEditor, + exact: true, + path: [ + BUILDER_PATH_DEPRECATED, + BUILDER_PATH, + BUILDER_CUSTOM_PATH, + `${BUILDER_PATH_DEPRECATED}${ADD_PATH}`, + `${BUILDER_PATH}${ADD_PATH}`, + `${BUILDER_CUSTOM_PATH}${ADD_PATH}`, + `${path}${ADD_PATH}`, + `${path}${WIDGETS_EDITOR_BASE_PATH}`, + `${path}${WIDGETS_EDITOR_ID_PATH}`, + `${path}${WIDGETS_EDITOR_ID_PATH}${ADD_PATH}`, + `${path}${API_EDITOR_ID_PATH}`, + `${path}${API_EDITOR_ID_PATH}${LIST_PATH}`, + `${path}${API_EDITOR_ID_ADD_PATH}`, + `${path}${QUERIES_EDITOR_BASE_PATH}`, + `${path}${QUERIES_EDITOR_BASE_PATH}${ADD_PATH}`, + `${path}${QUERIES_EDITOR_ID_PATH}`, + `${path}${QUERIES_EDITOR_ID_ADD_PATH}`, + `${path}${QUERIES_EDITOR_ID_PATH}${LIST_PATH}`, + `${path}${JS_COLLECTION_EDITOR_PATH}`, + `${path}${JS_COLLECTION_EDITOR_PATH}${ADD_PATH}`, + `${path}${JS_COLLECTION_ID_PATH}`, + `${path}${JS_COLLECTION_ID_PATH}${LIST_PATH}`, + `${path}${SAAS_EDITOR_PATH}`, + `${path}${SAAS_EDITOR_API_ID_PATH}`, + `${path}${SAAS_EDITOR_API_ID_ADD_PATH}`, + `${path}${APP_LIBRARIES_EDITOR_PATH}`, + `${path}${APP_PACKAGES_EDITOR_PATH}`, + `${path}${APP_SETTINGS_EDITOR_PATH}`, + ], + }, + { + key: "Datasource Create and Active", + component: CreateNewDatasourceTab, + exact: true, + path: `${path}${INTEGRATION_EDITOR_PATH}`, + }, + { + key: "OnboardingChecklist", + component: FirstTimeUserOnboardingChecklist, + exact: true, + path: `${path}${BUILDER_CHECKLIST_PATH}`, + }, + { + key: "DatasourceEditor", + component: DataSourceEditor, + exact: true, + path: `${path}${DATA_SOURCES_EDITOR_ID_PATH}`, + }, + { + key: "DatasourceBlankState", + component: DatasourceBlankState, + exact: true, + path: `${path}${DATA_SOURCES_EDITOR_LIST_PATH}`, + }, + { + key: "SAASDatasourceEditor", + component: DatasourceForm, + exact: true, + path: `${path}${SAAS_EDITOR_DATASOURCE_ID_PATH}`, + }, +]; diff --git a/app/client/src/ce/pages/AppIDE/layout/routers/QueryEditor/constants.ts b/app/client/src/ce/pages/AppIDE/layout/routers/QueryEditor/constants.ts new file mode 100644 index 000000000000..79257525be9c --- /dev/null +++ b/app/client/src/ce/pages/AppIDE/layout/routers/QueryEditor/constants.ts @@ -0,0 +1,43 @@ +import type { UseRoutes } from "IDE/Interfaces/UseRoutes"; +import { + ADD_PATH, + API_EDITOR_ID_PATH, + BUILDER_CUSTOM_PATH, + BUILDER_PATH, + BUILDER_PATH_DEPRECATED, +} from "ee/constants/routes/appRoutes"; +import { SAAS_EDITOR_API_ID_PATH } from "pages/Editor/SaaSEditor/constants"; +import PluginActionEditor from "pages/AppIDE/components/AppPluginActionEditor/loader"; +import QueryAdd from "pages/AppIDE/components/QueryAdd/loader"; +import QueriesBlankState from "PluginActionEditor/components/PluginActionForm/components/UQIEditor/QueriesBlankState"; + +export const QueryEditorRoutes = (path: string): UseRoutes => { + return [ + { + key: "QueryAdd", + exact: true, + component: QueryAdd, + path: [`${path}${ADD_PATH}`, `${path}/:baseQueryId${ADD_PATH}`], + }, + { + key: "PluginActionEditor", + component: PluginActionEditor, + path: [ + BUILDER_PATH + API_EDITOR_ID_PATH, + BUILDER_CUSTOM_PATH + API_EDITOR_ID_PATH, + BUILDER_PATH_DEPRECATED + API_EDITOR_ID_PATH, + BUILDER_PATH + SAAS_EDITOR_API_ID_PATH, + BUILDER_CUSTOM_PATH + SAAS_EDITOR_API_ID_PATH, + BUILDER_PATH_DEPRECATED + SAAS_EDITOR_API_ID_PATH, + path + "/:baseQueryId", + ], + exact: true, + }, + { + key: "QueryEmpty", + component: QueriesBlankState, + exact: true, + path: [path], + }, + ]; +}; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.test.ts b/app/client/src/ce/pages/AppIDE/layout/routers/utils/getJSEntityItemUrl.test.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.test.ts rename to app/client/src/ce/pages/AppIDE/layout/routers/utils/getJSEntityItemUrl.test.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts b/app/client/src/ce/pages/AppIDE/layout/routers/utils/getJSEntityItemUrl.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts rename to app/client/src/ce/pages/AppIDE/layout/routers/utils/getJSEntityItemUrl.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.test.ts b/app/client/src/ce/pages/AppIDE/layout/routers/utils/getQueryEntityItemUrl.test.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.test.ts rename to app/client/src/ce/pages/AppIDE/layout/routers/utils/getQueryEntityItemUrl.test.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts b/app/client/src/ce/pages/AppIDE/layout/routers/utils/getQueryEntityItemUrl.ts similarity index 100% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts rename to app/client/src/ce/pages/AppIDE/layout/routers/utils/getQueryEntityItemUrl.ts diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/hooks.tsx b/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/hooks.tsx deleted file mode 100644 index fbc198f2bd61..000000000000 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/hooks.tsx +++ /dev/null @@ -1,156 +0,0 @@ -import { lazy, Suspense, useCallback, useMemo } from "react"; -import React from "react"; -import { useDispatch, useSelector } from "react-redux"; -import { createNewJSCollection } from "actions/jsPaneActions"; -import { getCurrentPageId } from "selectors/editorSelectors"; -import type { GroupedAddOperations } from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; -import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; -import { JsFileIconV2 } from "pages/Editor/Explorer/ExplorerIcons"; -import { SEARCH_ITEM_TYPES } from "components/editorComponents/GlobalSearch/utils"; -import type { UseRoutes } from "IDE/Interfaces/UseRoutes"; -import { ADD_PATH } from "ee/constants/routes/appRoutes"; -import history from "utils/history"; -import { FocusEntity, identifyEntityFromPath } from "navigation/FocusEntity"; -import { useModuleOptions } from "ee/utils/moduleInstanceHelpers"; -import { getJSUrl } from "ee/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl"; -import { getIDEViewMode } from "selectors/ideSelectors"; -import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; -import { setListViewActiveState } from "actions/ideActions"; -import { retryPromise } from "utils/AppsmithUtils"; -import Skeleton from "widgets/Skeleton"; - -export const useJSAdd = () => { - const pageId = useSelector(getCurrentPageId); - const dispatch = useDispatch(); - const currentEntityInfo = identifyEntityFromPath(location.pathname); - const moduleCreationOptions = useModuleOptions(); - const jsModuleCreationOptions = moduleCreationOptions.filter( - (opt) => opt.focusEntityType === FocusEntity.JS_MODULE_INSTANCE, - ); - const ideViewMode = useSelector(getIDEViewMode); - - const openAddJS = useCallback(() => { - if (jsModuleCreationOptions.length === 0) { - dispatch(createNewJSCollection(pageId, "ENTITY_EXPLORER")); - } else { - if (currentEntityInfo.entity === FocusEntity.JS_OBJECT_ADD) { - if (ideViewMode === EditorViewMode.SplitScreen) { - dispatch(setListViewActiveState(false)); - } - - return; - } - - const url = getJSUrl(currentEntityInfo, true); - - history.push(url); - } - }, [ - jsModuleCreationOptions, - pageId, - dispatch, - currentEntityInfo, - ideViewMode, - ]); - - const closeAddJS = useCallback(() => { - const url = getJSUrl(currentEntityInfo, false); - - history.push(url); - }, [currentEntityInfo]); - - return { openAddJS, closeAddJS }; -}; - -export const useIsJSAddLoading = () => { - const moduleCreationOptions = useModuleOptions(); - const jsModuleCreationOptions = moduleCreationOptions.filter( - (opt) => opt.focusEntityType === FocusEntity.JS_MODULE_INSTANCE, - ); - const { isCreating } = useSelector((state) => state.ui.jsPane); - - if (jsModuleCreationOptions.length === 0) { - return isCreating; - } - - return false; -}; - -export const useGroupedAddJsOperations = (): GroupedAddOperations => { - return [ - { - className: "t--blank-js", - operations: [ - { - title: createMessage(EDITOR_PANE_TEXTS.js_blank_object_item), - desc: "", - icon: JsFileIconV2(16, 16), - kind: SEARCH_ITEM_TYPES.actionOperation, - action: (pageId) => createNewJSCollection(pageId, "ENTITY_EXPLORER"), - }, - ], - }, - ]; -}; - -const AddJS = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "AddJS" */ "pages/Editor/IDE/EditorPane/JS/Add" - ), - ), -); -const JSEditor = lazy(async () => - retryPromise( - async () => - import(/* webpackChunkName: "JSEditor" */ "pages/Editor/JSEditor"), - ), -); - -const JSEmpty = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "JSEmpty" */ "pages/Editor/JSEditor/JSBlankState" - ), - ), -); - -export const useJSEditorRoutes = (path: string): UseRoutes => { - return useMemo( - () => [ - { - exact: true, - key: "AddJS", - component: (args) => ( - }> - - - ), - path: [`${path}${ADD_PATH}`, `${path}/:baseCollectionId${ADD_PATH}`], - }, - { - exact: true, - key: "JSEditor", - component: (args) => ( - }> - - - ), - path: [path + "/:baseCollectionId"], - }, - { - key: "JSEmpty", - component: (args) => ( - }> - - - ), - exact: true, - path: [path], - }, - ], - [path], - ); -}; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx b/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx deleted file mode 100644 index 5590b59650a8..000000000000 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from "react"; -import { IDE_TYPE, type IDEType } from "ee/IDE/Interfaces/IDETypes"; -import EntityContextMenu from "pages/Editor/IDE/EditorPane/components/EntityContextMenu"; -import { AppJSContextMenuItems } from "pages/Editor/IDE/EditorPane/JS/EntityItem/AppJSContextMenuItems"; -import type { JSCollection } from "entities/JSCollection"; - -export const getJSContextMenuByIdeType = ( - ideType: IDEType, - jsAction: JSCollection, -) => { - switch (ideType) { - case IDE_TYPE.App: { - return ( - - - - ); - } - } -}; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.tsx b/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.tsx deleted file mode 100644 index 179e6a3fb863..000000000000 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from "react"; -import { IDE_TYPE, type IDEType } from "ee/IDE/Interfaces/IDETypes"; -import type { Action } from "entities/Action"; -import { AppQueryContextMenuItems } from "pages/Editor/IDE/EditorPane/Query/EntityItem/AppQueryContextMenuItems"; -import EntityContextMenu from "pages/Editor/IDE/EditorPane/components/EntityContextMenu"; - -export const getQueryContextMenuByIdeType = ( - ideType: IDEType, - action: Action, -) => { - switch (ideType) { - case IDE_TYPE.App: { - return ( - - - - ); - } - } -}; diff --git a/app/client/src/ce/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx b/app/client/src/ce/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx deleted file mode 100644 index 4fc0a154f515..000000000000 --- a/app/client/src/ce/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx +++ /dev/null @@ -1,5 +0,0 @@ -function useMissingModuleNotification(): React.ReactNode | null { - return null; -} - -export default useMissingModuleNotification; diff --git a/app/client/src/ce/pages/Editor/IDE/MainPane/useRoutes.tsx b/app/client/src/ce/pages/Editor/IDE/MainPane/useRoutes.tsx deleted file mode 100644 index 8f16afc63327..000000000000 --- a/app/client/src/ce/pages/Editor/IDE/MainPane/useRoutes.tsx +++ /dev/null @@ -1,143 +0,0 @@ -import WidgetsEditor from "pages/Editor/WidgetsEditor"; -import { - ADD_PATH, - API_EDITOR_ID_ADD_PATH, - API_EDITOR_ID_PATH, - APP_LIBRARIES_EDITOR_PATH, - APP_PACKAGES_EDITOR_PATH, - APP_SETTINGS_EDITOR_PATH, - BUILDER_CHECKLIST_PATH, - BUILDER_CUSTOM_PATH, - BUILDER_PATH, - BUILDER_PATH_DEPRECATED, - DATA_SOURCES_EDITOR_ID_PATH, - DATA_SOURCES_EDITOR_LIST_PATH, - INTEGRATION_EDITOR_PATH, - JS_COLLECTION_EDITOR_PATH, - JS_COLLECTION_ID_PATH, - LIST_PATH, - QUERIES_EDITOR_BASE_PATH, - QUERIES_EDITOR_ID_ADD_PATH, - QUERIES_EDITOR_ID_PATH, - WIDGETS_EDITOR_BASE_PATH, - WIDGETS_EDITOR_ID_PATH, -} from "constants/routes"; -import CreateNewDatasourceTab from "pages/Editor/IntegrationEditor/CreateNewDatasourceTab"; -import { - SAAS_EDITOR_API_ID_ADD_PATH, - SAAS_EDITOR_API_ID_PATH, - SAAS_EDITOR_DATASOURCE_ID_PATH, - SAAS_EDITOR_PATH, -} from "pages/Editor/SaaSEditor/constants"; -import DatasourceForm from "pages/Editor/SaaSEditor/DatasourceForm"; -import DataSourceEditor from "pages/Editor/DataSourceEditor"; -import DatasourceBlankState from "pages/Editor/DataSourceEditor/DatasourceBlankState"; -import type { RouteProps } from "react-router"; -import { useSelector } from "react-redux"; -import { lazy, Suspense } from "react"; -import React from "react"; - -import { retryPromise } from "utils/AppsmithUtils"; -import Skeleton from "widgets/Skeleton"; -import { selectCombinedPreviewMode } from "selectors/gitModSelectors"; - -const FirstTimeUserOnboardingChecklist = lazy(async () => - retryPromise( - async () => - import( - /* webpackChunkName: "FirstTimeUserOnboardingChecklist" */ "pages/Editor/FirstTimeUserOnboarding/Checklist" - ), - ), -); - -export const LazilyLoadedFirstTimeUserOnboardingChecklist = () => { - return ( - }> - - - ); -}; -export interface RouteReturnType extends RouteProps { - key: string; -} - -/** - * The hook is extended in EE, please be mindful when modifying the - * signature; it might break the implementation in EE. - */ - -function useRoutes(path: string): RouteReturnType[] { - const isPreviewMode = useSelector(selectCombinedPreviewMode); - - return [ - { - key: "Canvas", - component: WidgetsEditor, - exact: true, - path: [ - BUILDER_PATH_DEPRECATED, - BUILDER_PATH, - BUILDER_CUSTOM_PATH, - `${BUILDER_PATH_DEPRECATED}${ADD_PATH}`, - `${BUILDER_PATH}${ADD_PATH}`, - `${BUILDER_CUSTOM_PATH}${ADD_PATH}`, - `${path}${ADD_PATH}`, - `${path}${WIDGETS_EDITOR_BASE_PATH}`, - `${path}${WIDGETS_EDITOR_ID_PATH}`, - `${path}${WIDGETS_EDITOR_ID_PATH}${ADD_PATH}`, - `${path}${API_EDITOR_ID_PATH}`, - `${path}${API_EDITOR_ID_PATH}${LIST_PATH}`, - `${path}${API_EDITOR_ID_ADD_PATH}`, - `${path}${QUERIES_EDITOR_BASE_PATH}`, - `${path}${QUERIES_EDITOR_BASE_PATH}${ADD_PATH}`, - `${path}${QUERIES_EDITOR_ID_PATH}`, - `${path}${QUERIES_EDITOR_ID_ADD_PATH}`, - `${path}${QUERIES_EDITOR_ID_PATH}${LIST_PATH}`, - `${path}${JS_COLLECTION_EDITOR_PATH}`, - `${path}${JS_COLLECTION_EDITOR_PATH}${ADD_PATH}`, - `${path}${JS_COLLECTION_ID_PATH}`, - `${path}${JS_COLLECTION_ID_PATH}${LIST_PATH}`, - `${path}${SAAS_EDITOR_PATH}`, - `${path}${SAAS_EDITOR_API_ID_PATH}`, - `${path}${SAAS_EDITOR_API_ID_ADD_PATH}`, - `${path}${APP_LIBRARIES_EDITOR_PATH}`, - `${path}${APP_PACKAGES_EDITOR_PATH}`, - `${path}${APP_SETTINGS_EDITOR_PATH}`, - ], - }, - { - key: "Datasource Create and Active", - component: isPreviewMode ? WidgetsEditor : CreateNewDatasourceTab, - exact: true, - path: `${path}${INTEGRATION_EDITOR_PATH}`, - }, - { - key: "OnboardingChecklist", - component: isPreviewMode - ? WidgetsEditor - : FirstTimeUserOnboardingChecklist, - exact: true, - path: `${path}${BUILDER_CHECKLIST_PATH}`, - }, - { - key: "DatasourceEditor", - component: isPreviewMode ? WidgetsEditor : DataSourceEditor, - exact: true, - path: `${path}${DATA_SOURCES_EDITOR_ID_PATH}`, - }, - { - key: "DatasourceBlankState", - component: isPreviewMode ? WidgetsEditor : DatasourceBlankState, - exact: true, - path: `${path}${DATA_SOURCES_EDITOR_LIST_PATH}`, - }, - { - key: "SAASDatasourceEditor", - component: isPreviewMode ? WidgetsEditor : DatasourceForm, - exact: true, - path: `${path}${SAAS_EDITOR_DATASOURCE_ID_PATH}`, - }, - ]; -} - -export default useRoutes; diff --git a/app/client/src/ce/pages/common/AppHeader.tsx b/app/client/src/ce/pages/common/AppHeader.tsx index cb28ed36871d..c2b601048dfa 100644 --- a/app/client/src/ce/pages/common/AppHeader.tsx +++ b/app/client/src/ce/pages/common/AppHeader.tsx @@ -19,7 +19,7 @@ import { } 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 AppIDEHeader } from "pages/AppIDE/layout/components/Header"; export type Props = RouteComponentProps; diff --git a/app/client/src/ce/selectors/appIDESelectors.ts b/app/client/src/ce/selectors/appIDESelectors.ts index 73ada5de31ae..0b67086f9831 100644 --- a/app/client/src/ce/selectors/appIDESelectors.ts +++ b/app/client/src/ce/selectors/appIDESelectors.ts @@ -9,7 +9,7 @@ import { getJSTabs, getQueryTabs } from "selectors/ideSelectors"; import type { AppState } from "ee/reducers"; import { identifyEntityFromPath } from "navigation/FocusEntity"; import { getCurrentBasePageId } from "selectors/editorSelectors"; -import { getQueryEntityItemUrl } from "ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl"; +import { getQueryEntityItemUrl } from "ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl"; export type EditorSegmentList = Array<{ group: string | "NA"; diff --git a/app/client/src/ee/pages/AppIDE/components/JSAdd/getJSUrl.ts b/app/client/src/ee/pages/AppIDE/components/JSAdd/getJSUrl.ts new file mode 100644 index 000000000000..727b5c8d00ea --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/JSAdd/getJSUrl.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/JSAdd/getJSUrl"; diff --git a/app/client/src/ee/pages/AppIDE/components/JSAdd/hooks.tsx b/app/client/src/ee/pages/AppIDE/components/JSAdd/hooks.tsx new file mode 100644 index 000000000000..501e869d6b48 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/JSAdd/hooks.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/JSAdd/hooks"; diff --git a/app/client/src/ee/pages/AppIDE/components/JSListItem/ListItem.tsx b/app/client/src/ee/pages/AppIDE/components/JSListItem/ListItem.tsx new file mode 100644 index 000000000000..6ca2c6cc1320 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/JSListItem/ListItem.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/JSListItem/ListItem"; diff --git a/app/client/src/ee/pages/AppIDE/components/JSListItem/old/ListItem.tsx b/app/client/src/ee/pages/AppIDE/components/JSListItem/old/ListItem.tsx new file mode 100644 index 000000000000..d975f9c4b716 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/JSListItem/old/ListItem.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/JSListItem/old/ListItem"; diff --git a/app/client/src/ee/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx b/app/client/src/ee/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx new file mode 100644 index 000000000000..94f051c38089 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/LibrariesList/LibrarySidePane.tsx @@ -0,0 +1 @@ +export { default } from "ce/pages/AppIDE/components/LibrariesList/LibrarySidePane"; diff --git a/app/client/src/ee/pages/AppIDE/components/MissingModuleNotification.tsx b/app/client/src/ee/pages/AppIDE/components/MissingModuleNotification.tsx new file mode 100644 index 000000000000..a094d2a7640e --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/MissingModuleNotification.tsx @@ -0,0 +1 @@ +export { default } from "ce/pages/AppIDE/components/MissingModuleNotification"; diff --git a/app/client/src/ee/pages/AppIDE/components/QueryAdd/getQueryUrl.ts b/app/client/src/ee/pages/AppIDE/components/QueryAdd/getQueryUrl.ts new file mode 100644 index 000000000000..a59b13dbe80f --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/QueryAdd/getQueryUrl.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/QueryAdd/getQueryUrl"; diff --git a/app/client/src/ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx b/app/client/src/ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx new file mode 100644 index 000000000000..3646bf6b4537 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations"; diff --git a/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/ListItem.tsx b/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/ListItem.tsx new file mode 100644 index 000000000000..e135fd48eb69 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/ListItem.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/QueryEntityItem/ListItem"; diff --git a/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx b/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx new file mode 100644 index 000000000000..55a10cc704a0 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/components/QueryEntityItem/old/ListItem.tsx @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/components/QueryEntityItem/old/ListItem"; diff --git a/app/client/src/ee/pages/AppIDE/constants/SidebarButtons.ts b/app/client/src/ee/pages/AppIDE/constants/SidebarButtons.ts new file mode 100644 index 000000000000..aeff9352cfa5 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/constants/SidebarButtons.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/constants/SidebarButtons"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/components/Header/useLibraryHeaderTitle.ts b/app/client/src/ee/pages/AppIDE/layouts/components/Header/useLibraryHeaderTitle.ts new file mode 100644 index 000000000000..221527011870 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/components/Header/useLibraryHeaderTitle.ts @@ -0,0 +1,4 @@ +export * from "ce/pages/AppIDE/layout/components/Header/useLibraryHeaderTitle"; +import { default as CE_useLibraryHeaderTitle } from "ce/pages/AppIDE/layout/components/Header/useLibraryHeaderTitle"; + +export default CE_useLibraryHeaderTitle; diff --git a/app/client/src/ee/pages/AppIDE/layouts/constants.ts b/app/client/src/ee/pages/AppIDE/layouts/constants.ts new file mode 100644 index 000000000000..c7e950ee7e3d --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/constants.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/constants"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/routers/JSEditor/constants.ts b/app/client/src/ee/pages/AppIDE/layouts/routers/JSEditor/constants.ts new file mode 100644 index 000000000000..052c4890b8fc --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/routers/JSEditor/constants.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/routers/JSEditor/constants"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/routers/MainPane/constants.ts b/app/client/src/ee/pages/AppIDE/layouts/routers/MainPane/constants.ts new file mode 100644 index 000000000000..759ac293a9ad --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/routers/MainPane/constants.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/routers/MainPane/constants"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/routers/QueryEditor/constants.ts b/app/client/src/ee/pages/AppIDE/layouts/routers/QueryEditor/constants.ts new file mode 100644 index 000000000000..c2c6b0160c26 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/routers/QueryEditor/constants.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/routers/QueryEditor/constants"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getJSEntityItemUrl.ts b/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getJSEntityItemUrl.ts new file mode 100644 index 000000000000..641c0cd30235 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getJSEntityItemUrl.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/routers/utils/getJSEntityItemUrl"; diff --git a/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl.ts b/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl.ts new file mode 100644 index 000000000000..672054af4308 --- /dev/null +++ b/app/client/src/ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl.ts @@ -0,0 +1 @@ +export * from "ce/pages/AppIDE/layout/routers/utils/getQueryEntityItemUrl"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/ListItem.tsx b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/ListItem.tsx deleted file mode 100644 index 3a8da7ac5f2e..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/ListItem.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/ListItem"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/hooks.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/hooks.ts deleted file mode 100644 index b01cb009eb39..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/hooks.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/hooks"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx deleted file mode 100644 index f105e9a1ae28..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/old/ListItem.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/old/ListItem"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx deleted file mode 100644 index 99126fb72c65..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts deleted file mode 100644 index eb6c0e73e7d1..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts deleted file mode 100644 index c66a8e2720fa..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/JS/utils/getJSUrl"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/ListItem.tsx b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/ListItem.tsx deleted file mode 100644 index f317e60ddfe1..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/ListItem.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/ListItem"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/hooks.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/hooks.ts deleted file mode 100644 index 0a65f7542f9a..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/hooks.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/hooks"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx deleted file mode 100644 index 4157586a5aaa..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/old/ListItem.tsx +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/old/ListItem"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.ts deleted file mode 100644 index efb2008a1132..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts deleted file mode 100644 index 33b8b6cade89..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts deleted file mode 100644 index 75a6d60c4def..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/Query/utils/getQueryUrl"; diff --git a/app/client/src/ee/pages/Editor/IDE/EditorPane/constants.ts b/app/client/src/ee/pages/Editor/IDE/EditorPane/constants.ts deleted file mode 100644 index 26640e753188..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/EditorPane/constants.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/EditorPane/constants"; diff --git a/app/client/src/ee/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts b/app/client/src/ee/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts deleted file mode 100644 index 0b81d5d9afea..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/Header/useLibraryHeaderTitle.ts +++ /dev/null @@ -1,3 +0,0 @@ -export * from "ce/pages/Editor/IDE/Header/useLibraryHeaderTitle"; -import { default as CE_useLibraryHeaderTitle } from "ce/pages/Editor/IDE/Header/useLibraryHeaderTitle"; -export default CE_useLibraryHeaderTitle; diff --git a/app/client/src/ee/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx b/app/client/src/ee/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx deleted file mode 100644 index 20fb8b49fe3d..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/LeftPane/LibrarySidePane.tsx +++ /dev/null @@ -1,3 +0,0 @@ -export * from "ce/pages/Editor/IDE/LeftPane/LibrarySidePane"; -import { default as CE_LibrarySidePane } from "ce/pages/Editor/IDE/LeftPane/LibrarySidePane"; -export default CE_LibrarySidePane; diff --git a/app/client/src/ee/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx b/app/client/src/ee/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx deleted file mode 100644 index 35bca4999e33..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/MainPane/useMissingModuleNotification.tsx +++ /dev/null @@ -1,3 +0,0 @@ -export * from "ce/pages/Editor/IDE/MainPane/useMissingModuleNotification"; -import { default as CE_useMissingModuleNotification } from "ce/pages/Editor/IDE/MainPane/useMissingModuleNotification"; -export default CE_useMissingModuleNotification; diff --git a/app/client/src/ee/pages/Editor/IDE/MainPane/useRoutes.ts b/app/client/src/ee/pages/Editor/IDE/MainPane/useRoutes.ts deleted file mode 100644 index 4763e97ad4c8..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/MainPane/useRoutes.ts +++ /dev/null @@ -1,3 +0,0 @@ -export * from "ce/pages/Editor/IDE/MainPane/useRoutes"; -import { default as useCE_Routes } from "ce/pages/Editor/IDE/MainPane/useRoutes"; -export default useCE_Routes; diff --git a/app/client/src/ee/pages/Editor/IDE/constants/SidebarButtons.ts b/app/client/src/ee/pages/Editor/IDE/constants/SidebarButtons.ts deleted file mode 100644 index 56e6a6d8fa98..000000000000 --- a/app/client/src/ee/pages/Editor/IDE/constants/SidebarButtons.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/pages/Editor/IDE/constants/SidebarButtons"; diff --git a/app/client/src/layoutSystems/common/dropTarget/OnBoarding/OnBoarding.test.tsx b/app/client/src/layoutSystems/common/dropTarget/OnBoarding/OnBoarding.test.tsx index b07105cd2196..41e8d538a155 100644 --- a/app/client/src/layoutSystems/common/dropTarget/OnBoarding/OnBoarding.test.tsx +++ b/app/client/src/layoutSystems/common/dropTarget/OnBoarding/OnBoarding.test.tsx @@ -12,15 +12,20 @@ import { ThemeProvider } from "styled-components"; import Onboarding from "."; import { unitTestBaseMockStore } from "../unitTestUtils"; -jest.mock("pages/Editor/IDE/hooks", () => ({ +jest.mock("IDE/hooks/useCurrentAppState", () => ({ useCurrentAppState: jest.fn().mockReturnValue(EditorState.EDITOR), +})); + +jest.mock("pages/AppIDE/hooks/useCurrentEditorState", () => ({ useCurrentEditorState: jest.fn(), })); const mockStore = configureStore([]); const mockUseCurrentEditorStatePerTestCase = (segment: EditorEntityTab) => { /* eslint-disable @typescript-eslint/no-var-requires */ - const { useCurrentEditorState } = require("pages/Editor/IDE/hooks"); + const { + useCurrentEditorState, + } = require("pages/AppIDE/hooks/useCurrentEditorState"); useCurrentEditorState.mockImplementation(() => ({ segment, diff --git a/app/client/src/pages/Editor/index.tsx b/app/client/src/pages/AppIDE/AppIDE.tsx similarity index 85% rename from app/client/src/pages/Editor/index.tsx rename to app/client/src/pages/AppIDE/AppIDE.tsx index 746b7ca56733..bd00bd6aea6b 100644 --- a/app/client/src/pages/Editor/index.tsx +++ b/app/client/src/pages/AppIDE/AppIDE.tsx @@ -5,7 +5,7 @@ import type { RouteComponentProps } from "react-router-dom"; import { withRouter } from "react-router-dom"; import type { BuilderRouteParams } from "constants/routes"; import type { AppState } from "ee/reducers"; -import IDE from "./IDE"; +import IDE from "./layout"; import { getCurrentApplicationId, getIsEditorInitialized, @@ -24,55 +24,29 @@ import * as Sentry from "@sentry/react"; import { getTheme, ThemeMode } from "selectors/themeSelectors"; import { ThemeProvider } from "styled-components"; import type { Theme } from "constants/DefaultTheme"; -import GlobalHotKeys from "./GlobalHotKeys"; +import GlobalHotKeys from "pages/Editor/GlobalHotKeys"; import { setupPageAction, updateCurrentPage } from "actions/pageActions"; import { getCurrentPageId } from "selectors/editorSelectors"; import { getSearchQuery } from "utils/helpers"; -import ImportedApplicationSuccessModal from "./gitSync/ImportSuccessModal"; +import ImportedApplicationSuccessModal from "pages/Editor/gitSync/ImportSuccessModal"; import { getIsBranchUpdated } from "../utils"; import { APP_MODE } from "entities/App"; import { GIT_BRANCH_QUERY_KEY } from "constants/routes"; import TemplatesModal from "pages/Templates/TemplatesModal"; -import ReconnectDatasourceModal from "./gitSync/ReconnectDatasourceModal"; +import ReconnectDatasourceModal from "pages/Editor/gitSync/ReconnectDatasourceModal"; import { Spinner } from "@appsmith/ads"; import SignpostingOverlay from "pages/Editor/FirstTimeUserOnboarding/Overlay"; -import { editorInitializer } from "../../utils/editor/EditorUtils"; -import { widgetInitialisationSuccess } from "../../actions/widgetActions"; +import { editorInitializer } from "utils/editor/EditorUtils"; +import { widgetInitialisationSuccess } from "actions/widgetActions"; import urlBuilder from "ee/entities/URLRedirect/URLAssembly"; import { PartialExportModal } from "components/editorComponents/PartialImportExport/PartialExportModal"; import { PartialImportModal } from "components/editorComponents/PartialImportExport/PartialImportModal"; import type { Page } from "entities/Page"; import { AppCURLImportModal } from "ee/pages/Editor/CurlImport"; import { IDE_HEADER_HEIGHT } from "@appsmith/ads"; -import GeneratePageModal from "./GeneratePage"; -import { GitModals as NewGitModals } from "git"; -import GitSyncModal from "./gitSync/GitSyncModal"; -import GitSettingsModal from "./gitSync/GitSettingsModal"; -import DisconnectGitModal from "./gitSync/DisconnectGitModal"; -import DisableAutocommitModal from "./gitSync/DisableAutocommitModal"; -import ReconfigureCDKeyModal from "ee/components/gitComponents/ReconfigureCDKeyModal"; -import DisableCDModal from "ee/components/gitComponents/DisableCDModal"; -import RepoLimitExceededErrorModal from "./gitSync/RepoLimitExceededErrorModal"; -import { useGitModEnabled } from "./gitSync/hooks/modHooks"; +import GeneratePageModal from "pages/Editor/GeneratePage"; import GitApplicationContextProvider from "components/gitContexts/GitApplicationContextProvider"; - -function GitModals() { - const isGitModEnabled = useGitModEnabled(); - - return isGitModEnabled ? ( - - ) : ( - <> - - - - - - - - - ); -} +import { GitModals } from "./components/GitModals"; interface EditorProps { currentApplicationId?: string; diff --git a/app/client/src/pages/Editor/loader.tsx b/app/client/src/pages/AppIDE/AppIDELoader.tsx similarity index 57% rename from app/client/src/pages/Editor/loader.tsx rename to app/client/src/pages/AppIDE/AppIDELoader.tsx index 2e83a9c773b4..75a16a9f7030 100644 --- a/app/client/src/pages/Editor/loader.tsx +++ b/app/client/src/pages/AppIDE/AppIDELoader.tsx @@ -1,13 +1,14 @@ import React from "react"; +import type { RouteComponentProps } from "react-router"; +import { connect } from "react-redux"; + import PageLoadingBar from "pages/common/PageLoadingBar"; import { retryPromise } from "utils/AppsmithUtils"; -import { connect } from "react-redux"; import type { InitEditorActionPayload } from "actions/initActions"; import { initEditorAction } from "actions/initActions"; -import { getSearchQuery } from "../../utils/helpers"; -import { GIT_BRANCH_QUERY_KEY } from "../../constants/routes"; -import { APP_MODE } from "../../entities/App"; -import type { RouteComponentProps } from "react-router"; +import { getSearchQuery } from "utils/helpers"; +import { GIT_BRANCH_QUERY_KEY } from "constants/routes"; +import { APP_MODE } from "entities/App"; import { ReduxActionTypes } from "ee/constants/ReduxActionConstants"; type Props = { @@ -15,12 +16,11 @@ type Props = { clearCache: () => void; } & RouteComponentProps<{ basePageId: string }>; -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -class EditorLoader extends React.PureComponent { - // TODO: Fix this the next time the file is edited - // eslint-disable-next-line @typescript-eslint/no-explicit-any - constructor(props: any) { +class AppIDELoader extends React.PureComponent< + Props, + { Page: React.ComponentType | null } +> { + constructor(props: Props) { super(props); this.state = { @@ -50,7 +50,7 @@ class EditorLoader extends React.PureComponent { componentDidMount() { this.initialise(); retryPromise( - async () => import(/* webpackChunkName: "editor" */ "./index"), + async () => import(/* webpackChunkName: "AppIDE" */ "./AppIDE"), ).then((module) => { this.setState({ Page: module.default }); }); @@ -61,6 +61,7 @@ class EditorLoader extends React.PureComponent { clearCache(); } + render() { const { Page } = this.state; @@ -68,16 +69,9 @@ class EditorLoader extends React.PureComponent { } } -// TODO: Fix this the next time the file is edited -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const mapDispatchToProps = (dispatch: any) => { - return { - initEditor: (payload: InitEditorActionPayload) => - dispatch(initEditorAction(payload)), - clearCache: () => { - dispatch({ type: ReduxActionTypes.CLEAR_CACHE }); - }, - }; +const mapDispatchToProps = { + initEditor: (payload: InitEditorActionPayload) => initEditorAction(payload), + clearCache: () => ({ type: ReduxActionTypes.CLEAR_CACHE }), }; -export default connect(null, mapDispatchToProps)(EditorLoader); +export default connect(null, mapDispatchToProps)(AppIDELoader); diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/AppPluginActionToolbar.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/AppPluginActionToolbar.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/AppPluginActionToolbar.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/AppPluginActionToolbar.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/ConvertToModule.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/ConvertToModule.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/ConvertToModule.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/ConvertToModule.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Copy.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Copy.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Copy.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Copy.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Delete.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Delete.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Delete.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Delete.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Move.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Move.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Move.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Move.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/PageMenuItem.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/PageMenuItem.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/PageMenuItem.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/PageMenuItem.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Rename.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Rename.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/Rename.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/Rename.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/ShowBindings.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/ShowBindings.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/ShowBindings.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/ShowBindings.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/index.ts b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/index.ts similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ContextMenuItems/index.ts rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ContextMenuItems/index.ts diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleCallout.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleCallout.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleCallout.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleCallout.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleDisabler.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleDisabler.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleDisabler.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/ConvertToModuleDisabler.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/index.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/index.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ConvertToModule/index.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ConvertToModule/index.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ToolbarMenu/ToolbarMenu.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ToolbarMenu/ToolbarMenu.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ToolbarMenu/ToolbarMenu.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ToolbarMenu/ToolbarMenu.tsx diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/components/ToolbarMenu/index.ts b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ToolbarMenu/index.ts similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/components/ToolbarMenu/index.ts rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/components/ToolbarMenu/index.ts diff --git a/app/client/src/pages/Editor/AppPluginActionEditor/index.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/index.tsx similarity index 100% rename from app/client/src/pages/Editor/AppPluginActionEditor/index.tsx rename to app/client/src/pages/AppIDE/components/AppPluginActionEditor/index.tsx diff --git a/app/client/src/pages/AppIDE/components/AppPluginActionEditor/loader.tsx b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/loader.tsx new file mode 100644 index 000000000000..43e67b4980b0 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/AppPluginActionEditor/loader.tsx @@ -0,0 +1,20 @@ +import React, { lazy, Suspense } from "react"; +import { retryPromise } from "utils/AppsmithUtils"; +import Skeleton from "components/utils/Skeleton"; + +const LazyPluginActionEditor = lazy(async () => + retryPromise( + async () => + import(/* webpackChunkName: "AppPluginActionEditor" */ "./index"), + ), +); + +const AppPluginActionEditor = () => { + return ( + + + + ); +}; + +export default AppPluginActionEditor; diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/index.tsx b/app/client/src/pages/AppIDE/components/AppSettings/AppSettings.tsx similarity index 94% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/index.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/AppSettings.tsx index 4b36172798b2..2c54ce0dab2a 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/index.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/AppSettings.tsx @@ -5,11 +5,13 @@ import React, { useEffect, useState } from "react"; import { useDispatch, useSelector } from "react-redux"; import { selectAllPages } from "ee/selectors/entitiesSelector"; import styled from "styled-components"; -import GeneralSettings from "./GeneralSettings"; -import type { SectionHeaderProps } from "./SectionHeader"; -import SectionHeader from "./SectionHeader"; -import DraggablePageList from "./DraggablePageList"; -import PageSettings from "./PageSettings"; +import GeneralSettings from "./components/GeneralSettings"; +import { + SectionHeader, + type SectionHeaderProps, +} from "IDE/Components/SectionHeader"; +import DraggablePageList from "./components/DraggablePageList"; +import PageSettings from "./components/PageSettings"; import { getAppSettingsPane } from "selectors/appSettingsPaneSelectors"; import { APP_NAVIGATION_SETTING, @@ -25,12 +27,12 @@ import { UPDATE_VIA_IMPORT_SETTING, } from "ee/constants/messages"; import { Colors } from "constants/Colors"; -import EmbedSettings from "./EmbedSettings"; -import NavigationSettings from "./NavigationSettings"; +import EmbedSettings from "./components/EmbedSettings"; +import NavigationSettings from "./components/NavigationSettings"; import { updateAppSettingsPaneSelectedTabAction } from "actions/appSettingsPaneActions"; import AnalyticsUtil from "ee/utils/AnalyticsUtil"; import { Divider } from "@appsmith/ads"; -import { ImportAppSettings } from "./ImportAppSettings"; +import { ImportAppSettings } from "./components/ImportAppSettings"; import { getIsAnvilLayout } from "layoutSystems/anvil/integrations/selectors"; export enum AppSettingsTabs { diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/DraggablePageList.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/DraggablePageList.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/DraggablePageList.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/DraggablePageList.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/EmbedSettings/MakeApplicationForkable.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/EmbedSettings/MakeApplicationForkable.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/EmbedSettings/MakeApplicationForkable.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/EmbedSettings/MakeApplicationForkable.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/EmbedSettings/index.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/EmbedSettings/index.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/EmbedSettings/index.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/EmbedSettings/index.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/GeneralSettings.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/GeneralSettings.tsx similarity index 98% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/GeneralSettings.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/GeneralSettings.tsx index 43971cd560ff..27a7d35dec84 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/GeneralSettings.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/GeneralSettings.tsx @@ -19,7 +19,7 @@ import { } from "ee/selectors/applicationSelectors"; import { getCurrentApplicationId } from "selectors/editorSelectors"; import styled from "styled-components"; -import TextLoaderIcon from "../Components/TextLoaderIcon"; +import TextLoaderIcon from "./TextLoaderIcon"; const IconSelectorWrapper = styled.div` position: relative; diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/ImportAppSettings.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/ImportAppSettings.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/ImportAppSettings.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/ImportAppSettings.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ButtonGroupSetting.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ButtonGroupSetting.tsx similarity index 96% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ButtonGroupSetting.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ButtonGroupSetting.tsx index 609af9894b29..ccde4530b639 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ButtonGroupSetting.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ButtonGroupSetting.tsx @@ -8,7 +8,7 @@ import type { StringsFromNavigationSetting, } from "constants/AppConstants"; import { logEvent } from "./utils"; -import type { UpdateSetting } from "."; +import type { UpdateSetting } from "../../types"; const StyledSegmentedControl = styled(SegmentedControl)` > .ads-v2-segmented-control__segments-container { diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ColorStyleIcon.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ColorStyleIcon.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ColorStyleIcon.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ColorStyleIcon.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ImageInput.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ImageInput.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ImageInput.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/ImageInput.tsx diff --git a/app/client/src/pages/Editor/NavigationSettings/LogoInput.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/LogoInput.tsx similarity index 90% rename from app/client/src/pages/Editor/NavigationSettings/LogoInput.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/LogoInput.tsx index 537c404be796..502851e0d25f 100644 --- a/app/client/src/pages/Editor/NavigationSettings/LogoInput.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/LogoInput.tsx @@ -1,13 +1,13 @@ import React, { useEffect, useState } from "react"; -import { ImageInput } from "pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/ImageInput"; +import { ImageInput } from "./ImageInput"; import { Text } from "@appsmith/ads"; import { createMessage, APP_NAVIGATION_SETTING } from "ee/constants/messages"; -import type { UpdateSetting } from "pages/Editor/AppSettingsPane/AppSettings/NavigationSettings"; +import type { UpdateSetting } from "../../types"; import { useDispatch, useSelector } from "react-redux"; import { getCurrentApplicationId } from "selectors/editorSelectors"; import { ReduxActionTypes } from "ee/constants/ReduxActionConstants"; import type { NavigationSetting } from "constants/AppConstants"; -import { logoImageValidation } from "pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/utils"; +import { logoImageValidation } from "./utils"; import { getIsDeletingNavigationLogo, getIsUploadingNavigationLogo, diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/StyledPropertyHelpLabel.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/StyledPropertyHelpLabel.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/StyledPropertyHelpLabel.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/StyledPropertyHelpLabel.tsx diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSetting.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSetting.tsx similarity index 96% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSetting.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSetting.tsx index 17dc69dab95e..b49cab5c4137 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSetting.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSetting.tsx @@ -5,7 +5,7 @@ import type { } from "constants/AppConstants"; import StyledPropertyHelpLabel from "./StyledPropertyHelpLabel"; import { Switch } from "@appsmith/ads"; -import type { UpdateSetting } from "."; +import type { UpdateSetting } from "../../types"; import kebabCase from "lodash/kebabCase"; import { logEvent } from "./utils"; diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSettingForLogoConfiguration.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSettingForLogoConfiguration.tsx similarity index 95% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSettingForLogoConfiguration.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSettingForLogoConfiguration.tsx index 9e294c9c407a..6ac5552d6c31 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/SwitchSettingForLogoConfiguration.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/SwitchSettingForLogoConfiguration.tsx @@ -1,7 +1,7 @@ import React from "react"; import type { Dispatch, SetStateAction } from "react"; import { Switch } from "@appsmith/ads"; -import type { LogoConfigurationSwitches } from "."; +import type { LogoConfigurationSwitches } from "../../types"; import kebabCase from "lodash/kebabCase"; const SwitchSettingForLogoConfiguration = (props: { diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/index.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/index.tsx similarity index 97% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/index.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/index.tsx index e17e972369ff..30d4e9eda427 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/index.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/index.tsx @@ -13,19 +13,10 @@ import equal from "fast-deep-equal"; import { getCurrentApplicationId } from "selectors/editorSelectors"; import { updateApplication } from "ee/actions/applicationActions"; import { Spinner } from "@appsmith/ads"; -import LogoInput from "pages/Editor/NavigationSettings/LogoInput"; +import LogoInput from "./LogoInput"; import SwitchSettingForLogoConfiguration from "./SwitchSettingForLogoConfiguration"; import { selectFeatureFlags } from "ee/selectors/featureFlagsSelectors"; - -export type UpdateSetting = ( - key: keyof NavigationSetting, - value: NavigationSetting[keyof NavigationSetting], -) => void; - -export interface LogoConfigurationSwitches { - logo: boolean; - applicationTitle: boolean; -} +import type { LogoConfigurationSwitches } from "../../types"; function NavigationSettings() { const application = useSelector(getCurrentApplication); diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/utils.ts b/app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/utils.ts similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/NavigationSettings/utils.ts rename to app/client/src/pages/AppIDE/components/AppSettings/components/NavigationSettings/utils.ts diff --git a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/PageSettings.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/PageSettings.tsx similarity index 99% rename from app/client/src/pages/Editor/AppSettingsPane/AppSettings/PageSettings.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/PageSettings.tsx index 0f55e54b6845..06f83f851b79 100644 --- a/app/client/src/pages/Editor/AppSettingsPane/AppSettings/PageSettings.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/components/PageSettings.tsx @@ -29,8 +29,8 @@ import { import { getUpdatingEntity } from "selectors/explorerSelector"; import { getPageLoadingState } from "selectors/pageListSelectors"; import styled from "styled-components"; -import TextLoaderIcon from "../Components/TextLoaderIcon"; -import { filterAccentedAndSpecialCharacters, getUrlPreview } from "../Utils"; +import TextLoaderIcon from "./TextLoaderIcon"; +import { filterAccentedAndSpecialCharacters, getUrlPreview } from "../utils"; import type { AppState } from "ee/reducers"; import { getUsedActionNames } from "selectors/actionSelectors"; import { isNameValid, toValidPageName } from "utils/helpers"; diff --git a/app/client/src/pages/Editor/AppSettingsPane/Components/TextLoaderIcon.tsx b/app/client/src/pages/AppIDE/components/AppSettings/components/TextLoaderIcon.tsx similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/Components/TextLoaderIcon.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/components/TextLoaderIcon.tsx diff --git a/app/client/src/pages/Editor/IDE/LeftPane/AppSettings.tsx b/app/client/src/pages/AppIDE/components/AppSettings/index.tsx similarity index 76% rename from app/client/src/pages/Editor/IDE/LeftPane/AppSettings.tsx rename to app/client/src/pages/AppIDE/components/AppSettings/index.tsx index 516593261eb4..d5d5a7f0c2cc 100644 --- a/app/client/src/pages/Editor/IDE/LeftPane/AppSettings.tsx +++ b/app/client/src/pages/AppIDE/components/AppSettings/index.tsx @@ -1,10 +1,11 @@ import React from "react"; -import AppSettingsPane from "../../AppSettingsPane/AppSettings"; +import AppSettings from "./AppSettings"; import EditorSettingsPaneContainer from "pages/Editor/commons/EditorSettingsPaneContainer"; + const SettingsPane = () => { return ( - + ); }; diff --git a/app/client/src/pages/AppIDE/components/AppSettings/types.ts b/app/client/src/pages/AppIDE/components/AppSettings/types.ts new file mode 100644 index 000000000000..20edc86c441e --- /dev/null +++ b/app/client/src/pages/AppIDE/components/AppSettings/types.ts @@ -0,0 +1,11 @@ +import type { NavigationSetting } from "constants/AppConstants"; + +export type UpdateSetting = ( + key: keyof NavigationSetting, + value: NavigationSetting[keyof NavigationSetting], +) => void; + +export interface LogoConfigurationSwitches { + logo: boolean; + applicationTitle: boolean; +} diff --git a/app/client/src/pages/Editor/AppSettingsPane/Utils.ts b/app/client/src/pages/AppIDE/components/AppSettings/utils.ts similarity index 100% rename from app/client/src/pages/Editor/AppSettingsPane/Utils.ts rename to app/client/src/pages/AppIDE/components/AppSettings/utils.ts diff --git a/app/client/src/pages/AppIDE/components/GitModals.tsx b/app/client/src/pages/AppIDE/components/GitModals.tsx new file mode 100644 index 000000000000..8776aa89ef83 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/GitModals.tsx @@ -0,0 +1,30 @@ +import React from "react"; + +import { GitModals as NewGitModals } from "git"; + +import { useGitModEnabled } from "pages/Editor/gitSync/hooks/modHooks"; +import GitSyncModal from "pages/Editor/gitSync/GitSyncModal"; +import GitSettingsModal from "pages/Editor/gitSync/GitSettingsModal"; +import DisableCDModal from "ee/components/gitComponents/DisableCDModal"; +import ReconfigureCDKeyModal from "ee/components/gitComponents/ReconfigureCDKeyModal"; +import DisconnectGitModal from "pages/Editor/gitSync/DisconnectGitModal"; +import DisableAutocommitModal from "pages/Editor/gitSync/DisableAutocommitModal"; +import RepoLimitExceededErrorModal from "pages/Editor/gitSync/RepoLimitExceededErrorModal"; + +export function GitModals() { + const isGitModEnabled = useGitModEnabled(); + + return isGitModEnabled ? ( + + ) : ( + <> + + + + + + + + + ); +} diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/Add.tsx b/app/client/src/pages/AppIDE/components/JSAdd/JSAddView.tsx similarity index 91% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/Add.tsx rename to app/client/src/pages/AppIDE/components/JSAdd/JSAddView.tsx index 65b1cf5531ff..59c45d7ac0a0 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/Add.tsx +++ b/app/client/src/pages/AppIDE/components/JSAdd/JSAddView.tsx @@ -1,5 +1,5 @@ import React, { useCallback, useState } from "react"; -import SegmentAddHeader from "../components/SegmentAddHeader"; +import SegmentAddHeader from "IDE/Components/SegmentAddHeader"; import { EDITOR_PANE_TEXTS, createMessage } from "ee/constants/messages"; import type { ListItemProps } from "@appsmith/ads"; import { @@ -10,20 +10,17 @@ import { } from "@appsmith/ads"; import { useDispatch, useSelector } from "react-redux"; import { getCurrentPageId } from "selectors/editorSelectors"; -import { - useGroupedAddJsOperations, - useJSAdd, -} from "ee/pages/Editor/IDE/EditorPane/JS/hooks"; +import { useGroupedAddJsOperations } from "ee/pages/AppIDE/components/JSAdd/hooks"; +import { useJSAdd } from "./useJSAdd"; import type { ActionOperation } from "components/editorComponents/GlobalSearch/utils"; -import { createAddClassName } from "../utils"; import { FocusEntity } from "navigation/FocusEntity"; import { getIDEViewMode } from "selectors/ideSelectors"; import type { FlexProps } from "@appsmith/ads"; import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; import { filterEntityGroupsBySearchTerm } from "IDE/utils"; -import { DEFAULT_GROUP_LIST_SIZE } from "../../constants"; +import { createAddClassName, DEFAULT_GROUP_LIST_SIZE } from "../../constants"; -const AddJS = () => { +const JSAddView = () => { const dispatch = useDispatch(); const pageId = useSelector(getCurrentPageId); const [searchTerm, setSearchTerm] = useState(""); @@ -121,4 +118,4 @@ const AddJS = () => { ); }; -export default AddJS; +export default JSAddView; diff --git a/app/client/src/pages/AppIDE/components/JSAdd/index.ts b/app/client/src/pages/AppIDE/components/JSAdd/index.ts new file mode 100644 index 000000000000..91166193ff40 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/JSAdd/index.ts @@ -0,0 +1 @@ +export { useJSAdd } from "./useJSAdd"; diff --git a/app/client/src/pages/AppIDE/components/JSAdd/loader.tsx b/app/client/src/pages/AppIDE/components/JSAdd/loader.tsx new file mode 100644 index 000000000000..8c6769fe7271 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/JSAdd/loader.tsx @@ -0,0 +1,19 @@ +import React, { lazy, Suspense } from "react"; +import Skeleton from "components/utils/Skeleton"; +import { retryPromise } from "utils/AppsmithUtils"; + +const LazyAddJS = lazy(async () => + retryPromise( + async () => import(/* webpackChunkName: "AddJS" */ "./JSAddView"), + ), +); + +const AddJS = () => { + return ( + + + + ); +}; + +export default AddJS; diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/JSSegment.test.tsx b/app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.test.tsx similarity index 96% rename from app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/JSSegment.test.tsx rename to app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.test.tsx index 9aea26be92fd..8d4ac1a0f057 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/__tests__/JS/JSSegment.test.tsx +++ b/app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.test.tsx @@ -1,6 +1,6 @@ import React from "react"; import { renderHook, act } from "@testing-library/react-hooks"; -import { useJSAdd } from "../../JS/hooks"; +import { useJSAdd } from "./useJSAdd"; import { Provider } from "react-redux"; import type { Store } from "redux"; import { createStore } from "redux"; @@ -23,7 +23,7 @@ jest.mock("react-router", () => ({ }), })); -describe("JS Segment", () => { +describe("useJSAdd", () => { it("creates JS in the correct page", () => { const store = createStore(rootReducer, { entities: { diff --git a/app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.ts b/app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.ts new file mode 100644 index 000000000000..80335f1836af --- /dev/null +++ b/app/client/src/pages/AppIDE/components/JSAdd/useJSAdd.ts @@ -0,0 +1,54 @@ +import { useDispatch, useSelector } from "react-redux"; +import { getCurrentPageId } from "selectors/editorSelectors"; +import { FocusEntity, identifyEntityFromPath } from "navigation/FocusEntity"; +import { useModuleOptions } from "ee/utils/moduleInstanceHelpers"; +import { getIDEViewMode } from "selectors/ideSelectors"; +import { useCallback } from "react"; +import { createNewJSCollection } from "actions/jsPaneActions"; +import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; +import { setListViewActiveState } from "actions/ideActions"; +import { getJSUrl } from "ee/pages/AppIDE/components/JSAdd/getJSUrl"; +import history from "utils/history"; + +export const useJSAdd = () => { + const pageId = useSelector(getCurrentPageId); + const dispatch = useDispatch(); + const currentEntityInfo = identifyEntityFromPath(location.pathname); + const moduleCreationOptions = useModuleOptions(); + const jsModuleCreationOptions = moduleCreationOptions.filter( + (opt) => opt.focusEntityType === FocusEntity.JS_MODULE_INSTANCE, + ); + const ideViewMode = useSelector(getIDEViewMode); + + const openAddJS = useCallback(() => { + if (jsModuleCreationOptions.length === 0) { + dispatch(createNewJSCollection(pageId, "ENTITY_EXPLORER")); + } else { + if (currentEntityInfo.entity === FocusEntity.JS_OBJECT_ADD) { + if (ideViewMode === EditorViewMode.SplitScreen) { + dispatch(setListViewActiveState(false)); + } + + return; + } + + const url = getJSUrl(currentEntityInfo, true); + + history.push(url); + } + }, [ + jsModuleCreationOptions, + pageId, + dispatch, + currentEntityInfo, + ideViewMode, + ]); + + const closeAddJS = useCallback(() => { + const url = getJSUrl(currentEntityInfo, false); + + history.push(url); + }, [currentEntityInfo]); + + return { openAddJS, closeAddJS }; +}; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/EntityItem/AppJSContextMenuItems.tsx b/app/client/src/pages/AppIDE/components/JSEntityItem/AppJSContextMenuItems.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/EntityItem/AppJSContextMenuItems.tsx rename to app/client/src/pages/AppIDE/components/JSEntityItem/AppJSContextMenuItems.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/EntityItem/JSEntityItem.tsx b/app/client/src/pages/AppIDE/components/JSEntityItem/JSEntityItem.tsx similarity index 90% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/EntityItem/JSEntityItem.tsx rename to app/client/src/pages/AppIDE/components/JSEntityItem/JSEntityItem.tsx index 07f2ae1e8c56..90633dd6e2f3 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/EntityItem/JSEntityItem.tsx +++ b/app/client/src/pages/AppIDE/components/JSEntityItem/JSEntityItem.tsx @@ -9,7 +9,7 @@ import { getHasManageActionPermission } from "ee/utils/BusinessFeatures/permissi import AnalyticsUtil from "ee/utils/AnalyticsUtil"; import history, { NavigationMethod } from "utils/history"; import { saveJSObjectNameBasedOnIdeType } from "ee/actions/helpers"; -import { useNameEditorState } from "pages/Editor/IDE/EditorPane/hooks/useNameEditorState"; +import { useNameEditorState } from "IDE/hooks/useNameEditorState"; import { useValidateEntityName } from "IDE"; import { useLocation } from "react-router"; import { getIDETypeByUrl } from "ee/entities/IDE/utils"; @@ -18,8 +18,9 @@ import { useParentEntityInfo } from "ee/IDE/hooks/useParentEntityInfo"; import type { JSCollection } from "entities/JSCollection"; import { jsCollectionIdURL } from "ee/RouteBuilder"; import { JsFileIconV2 } from "pages/Editor/Explorer/ExplorerIcons"; -import { getJSContextMenuByIdeType } from "ee/pages/Editor/IDE/EditorPane/JS/utils/getJSContextMenuByIdeType"; +import { AppJSContextMenuItems } from "./AppJSContextMenuItems"; import type { EntityItem as EntityItemProps } from "ee/IDE/Interfaces/EntityItem"; +import EntityContextMenu from "IDE/Components/EntityContextMenu"; export const JSEntityItem = ({ item }: { item: EntityItemProps }) => { const jsAction = useSelector((state: AppState) => @@ -37,7 +38,14 @@ export const JSEntityItem = ({ item }: { item: EntityItemProps }) => { entityName: item.title, }); const dispatch = useDispatch(); - const contextMenu = getJSContextMenuByIdeType(ideType, jsAction); + const contextMenu = useMemo( + () => ( + + + + ), + [jsAction], + ); const jsActionPermissions = jsAction.userPermissions || []; diff --git a/app/client/src/pages/AppIDE/components/JSEntityItem/index.ts b/app/client/src/pages/AppIDE/components/JSEntityItem/index.ts new file mode 100644 index 000000000000..60b4ba96876d --- /dev/null +++ b/app/client/src/pages/AppIDE/components/JSEntityItem/index.ts @@ -0,0 +1 @@ +export { JSEntityItem } from "./JSEntityItem"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/BlankState.tsx b/app/client/src/pages/AppIDE/components/JSExplorer/BlankState.tsx similarity index 94% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/BlankState.tsx rename to app/client/src/pages/AppIDE/components/JSExplorer/BlankState.tsx index 7aa6667e02a3..48c8e1e611b8 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/BlankState.tsx +++ b/app/client/src/pages/AppIDE/components/JSExplorer/BlankState.tsx @@ -6,7 +6,7 @@ import { getPagePermissions } from "selectors/editorSelectors"; import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { getHasCreateActionPermission } from "ee/utils/BusinessFeatures/permissionPageHelpers"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; -import { useJSAdd } from "ee/pages/Editor/IDE/EditorPane/JS/hooks"; +import { useJSAdd } from "../JSAdd"; import { EmptyState } from "@appsmith/ads"; const BlankState: React.FC = () => { diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/Explorer.tsx b/app/client/src/pages/AppIDE/components/JSExplorer/Explorer.tsx similarity index 82% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/Explorer.tsx rename to app/client/src/pages/AppIDE/components/JSExplorer/Explorer.tsx index f568223ac4e1..c9f7272847d3 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/Explorer.tsx +++ b/app/client/src/pages/AppIDE/components/JSExplorer/Explorer.tsx @@ -1,5 +1,5 @@ import React from "react"; -import List from "./List"; +import { ListJSObjects } from "./JSSegmentList"; import { useSelector } from "react-redux"; import { getIDEViewMode } from "selectors/ideSelectors"; import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; @@ -8,7 +8,7 @@ const JSExplorer = () => { const ideViewMode = useSelector(getIDEViewMode); if (ideViewMode === EditorViewMode.FullScreen) { - return ; + return ; } return null; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/List.tsx b/app/client/src/pages/AppIDE/components/JSExplorer/JSSegmentList.tsx similarity index 94% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/List.tsx rename to app/client/src/pages/AppIDE/components/JSExplorer/JSSegmentList.tsx index 8be64a119f55..e4a4835c016f 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/List.tsx +++ b/app/client/src/pages/AppIDE/components/JSExplorer/JSSegmentList.tsx @@ -15,8 +15,8 @@ import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; import { ActionParentEntityType } from "ee/entities/Engine/actionHelpers"; import { FilesContextProvider } from "pages/Editor/Explorer/Files/FilesContextProvider"; -import { useJSAdd } from "ee/pages/Editor/IDE/EditorPane/JS/hooks"; -import { JSListItem } from "ee/pages/Editor/IDE/EditorPane/JS/old/ListItem"; +import { useJSAdd } from "../JSAdd"; +import { JSListItem } from "ee/pages/AppIDE/components/JSListItem/old/ListItem"; import { BlankState } from "./BlankState"; import { EDITOR_PANE_TEXTS, createMessage } from "ee/constants/messages"; import { filterEntityGroupsBySearchTerm } from "IDE/utils"; @@ -24,7 +24,7 @@ import { useLocation } from "react-router"; import { getIDETypeByUrl } from "ee/entities/IDE/utils"; import { useParentEntityInfo } from "ee/IDE/hooks/useParentEntityInfo"; import { useCreateActionsPermissions } from "ee/entities/IDE/hooks/useCreateActionsPermissions"; -import { JSEntity } from "ee/pages/Editor/IDE/EditorPane/JS/ListItem"; +import { JSEntity } from "ee/pages/AppIDE/components/JSListItem/ListItem"; import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; const JSContainer = styled(Flex)` @@ -34,7 +34,7 @@ const JSContainer = styled(Flex)` } `; -const ListJSObjects = () => { +export const ListJSObjects = () => { const [searchTerm, setSearchTerm] = useState(""); const itemGroups = useSelector(selectJSSegmentEditorList); const activeActionBaseId = useActiveActionBaseId(); @@ -140,5 +140,3 @@ const ListJSObjects = () => { ); }; - -export default ListJSObjects; diff --git a/app/client/src/pages/AppIDE/components/JSExplorer/index.tsx b/app/client/src/pages/AppIDE/components/JSExplorer/index.tsx new file mode 100644 index 000000000000..c408ad3c5006 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/JSExplorer/index.tsx @@ -0,0 +1,2 @@ +export { JSExplorer } from "./Explorer"; +export { ListJSObjects } from "./JSSegmentList"; diff --git a/app/client/src/pages/Editor/IDE/LeftPane/AddLibraryPopover.tsx b/app/client/src/pages/AppIDE/components/LibrariesList/AddLibraryPopover.tsx similarity index 95% rename from app/client/src/pages/Editor/IDE/LeftPane/AddLibraryPopover.tsx rename to app/client/src/pages/AppIDE/components/LibrariesList/AddLibraryPopover.tsx index 041520e3a457..c424e8df9c38 100644 --- a/app/client/src/pages/Editor/IDE/LeftPane/AddLibraryPopover.tsx +++ b/app/client/src/pages/AppIDE/components/LibrariesList/AddLibraryPopover.tsx @@ -8,7 +8,7 @@ import { } from "@appsmith/ads"; import React, { useCallback, useState } from "react"; import { createMessage, customJSLibraryMessages } from "ee/constants/messages"; -import { Installer } from "../../Explorer/Libraries/Installer"; +import { Installer } from "pages/Editor/Explorer/Libraries/Installer"; import { clearInstalls } from "actions/JSLibraryActions"; import { useDispatch } from "react-redux"; diff --git a/app/client/src/pages/Editor/IDE/LeftPane/JSLibrariesSection.tsx b/app/client/src/pages/AppIDE/components/LibrariesList/JSLibrariesSection.tsx similarity index 86% rename from app/client/src/pages/Editor/IDE/LeftPane/JSLibrariesSection.tsx rename to app/client/src/pages/AppIDE/components/LibrariesList/JSLibrariesSection.tsx index 23c238595413..4c89d1f2c48f 100644 --- a/app/client/src/pages/Editor/IDE/LeftPane/JSLibrariesSection.tsx +++ b/app/client/src/pages/AppIDE/components/LibrariesList/JSLibrariesSection.tsx @@ -1,7 +1,7 @@ import React, { useMemo } from "react"; -import PaneHeader from "pages/Editor/IDE/LeftPane/PaneHeader"; -import AddLibraryPopover from "pages/Editor/IDE/LeftPane/AddLibraryPopover"; +import PaneHeader from "IDE/Components/PaneHeader"; +import AddLibraryPopover from "./AddLibraryPopover"; import { selectLibrariesForExplorer } from "ee/selectors/entitiesSelector"; import { useSelector } from "react-redux"; import { animated, useTransition } from "react-spring"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Pages/AddPageContextMenu.tsx b/app/client/src/pages/AppIDE/components/PageList/AddPageContextMenu.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/Pages/AddPageContextMenu.tsx rename to app/client/src/pages/AppIDE/components/PageList/AddPageContextMenu.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Pages/PageContextMenu.tsx b/app/client/src/pages/AppIDE/components/PageList/PageContextMenu.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/Pages/PageContextMenu.tsx rename to app/client/src/pages/AppIDE/components/PageList/PageContextMenu.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Pages/PageElement.tsx b/app/client/src/pages/AppIDE/components/PageList/PageElement.tsx similarity index 98% rename from app/client/src/pages/Editor/IDE/EditorPane/Pages/PageElement.tsx rename to app/client/src/pages/AppIDE/components/PageList/PageElement.tsx index dcac18c33895..cc01b3bc8cc4 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Pages/PageElement.tsx +++ b/app/client/src/pages/AppIDE/components/PageList/PageElement.tsx @@ -19,7 +19,7 @@ import type { AppState } from "ee/reducers"; import { StyledEntity } from "pages/Editor/Explorer/Common/components"; import { toValidPageName } from "utils/helpers"; import { updatePageAction } from "actions/pageActions"; -import { useGetPageFocusUrl } from "pages/Editor/IDE/hooks"; +import { useGetPageFocusUrl } from "./hooks/useGetPageFocusUrl"; import AnalyticsUtil from "ee/utils/AnalyticsUtil"; import { toggleInOnboardingWidgetSelection } from "actions/onboardingActions"; import history, { NavigationMethod } from "utils/history"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Pages/PagesSection.tsx b/app/client/src/pages/AppIDE/components/PageList/PagesSection.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/Pages/PagesSection.tsx rename to app/client/src/pages/AppIDE/components/PageList/PagesSection.tsx diff --git a/app/client/src/pages/Editor/IDE/hooks.test.tsx b/app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.test.tsx similarity index 96% rename from app/client/src/pages/Editor/IDE/hooks.test.tsx rename to app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.test.tsx index 880f3bfa08dd..7dcdca58c0cf 100644 --- a/app/client/src/pages/Editor/IDE/hooks.test.tsx +++ b/app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.test.tsx @@ -2,12 +2,12 @@ import { renderHook } from "@testing-library/react-hooks"; import { hookWrapper } from "test/testUtils"; import { getIDETestState } from "test/factories/AppIDEFactoryUtils"; import { PageFactory } from "test/factories/PageFactory"; -import { useGetPageFocusUrl } from "./hooks"; +import { useGetPageFocusUrl } from "./useGetPageFocusUrl"; import { createPageFocusInfo } from "ee/navigation/FocusStrategy/AppIDEFocusStrategy"; const mockUseGitCurrentBranch = jest.fn(() => null); -jest.mock("../gitSync/hooks/modHooks", () => ({ +jest.mock("pages/Editor/gitSync/hooks/modHooks", () => ({ useGitCurrentBranch: () => mockUseGitCurrentBranch(), })); diff --git a/app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.ts b/app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.ts new file mode 100644 index 000000000000..8a11cd837d34 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/PageList/hooks/useGetPageFocusUrl.ts @@ -0,0 +1,31 @@ +import { useEffect, useState } from "react"; +import { builderURL } from "ee/RouteBuilder"; +import { useGitCurrentBranch } from "pages/Editor/gitSync/hooks/modHooks"; +import { useSelector } from "react-redux"; +import { getCurrentFocusInfo } from "selectors/focusHistorySelectors"; +import { createPageFocusInfoKey } from "ee/navigation/FocusStrategy/AppIDEFocusStrategy"; +import { FocusElement } from "navigation/FocusElements"; + +export const useGetPageFocusUrl = (basePageId: string): string => { + const [focusPageUrl, setFocusPageUrl] = useState(builderURL({ basePageId })); + + const branch = useGitCurrentBranch(); + + const pageStateFocusInfo = useSelector((appState) => + getCurrentFocusInfo(appState, createPageFocusInfoKey(basePageId, branch)), + ); + + useEffect( + function handleUpdateOfPageLink() { + if (pageStateFocusInfo) { + const lastSelectedEntity = + pageStateFocusInfo.state[FocusElement.SelectedEntity]; + + setFocusPageUrl(builderURL({ basePageId, suffix: lastSelectedEntity })); + } + }, + [pageStateFocusInfo, branch, basePageId], + ); + + return focusPageUrl; +}; diff --git a/app/client/src/pages/Editor/WidgetsEditor/components/PropertyPaneWrapper.tsx b/app/client/src/pages/AppIDE/components/PropertyPaneWrapper.tsx similarity index 82% rename from app/client/src/pages/Editor/WidgetsEditor/components/PropertyPaneWrapper.tsx rename to app/client/src/pages/AppIDE/components/PropertyPaneWrapper.tsx index 4c75e5619285..a402894196a5 100644 --- a/app/client/src/pages/Editor/WidgetsEditor/components/PropertyPaneWrapper.tsx +++ b/app/client/src/pages/AppIDE/components/PropertyPaneWrapper.tsx @@ -1,6 +1,6 @@ import React from "react"; import PropertyPaneSidebar from "components/editorComponents/PropertyPaneSidebar"; -import { CreateNewQueryModal } from "pages/Editor/IDE/RightPane/components/CreateNewQueryModal"; +import { CreateNewQueryModal } from "./QueryAdd/CreateNewQueryModal"; /** * PropertyPaneWrapper diff --git a/app/client/src/pages/Editor/IDE/ProtectedCallout.test.tsx b/app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.test.tsx similarity index 86% rename from app/client/src/pages/Editor/IDE/ProtectedCallout.test.tsx rename to app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.test.tsx index d735d5663d88..1cd6d891a2d6 100644 --- a/app/client/src/pages/Editor/IDE/ProtectedCallout.test.tsx +++ b/app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.test.tsx @@ -7,7 +7,7 @@ import { BrowserRouter } from "react-router-dom"; import "@testing-library/jest-dom"; import { ReduxActionTypes } from "ee/constants/ReduxActionConstants"; import store from "store"; -import ProtectedCallout from "./ProtectedCallout"; +import { ProtectedCallout } from "./ProtectedCallout"; // TODO: Fix this the next time the file is edited // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -41,11 +41,11 @@ const getMockStore = (override: Record = {}): any => { }); }; -jest.mock("./MainPane", () => () =>
); -jest.mock("./LeftPane", () => () =>
); -jest.mock("./RightPane", () => () =>
); -jest.mock("./Sidebar", () => () =>
); -jest.mock("components/BottomBar", () => () =>
); +jest.mock("../../layout/routers/MainPane/MainPane.tsx", () => () =>
); +jest.mock("../../layout/routers/LeftPane", () => () =>
); +jest.mock("../../layout/routers/RightPane", () => () =>
); +jest.mock("../../layout/routers/Sidebar", () => () =>
); +jest.mock("../../../../components/BottomBar", () => () =>
); const dispatch = jest.fn(); diff --git a/app/client/src/pages/Editor/IDE/ProtectedCallout.tsx b/app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.tsx similarity index 97% rename from app/client/src/pages/Editor/IDE/ProtectedCallout.tsx rename to app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.tsx index 9d2408bbeda4..1661e76a3781 100644 --- a/app/client/src/pages/Editor/IDE/ProtectedCallout.tsx +++ b/app/client/src/pages/AppIDE/components/ProtectedCallout/ProtectedCallout.tsx @@ -26,7 +26,7 @@ const StyledCallout = styled(Callout)` overflow-y: hidden; `; -function ProtectedCallout() { +export function ProtectedCallout() { const dispatch = useDispatch(); const isLoading = useSelector(getIsUpdateProtectedBranchesLoading); const currentBranch = useSelector(getCurrentGitBranch); @@ -75,5 +75,3 @@ function ProtectedCallout() { ); } - -export default ProtectedCallout; diff --git a/app/client/src/pages/AppIDE/components/ProtectedCallout/index.ts b/app/client/src/pages/AppIDE/components/ProtectedCallout/index.ts new file mode 100644 index 000000000000..c8b51ae0ad0a --- /dev/null +++ b/app/client/src/pages/AppIDE/components/ProtectedCallout/index.ts @@ -0,0 +1 @@ +export { ProtectedCallout } from "./ProtectedCallout"; diff --git a/app/client/src/pages/Editor/IDE/RightPane/components/CreateNewQueryModal.tsx b/app/client/src/pages/AppIDE/components/QueryAdd/CreateNewQueryModal.tsx similarity index 92% rename from app/client/src/pages/Editor/IDE/RightPane/components/CreateNewQueryModal.tsx rename to app/client/src/pages/AppIDE/components/QueryAdd/CreateNewQueryModal.tsx index c197ab609c79..84a648c1fd0c 100644 --- a/app/client/src/pages/Editor/IDE/RightPane/components/CreateNewQueryModal.tsx +++ b/app/client/src/pages/AppIDE/components/QueryAdd/CreateNewQueryModal.tsx @@ -9,7 +9,7 @@ import { import { useDispatch, useSelector } from "react-redux"; import { CREATE_A_NEW_ITEM, createMessage } from "ee/constants/messages"; -import { useGroupedAddQueryOperations } from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; +import { useGroupedAddQueryOperations } from "ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations"; import { getShowCreateNewModal } from "selectors/ideSelectors"; import { setShowQueryCreateNewModal } from "actions/ideActions"; import { DEFAULT_GROUP_LIST_SIZE } from "../../constants"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/Add.tsx b/app/client/src/pages/AppIDE/components/QueryAdd/QueryAddView.tsx similarity index 90% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/Add.tsx rename to app/client/src/pages/AppIDE/components/QueryAdd/QueryAddView.tsx index 36fef60ce41e..78c599bedfc7 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/Add.tsx +++ b/app/client/src/pages/AppIDE/components/QueryAdd/QueryAddView.tsx @@ -9,11 +9,9 @@ import { } from "@appsmith/ads"; import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; -import SegmentAddHeader from "../components/SegmentAddHeader"; -import { - useGroupedAddQueryOperations, - useQueryAdd, -} from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; +import SegmentAddHeader from "IDE/Components/SegmentAddHeader"; +import { useGroupedAddQueryOperations } from "ee/pages/AppIDE/components/QueryAdd/useGroupedAddQueryOperations"; +import { useQueryAdd } from "./useQueryAdd"; import { useSelector } from "react-redux"; import { getIDEViewMode } from "selectors/ideSelectors"; import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; diff --git a/app/client/src/pages/AppIDE/components/QueryAdd/index.ts b/app/client/src/pages/AppIDE/components/QueryAdd/index.ts new file mode 100644 index 000000000000..1b9a0b812d37 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/QueryAdd/index.ts @@ -0,0 +1 @@ +export { useQueryAdd } from "./useQueryAdd"; diff --git a/app/client/src/pages/AppIDE/components/QueryAdd/loader.tsx b/app/client/src/pages/AppIDE/components/QueryAdd/loader.tsx new file mode 100644 index 000000000000..2180702b13ac --- /dev/null +++ b/app/client/src/pages/AppIDE/components/QueryAdd/loader.tsx @@ -0,0 +1,19 @@ +import React, { lazy, Suspense } from "react"; +import { retryPromise } from "utils/AppsmithUtils"; +import Skeleton from "components/utils/Skeleton"; + +const LazyAddQuery = lazy(async () => + retryPromise( + async () => import(/* webpackChunkName: "AddQuery" */ "./QueryAddView"), + ), +); + +const QueryAdd = () => { + return ( + + + + ); +}; + +export default QueryAdd; diff --git a/app/client/src/pages/AppIDE/components/QueryAdd/useQueryAdd.tsx b/app/client/src/pages/AppIDE/components/QueryAdd/useQueryAdd.tsx new file mode 100644 index 000000000000..9744e2db0f34 --- /dev/null +++ b/app/client/src/pages/AppIDE/components/QueryAdd/useQueryAdd.tsx @@ -0,0 +1,38 @@ +import { useLocation } from "react-router"; +import { useDispatch, useSelector } from "react-redux"; +import { FocusEntity, identifyEntityFromPath } from "navigation/FocusEntity"; +import { getIDEViewMode } from "selectors/ideSelectors"; +import { useCallback } from "react"; +import { EditorViewMode } from "IDE/Interfaces/EditorTypes"; +import { setListViewActiveState } from "actions/ideActions"; +import { getQueryUrl } from "ee/pages/AppIDE/components/QueryAdd/getQueryUrl"; +import history from "utils/history"; + +export const useQueryAdd = () => { + const location = useLocation(); + const dispatch = useDispatch(); + const currentEntityInfo = identifyEntityFromPath(location.pathname); + const ideViewMode = useSelector(getIDEViewMode); + + const openAddQuery = useCallback(() => { + if (currentEntityInfo.entity === FocusEntity.QUERY_ADD) { + if (ideViewMode === EditorViewMode.SplitScreen) { + dispatch(setListViewActiveState(false)); + } + + return; + } + + const url = getQueryUrl(currentEntityInfo); + + history.push(url); + }, [currentEntityInfo, dispatch, ideViewMode]); + + const closeAddQuery = useCallback(() => { + const url = getQueryUrl(currentEntityInfo, false); + + history.push(url); + }, [currentEntityInfo]); + + return { openAddQuery, closeAddQuery }; +}; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/AppQueryContextMenuItems.tsx b/app/client/src/pages/AppIDE/components/QueryEntityItem/AppQueryContextMenuItems.tsx similarity index 95% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/AppQueryContextMenuItems.tsx rename to app/client/src/pages/AppIDE/components/QueryEntityItem/AppQueryContextMenuItems.tsx index b7253b6a9602..da0ea7d31cd9 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/AppQueryContextMenuItems.tsx +++ b/app/client/src/pages/AppIDE/components/QueryEntityItem/AppQueryContextMenuItems.tsx @@ -13,7 +13,7 @@ import { Move, Rename, ShowBindings, -} from "pages/Editor/AppPluginActionEditor/components/ContextMenuItems"; +} from "../AppPluginActionEditor/components/ContextMenuItems"; import { MenuSeparator } from "@appsmith/ads"; import { InspectStateMenuItem } from "components/editorComponents/Debugger/StateInspector/CTAs"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/QueryEntityItem.tsx b/app/client/src/pages/AppIDE/components/QueryEntityItem/QueryEntityItem.tsx similarity index 91% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/QueryEntityItem.tsx rename to app/client/src/pages/AppIDE/components/QueryEntityItem/QueryEntityItem.tsx index 9b045f6be8b8..c5891c93a7f8 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/EntityItem/QueryEntityItem.tsx +++ b/app/client/src/pages/AppIDE/components/QueryEntityItem/QueryEntityItem.tsx @@ -16,7 +16,7 @@ import type { Datasource } from "entities/Datasource"; import history, { NavigationMethod } from "utils/history"; import { keyBy } from "lodash"; import { saveActionNameBasedOnIdeType } from "ee/actions/helpers"; -import { useNameEditorState } from "pages/Editor/IDE/EditorPane/hooks/useNameEditorState"; +import { useNameEditorState } from "IDE/hooks/useNameEditorState"; import { useValidateEntityName } from "IDE"; import { useLocation } from "react-router"; import { getIDETypeByUrl } from "ee/entities/IDE/utils"; @@ -24,7 +24,8 @@ import { getActionConfig } from "pages/Editor/Explorer/Actions/helpers"; import { useActiveActionBaseId } from "ee/pages/Editor/Explorer/hooks"; import { PluginType } from "entities/Plugin"; import { useParentEntityInfo } from "ee/IDE/hooks/useParentEntityInfo"; -import { getQueryContextMenuByIdeType } from "ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryContextMenuByIdeType"; +import { AppQueryContextMenuItems } from "./AppQueryContextMenuItems"; +import EntityContextMenu from "IDE/Components/EntityContextMenu"; import type { EntityItem as EntityItemProps } from "ee/IDE/Interfaces/EntityItem"; export const QueryEntityItem = ({ item }: { item: EntityItemProps }) => { @@ -48,7 +49,14 @@ export const QueryEntityItem = ({ item }: { item: EntityItemProps }) => { entityName: item.title, }); const dispatch = useDispatch(); - const contextMenu = getQueryContextMenuByIdeType(ideType, action); + const contextMenu = useMemo( + () => ( + + + + ), + [action], + ); const actionPermissions = action.userPermissions || []; diff --git a/app/client/src/pages/AppIDE/components/QueryEntityItem/index.ts b/app/client/src/pages/AppIDE/components/QueryEntityItem/index.ts new file mode 100644 index 000000000000..ee7a2340fd2e --- /dev/null +++ b/app/client/src/pages/AppIDE/components/QueryEntityItem/index.ts @@ -0,0 +1 @@ +export { QueryEntityItem } from "./QueryEntityItem"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/BlankState.tsx b/app/client/src/pages/AppIDE/components/QueryExplorer/BlankState.tsx similarity index 94% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/BlankState.tsx rename to app/client/src/pages/AppIDE/components/QueryExplorer/BlankState.tsx index 623b0fafedad..8539dba07be3 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/BlankState.tsx +++ b/app/client/src/pages/AppIDE/components/QueryExplorer/BlankState.tsx @@ -7,7 +7,7 @@ import { getPagePermissions } from "selectors/editorSelectors"; import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; import { EmptyState } from "@appsmith/ads"; -import { useQueryAdd } from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; +import { useQueryAdd } from "../QueryAdd"; const BlankState: React.FC = () => { const pagePermissions = useSelector(getPagePermissions); diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/Explorer.tsx b/app/client/src/pages/AppIDE/components/QueryExplorer/Explorer.tsx similarity index 93% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/Explorer.tsx rename to app/client/src/pages/AppIDE/components/QueryExplorer/Explorer.tsx index 64720ed10089..2a644a686486 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/Explorer.tsx +++ b/app/client/src/pages/AppIDE/components/QueryExplorer/Explorer.tsx @@ -1,5 +1,5 @@ import React from "react"; -import List from "./List"; +import { ListQuery } from "./List"; import styled from "styled-components"; import { Flex } from "@appsmith/ads"; import { useSelector } from "react-redux"; @@ -24,7 +24,7 @@ const QueryExplorer = () => { height="100%" overflow="hidden" > - + ); } diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/List.tsx b/app/client/src/pages/AppIDE/components/QueryExplorer/List.tsx similarity index 93% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/List.tsx rename to app/client/src/pages/AppIDE/components/QueryExplorer/List.tsx index 66683f461bc7..1de34ab122fd 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/List.tsx +++ b/app/client/src/pages/AppIDE/components/QueryExplorer/List.tsx @@ -14,13 +14,13 @@ import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; import { selectQuerySegmentEditorList } from "ee/selectors/appIDESelectors"; import { ActionParentEntityType } from "ee/entities/Engine/actionHelpers"; import { FilesContextProvider } from "pages/Editor/Explorer/Files/FilesContextProvider"; -import { useQueryAdd } from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; -import { QueryListItem } from "ee/pages/Editor/IDE/EditorPane/Query/old/ListItem"; +import { useQueryAdd } from "../QueryAdd"; +import { QueryListItem } from "ee/pages/AppIDE/components/QueryEntityItem/old/ListItem"; import { getShowWorkflowFeature } from "ee/selectors/workflowSelectors"; import { BlankState } from "./BlankState"; import { EDITOR_PANE_TEXTS, createMessage } from "ee/constants/messages"; import { filterEntityGroupsBySearchTerm } from "IDE/utils"; -import { ActionEntityItem } from "ee/pages/Editor/IDE/EditorPane/Query/ListItem"; +import { ActionEntityItem } from "ee/pages/AppIDE/components/QueryEntityItem/ListItem"; import { useLocation } from "react-router"; import { getIDETypeByUrl } from "ee/entities/IDE/utils"; import { useParentEntityInfo } from "ee/IDE/hooks/useParentEntityInfo"; @@ -28,7 +28,7 @@ import { useCreateActionsPermissions } from "ee/entities/IDE/hooks/useCreateActi import { objectKeys } from "@appsmith/utils"; import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; -const ListQuery = () => { +export const ListQuery = () => { const [searchTerm, setSearchTerm] = useState(""); const itemGroups = useSelector(selectQuerySegmentEditorList); const activeActionBaseId = useActiveActionBaseId(); @@ -134,5 +134,3 @@ const ListQuery = () => { ); }; - -export default ListQuery; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/index.tsx b/app/client/src/pages/AppIDE/components/QueryExplorer/index.tsx similarity index 52% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/index.tsx rename to app/client/src/pages/AppIDE/components/QueryExplorer/index.tsx index 27d92d39df27..4849ce2f108b 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/index.tsx +++ b/app/client/src/pages/AppIDE/components/QueryExplorer/index.tsx @@ -1,2 +1,2 @@ -export { QueryEditor } from "./Editor"; export { QueryExplorer } from "./Explorer"; +export { ListQuery } from "./List"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/UIEntityListTree.tsx b/app/client/src/pages/AppIDE/components/UIEntityListTree/UIEntityListTree.tsx similarity index 97% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/UIEntityListTree.tsx rename to app/client/src/pages/AppIDE/components/UIEntityListTree/UIEntityListTree.tsx index de93158cfbad..49785b554e6e 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/UIEntityListTree.tsx +++ b/app/client/src/pages/AppIDE/components/UIEntityListTree/UIEntityListTree.tsx @@ -14,7 +14,7 @@ import { useSwitchToWidget } from "./hooks/useSwitchToWidget"; import { WidgetTypeIcon } from "./WidgetTypeIcon"; import { useWidgetTreeState } from "./hooks/useWidgetTreeExpandedState"; import { enhanceItemsTree } from "./utils/enhanceTree"; -import { useNameEditorState } from "../../hooks/useNameEditorState"; +import { useNameEditorState } from "IDE/hooks/useNameEditorState"; export const UIEntityListTree = () => { const widgets = useSelector(selectWidgetsForCurrentPage); diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/WidgetContextMenu.tsx b/app/client/src/pages/AppIDE/components/UIEntityListTree/WidgetContextMenu.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/WidgetContextMenu.tsx rename to app/client/src/pages/AppIDE/components/UIEntityListTree/WidgetContextMenu.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/WidgetTypeIcon.tsx b/app/client/src/pages/AppIDE/components/UIEntityListTree/WidgetTypeIcon.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/WidgetTypeIcon.tsx rename to app/client/src/pages/AppIDE/components/UIEntityListTree/WidgetTypeIcon.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useDeleteWidget.ts b/app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useDeleteWidget.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useDeleteWidget.ts rename to app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useDeleteWidget.ts diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useSwitchToWidget.ts b/app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useSwitchToWidget.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useSwitchToWidget.ts rename to app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useSwitchToWidget.ts diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useWidgetTreeExpandedState.ts b/app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useWidgetTreeExpandedState.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/hooks/useWidgetTreeExpandedState.ts rename to app/client/src/pages/AppIDE/components/UIEntityListTree/hooks/useWidgetTreeExpandedState.ts diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/index.ts b/app/client/src/pages/AppIDE/components/UIEntityListTree/index.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/index.ts rename to app/client/src/pages/AppIDE/components/UIEntityListTree/index.ts diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/utils/enhanceTree.ts b/app/client/src/pages/AppIDE/components/UIEntityListTree/utils/enhanceTree.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIEntityListTree/utils/enhanceTree.ts rename to app/client/src/pages/AppIDE/components/UIEntityListTree/utils/enhanceTree.ts diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/List.test.tsx b/app/client/src/pages/AppIDE/components/UIList/UIList.test.tsx similarity index 99% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/List.test.tsx rename to app/client/src/pages/AppIDE/components/UIList/UIList.test.tsx index 09b7af082f59..f08fa800d7e9 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/List.test.tsx +++ b/app/client/src/pages/AppIDE/components/UIList/UIList.test.tsx @@ -13,7 +13,7 @@ import { MAIN_CONTAINER_WIDGET_ID } from "constants/WidgetConstants"; import * as widgetSelectionsActions from "actions/widgetSelectionActions"; import { SelectionRequestType } from "sagas/WidgetSelectUtils"; import { NavigationMethod } from "utils/history"; -import ListWidgets from "./List"; +import ListWidgets from "./UIList"; jest.useFakeTimers(); const pushState = jest.spyOn(window.history, "pushState"); diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/List.tsx b/app/client/src/pages/AppIDE/components/UIList/UIList.tsx similarity index 98% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/List.tsx rename to app/client/src/pages/AppIDE/components/UIList/UIList.tsx index 843e9b33ecc8..c0abf2930da8 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/List.tsx +++ b/app/client/src/pages/AppIDE/components/UIList/UIList.tsx @@ -11,7 +11,7 @@ import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import { EmptyState } from "@appsmith/ads"; import history from "utils/history"; import { builderURL } from "ee/RouteBuilder"; -import { UIEntityListTree } from "./UIEntityListTree"; +import { UIEntityListTree } from "../UIEntityListTree"; import { OldWidgetEntityList } from "pages/Editor/Explorer/Widgets/OldWidgetEntityList"; const ListWidgets = (props: { diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/Add.tsx b/app/client/src/pages/AppIDE/components/WidgetAdd.tsx similarity index 96% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/Add.tsx rename to app/client/src/pages/AppIDE/components/WidgetAdd.tsx index 6b37d8c40638..129147dfb763 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/Add.tsx +++ b/app/client/src/pages/AppIDE/components/WidgetAdd.tsx @@ -4,7 +4,7 @@ import { useSelector } from "react-redux"; import styled from "styled-components"; import history from "utils/history"; -import UIEntitySidebar from "pages/Editor/widgetSidebar/UIEntitySidebar"; +import UIEntitySidebar from "../../Editor/widgetSidebar/UIEntitySidebar"; import { widgetListURL } from "ee/RouteBuilder"; import { EDITOR_PANE_TEXTS, createMessage } from "ee/constants/messages"; import { getCurrentBasePageId } from "selectors/editorSelectors"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/utils.ts b/app/client/src/pages/AppIDE/constants.ts similarity index 76% rename from app/client/src/pages/Editor/IDE/EditorPane/utils.ts rename to app/client/src/pages/AppIDE/constants.ts index cb43762c7af7..b039e9841f7c 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/utils.ts +++ b/app/client/src/pages/AppIDE/constants.ts @@ -1,3 +1,5 @@ +export const DEFAULT_GROUP_LIST_SIZE = 5; + export const createAddClassName = (name: string) => { return "t--datasoucre-create-option-" + name.toLowerCase().replace(/ /g, "_"); }; diff --git a/app/client/src/pages/AppIDE/hooks/useCurrentEditorState.ts b/app/client/src/pages/AppIDE/hooks/useCurrentEditorState.ts new file mode 100644 index 000000000000..5373e2f5388f --- /dev/null +++ b/app/client/src/pages/AppIDE/hooks/useCurrentEditorState.ts @@ -0,0 +1,35 @@ +import { useEffect, useState } from "react"; +import { + EditorEntityTab, + EditorEntityTabState, +} from "IDE/Interfaces/EditorTypes"; +import { useLocation } from "react-router"; +import { identifyEntityFromPath } from "navigation/FocusEntity"; +import { getCurrentEntityInfo } from "IDE/utils/getCurrentEntityInfo"; + +export const useCurrentEditorState = () => { + const [selectedSegment, setSelectedSegment] = useState( + EditorEntityTab.UI, + ); + const [selectedSegmentState, setSelectedSegmentState] = + useState(EditorEntityTabState.Edit); + + const location = useLocation(); + + /** + * useEffect to identify the entity from the path + * + */ + useEffect(() => { + const { entity } = identifyEntityFromPath(location.pathname); + const { segment, segmentMode } = getCurrentEntityInfo(entity); + + setSelectedSegment(segment); + setSelectedSegmentState(segmentMode); + }, [location.pathname]); + + return { + segment: selectedSegment, + segmentMode: selectedSegmentState, + }; +}; diff --git a/app/client/src/pages/AppIDE/index.ts b/app/client/src/pages/AppIDE/index.ts new file mode 100644 index 000000000000..0b2006699f08 --- /dev/null +++ b/app/client/src/pages/AppIDE/index.ts @@ -0,0 +1 @@ +export { default } from "./AppIDELoader"; diff --git a/app/client/src/pages/Editor/IDE/Layout/AnimatedLayout.tsx b/app/client/src/pages/AppIDE/layout/AnimatedLayout.tsx similarity index 87% rename from app/client/src/pages/Editor/IDE/Layout/AnimatedLayout.tsx rename to app/client/src/pages/AppIDE/layout/AnimatedLayout.tsx index bc6d2970d014..312957bdeb05 100644 --- a/app/client/src/pages/Editor/IDE/Layout/AnimatedLayout.tsx +++ b/app/client/src/pages/AppIDE/layout/AnimatedLayout.tsx @@ -2,18 +2,19 @@ import React from "react"; import { useGridLayoutTemplate } from "./hooks/useGridLayoutTemplate"; import EditorWrapperContainer from "pages/Editor/commons/EditorWrapperContainer"; import { AnimatedGridLayout, LayoutArea } from "components/AnimatedGridLayout"; -import BottomBar from "components/BottomBar"; -import Sidebar from "../Sidebar"; -import LeftPane from "../LeftPane"; -import MainPane from "../MainPane"; -import RightPane from "../RightPane"; -import { Areas } from "./constants"; -import ProtectedCallout from "../ProtectedCallout"; import { useGitModEnabled, useGitProtectedMode, } from "pages/Editor/gitSync/hooks/modHooks"; import { GitProtectedBranchCallout as GitProtectedBranchCalloutNew } from "git"; +import BottomBar from "components/BottomBar"; + +import Sidebar from "./routers/Sidebar"; +import LeftPane from "./routers/LeftPane"; +import MainPane from "./routers/MainPane"; +import RightPane from "./routers/RightPane"; +import { Areas } from "./constants"; +import { ProtectedCallout } from "../components/ProtectedCallout"; function GitProtectedBranchCallout() { const isGitModEnabled = useGitModEnabled(); diff --git a/app/client/src/pages/Editor/IDE/Layout/StaticLayout.tsx b/app/client/src/pages/AppIDE/layout/StaticLayout.tsx similarity index 85% rename from app/client/src/pages/Editor/IDE/Layout/StaticLayout.tsx rename to app/client/src/pages/AppIDE/layout/StaticLayout.tsx index f64c4a8f3351..38dfb21e9db6 100644 --- a/app/client/src/pages/Editor/IDE/Layout/StaticLayout.tsx +++ b/app/client/src/pages/AppIDE/layout/StaticLayout.tsx @@ -1,20 +1,21 @@ import React from "react"; - -import BottomBar from "components/BottomBar"; -import EditorWrapperContainer from "../../commons/EditorWrapperContainer"; -import Sidebar from "pages/Editor/IDE/Sidebar"; -import LeftPane from "../LeftPane"; -import MainPane from "../MainPane"; -import RightPane from "../RightPane"; -import ProtectedCallout from "../ProtectedCallout"; -import { useGridLayoutTemplate } from "./hooks/useGridLayoutTemplate"; import styled from "styled-components"; -import { Areas } from "./constants"; + import { useGitModEnabled, useGitProtectedMode, } from "pages/Editor/gitSync/hooks/modHooks"; import { GitProtectedBranchCallout as GitProtectedBranchCalloutNew } from "git"; +import BottomBar from "components/BottomBar"; +import EditorWrapperContainer from "pages/Editor/commons/EditorWrapperContainer"; + +import Sidebar from "./routers/Sidebar"; +import LeftPane from "./routers/LeftPane"; +import MainPane from "./routers/MainPane"; +import RightPane from "./routers/RightPane"; +import { ProtectedCallout } from "../components/ProtectedCallout"; +import { useGridLayoutTemplate } from "./hooks/useGridLayoutTemplate"; +import { Areas } from "./constants"; function GitProtectedBranchCallout() { const isGitModEnabled = useGitModEnabled(); diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Editor.tsx b/app/client/src/pages/AppIDE/layout/components/Editor.tsx similarity index 81% rename from app/client/src/pages/Editor/IDE/EditorPane/Editor.tsx rename to app/client/src/pages/AppIDE/layout/components/Editor.tsx index 9e5c1724c56c..5b8bab55c841 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Editor.tsx +++ b/app/client/src/pages/AppIDE/layout/components/Editor.tsx @@ -5,16 +5,17 @@ import { SentryRoute } from "ee/AppRouter"; import { jsSegmentRoutes, querySegmentRoutes, -} from "ee/pages/Editor/IDE/EditorPane/constants"; -import { JSEditorPane } from "./JS"; -import { QueryEditor } from "./Query"; -import EditorTabs from "../EditorTabs"; -import { useCurrentEditorState } from "../hooks"; +} from "ee/pages/AppIDE/layouts/constants"; +import { JSEditorPane } from "../routers/JSEditor"; +import { QueryEditor } from "../routers/QueryEditor"; +import EditorTabs from "./EditorTabs"; +import { useCurrentEditorState } from "../../hooks/useCurrentEditorState"; import { EditorEntityTab } from "IDE/Interfaces/EditorTypes"; import styled from "styled-components"; const Container = styled(Flex)` // Animating using https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API + & { view-transition-name: editor-pane; } diff --git a/app/client/src/pages/Editor/IDE/EditorPane/index.tsx b/app/client/src/pages/AppIDE/layout/components/EditorPane.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorPane/index.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorPane.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/AddTab.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/AddTab.tsx similarity index 93% rename from app/client/src/pages/Editor/IDE/EditorTabs/AddTab.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/AddTab.tsx index 2ff7276bb464..e156d879c760 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/AddTab.tsx +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/AddTab.tsx @@ -8,7 +8,7 @@ import { EditorEntityTabState, } from "IDE/Interfaces/EditorTypes"; -import { useCurrentEditorState } from "../hooks"; +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; const AddTab = ({ isListActive, diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/EditableTab.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/EditableTab.tsx similarity index 96% rename from app/client/src/pages/Editor/IDE/EditorTabs/EditableTab.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/EditableTab.tsx index 3515400dffc0..a4a9dea726d6 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/EditableTab.tsx +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/EditableTab.tsx @@ -17,7 +17,7 @@ import { } from "ee/entities/IDE/utils"; import { useIsRenaming, useValidateEntityName } from "IDE"; -import { useCurrentEditorState } from "../hooks"; +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; interface EditableTabProps { id: string; diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/Editortabs.test.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/Editortabs.test.tsx similarity index 99% rename from app/client/src/pages/Editor/IDE/EditorTabs/Editortabs.test.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/Editortabs.test.tsx index 1ea582539b14..248ecb43586a 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/Editortabs.test.tsx +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/Editortabs.test.tsx @@ -1,6 +1,6 @@ import React from "react"; import { fireEvent, render } from "test/testUtils"; -import EditorTabs from "."; +import EditorTabs from "./index"; import { getIDETestState } from "test/factories/AppIDEFactoryUtils"; import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes"; import { Route } from "react-router-dom"; diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/List.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/List.tsx similarity index 78% rename from app/client/src/pages/Editor/IDE/EditorTabs/List.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/List.tsx index 0960d23cf99d..535bf37cff44 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/List.tsx +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/List.tsx @@ -2,10 +2,10 @@ import React from "react"; import styled from "styled-components"; import { Flex } from "@appsmith/ads"; -import { useCurrentEditorState } from "../hooks"; +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; import { EditorEntityTab } from "IDE/Interfaces/EditorTypes"; -import ListQuery from "../EditorPane/Query/List"; -import ListJSObjects from "../EditorPane/JS/List"; +import { ListQuery } from "../../../components/QueryExplorer"; +import { ListJSObjects } from "../../../components/JSExplorer"; const ListContainer = styled(Flex)` position: absolute; diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/ScreenModeToggle.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/ScreenModeToggle.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/EditorTabs/ScreenModeToggle.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/ScreenModeToggle.tsx diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/constants.ts b/app/client/src/pages/AppIDE/layout/components/EditorTabs/constants.ts similarity index 84% rename from app/client/src/pages/Editor/IDE/EditorTabs/constants.ts rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/constants.ts index 04e87813d3bd..5f527a6a20bd 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/constants.ts +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/constants.ts @@ -8,8 +8,8 @@ import { getJSSegmentItems, getQuerySegmentItems, } from "ee/selectors/entitiesSelector"; -import { getJSEntityItemUrl } from "ee/pages/Editor/IDE/EditorPane/JS/utils/getJSEntityItemUrl"; -import { getQueryEntityItemUrl } from "ee/pages/Editor/IDE/EditorPane/Query/utils/getQueryEntityItemUrl"; +import { getJSEntityItemUrl } from "ee/pages/AppIDE/layouts/routers/utils/getJSEntityItemUrl"; +import { getQueryEntityItemUrl } from "ee/pages/AppIDE/layouts/routers/utils/getQueryEntityItemUrl"; import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; export const TabSelectors: Record< diff --git a/app/client/src/pages/AppIDE/layout/components/EditorTabs/hooks.ts b/app/client/src/pages/AppIDE/layout/components/EditorTabs/hooks.ts new file mode 100644 index 000000000000..0af3ebc99284 --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/hooks.ts @@ -0,0 +1,96 @@ +import { useDispatch, useSelector } from "react-redux"; +import { useJSAdd } from "../../../components/JSAdd"; +import { useQueryAdd } from "../../../components/QueryAdd"; +import { TabSelectors } from "./constants"; +import { getCurrentBasePageId } from "selectors/editorSelectors"; +import { useCallback } from "react"; +import { EditorEntityTab } from "IDE/Interfaces/EditorTypes"; +import type { EntityItem } from "ee/IDE/Interfaces/EntityItem"; +import history, { NavigationMethod } from "utils/history"; +import { closeJSActionTab } from "actions/jsActionActions"; +import { closeQueryActionTab } from "actions/pluginActionActions"; +import { isWidgetActionConnectionPresent } from "selectors/onboardingSelectors"; +import localStorage, { LOCAL_STORAGE_KEYS } from "utils/localStorage"; +import { useBoolean } from "usehooks-ts"; + +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; +import { useModuleOptions } from "ee/utils/moduleInstanceHelpers"; +import { FocusEntity } from "navigation/FocusEntity"; + +export const useIDETabClickHandlers = () => { + const dispatch = useDispatch(); + const { closeAddJS, openAddJS } = useJSAdd(); + const { closeAddQuery, openAddQuery } = useQueryAdd(); + const { segment, segmentMode } = useCurrentEditorState(); + const tabsConfig = TabSelectors[segment]; + const basePageId = useSelector(getCurrentBasePageId); + + const addClickHandler = useCallback(() => { + if (segment === EditorEntityTab.JS) openAddJS(); + + if (segment === EditorEntityTab.QUERIES) openAddQuery(); + }, [segment, segmentMode, openAddQuery, openAddJS]); + + const tabClickHandler = useCallback( + (item: EntityItem) => { + const navigateToUrl = tabsConfig.itemUrlSelector(item, basePageId); + + if (navigateToUrl !== history.location.pathname) { + history.push(navigateToUrl, { + invokedBy: NavigationMethod.EditorTabs, + }); + } + }, + [tabsConfig, basePageId], + ); + + const closeClickHandler = useCallback( + (actionId?: string) => { + if (!actionId) { + // handle JS + return segment === EditorEntityTab.JS ? closeAddJS() : closeAddQuery(); + } + + if (segment === EditorEntityTab.JS) + dispatch(closeJSActionTab({ id: actionId, parentId: basePageId })); + + if (segment === EditorEntityTab.QUERIES) + dispatch(closeQueryActionTab({ id: actionId, parentId: basePageId })); + }, + [segment, dispatch, basePageId, closeAddJS, closeAddQuery], + ); + + return { addClickHandler, tabClickHandler, closeClickHandler }; +}; +export const useShowSideBySideNudge: () => [boolean, () => void] = () => { + const widgetBindingsExist = useSelector(isWidgetActionConnectionPresent); + + const localStorageFlag = localStorage.getItem( + LOCAL_STORAGE_KEYS.NUDGE_SHOWN_SPLIT_PANE, + ); + + const { setFalse, value } = useBoolean( + widgetBindingsExist && !localStorageFlag, + ); + + const dismissNudge = useCallback(() => { + setFalse(); + localStorage.setItem(LOCAL_STORAGE_KEYS.NUDGE_SHOWN_SPLIT_PANE, "true"); + }, [setFalse]); + + return [value, dismissNudge]; +}; + +export const useIsJSAddLoading = () => { + const moduleCreationOptions = useModuleOptions(); + const jsModuleCreationOptions = moduleCreationOptions.filter( + (opt) => opt.focusEntityType === FocusEntity.JS_MODULE_INSTANCE, + ); + const { isCreating } = useSelector((state) => state.ui.jsPane); + + if (jsModuleCreationOptions.length === 0) { + return isCreating; + } + + return false; +}; diff --git a/app/client/src/pages/Editor/IDE/EditorTabs/index.tsx b/app/client/src/pages/AppIDE/layout/components/EditorTabs/index.tsx similarity index 95% rename from app/client/src/pages/Editor/IDE/EditorTabs/index.tsx rename to app/client/src/pages/AppIDE/layout/components/EditorTabs/index.tsx index 29bc483fb961..cf7d7ad74a7c 100644 --- a/app/client/src/pages/Editor/IDE/EditorTabs/index.tsx +++ b/app/client/src/pages/AppIDE/layout/components/EditorTabs/index.tsx @@ -16,16 +16,13 @@ import { EditorEntityTabState, EditorViewMode, } from "IDE/Interfaces/EditorTypes"; -import { useIsJSAddLoading } from "ee/pages/Editor/IDE/EditorPane/JS/hooks"; +import { useIsJSAddLoading } from "./hooks"; import { identifyEntityFromPath } from "navigation/FocusEntity"; import { setListViewActiveState } from "actions/ideActions"; -import { - useCurrentEditorState, - useIDETabClickHandlers, - useShowSideBySideNudge, -} from "../hooks"; +import { useIDETabClickHandlers, useShowSideBySideNudge } from "./hooks"; +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; import { List } from "./List"; import { ScreenModeToggle } from "./ScreenModeToggle"; import { EditableTab } from "./EditableTab"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Explorer.tsx b/app/client/src/pages/AppIDE/layout/components/Explorer.tsx similarity index 82% rename from app/client/src/pages/Editor/IDE/EditorPane/Explorer.tsx rename to app/client/src/pages/AppIDE/layout/components/Explorer.tsx index 0113d35dca14..2a714bb15c2c 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Explorer.tsx +++ b/app/client/src/pages/AppIDE/layout/components/Explorer.tsx @@ -6,21 +6,21 @@ import { jsSegmentRoutes, querySegmentRoutes, widgetSegmentRoutes, -} from "ee/pages/Editor/IDE/EditorPane/constants"; -import { JSExplorer } from "./JS"; -import { QueryExplorer } from "./Query"; -import WidgetsSegment from "./UI"; +} from "ee/pages/AppIDE/layouts/constants"; +import { JSExplorer } from "../../components/JSExplorer"; +import { QueryExplorer } from "../../components/QueryExplorer"; +import WidgetsSegment from "../routers/UISegmentLeftPane/UISegmentLeftPane"; import { BUILDER_CUSTOM_PATH, BUILDER_PATH, BUILDER_PATH_DEPRECATED, } from "ee/constants/routes/appRoutes"; -import SegmentSwitcher from "./components/SegmentSwitcher"; +import SegmentSwitcher from "./SegmentSwitcher/SegmentSwitcher"; import { useSelector } from "react-redux"; import { getIDEViewMode } from "selectors/ideSelectors"; import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes"; import { DEFAULT_EXPLORER_PANE_WIDTH } from "constants/AppConstants"; -import { useCurrentEditorState } from "../hooks"; +import { useCurrentEditorState } from "../../hooks/useCurrentEditorState"; const EditorPaneExplorer = () => { const { path } = useRouteMatch(); diff --git a/app/client/src/pages/Editor/IDE/Header/DeployButton.tsx b/app/client/src/pages/AppIDE/layout/components/Header/DeployButton.tsx similarity index 100% rename from app/client/src/pages/Editor/IDE/Header/DeployButton.tsx rename to app/client/src/pages/AppIDE/layout/components/Header/DeployButton.tsx diff --git a/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx b/app/client/src/pages/AppIDE/layout/components/Header/EditorTitle.tsx similarity index 92% rename from app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx rename to app/client/src/pages/AppIDE/layout/components/Header/EditorTitle.tsx index 8817dced4805..1a8839cc1cf9 100644 --- a/app/client/src/pages/Editor/IDE/Header/EditorTitle.tsx +++ b/app/client/src/pages/AppIDE/layout/components/Header/EditorTitle.tsx @@ -2,7 +2,7 @@ import React from "react"; import { IDEHeaderSwitcher } from "@appsmith/ads"; import { createMessage, HEADER_TITLES } from "ee/constants/messages"; -import { PagesSection } from "../EditorPane/Pages/PagesSection"; +import { PagesSection } from "../../../components/PageList/PagesSection"; import { useBoolean } from "usehooks-ts"; import { useSelector } from "react-redux"; import { getCurrentPageId, getPageById } from "selectors/editorSelectors"; diff --git a/app/client/src/pages/Editor/IDE/Header/index.tsx b/app/client/src/pages/AppIDE/layout/components/Header/index.tsx similarity index 97% rename from app/client/src/pages/Editor/IDE/Header/index.tsx rename to app/client/src/pages/AppIDE/layout/components/Header/index.tsx index 0d3962f6b55c..815ea6e2740d 100644 --- a/app/client/src/pages/Editor/IDE/Header/index.tsx +++ b/app/client/src/pages/AppIDE/layout/components/Header/index.tsx @@ -56,12 +56,12 @@ 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 { useCurrentAppState } from "IDE/hooks"; import { EditorState } from "IDE/enums"; import { EditorSaveIndicator } from "pages/Editor/EditorSaveIndicator"; import { APPLICATIONS_URL } from "constants/routes"; -import { useNavigationMenuData } from "../../EditorName/useNavigationMenuData"; -import useLibraryHeaderTitle from "ee/pages/Editor/IDE/Header/useLibraryHeaderTitle"; +import { useNavigationMenuData } from "pages/Editor/EditorName/useNavigationMenuData"; +import useLibraryHeaderTitle from "ee/pages/AppIDE/layouts/components/Header/useLibraryHeaderTitle"; import { AppsmithLink } from "pages/Editor/AppsmithLink"; import DeployButton from "./DeployButton"; import GitApplicationContextProvider from "components/gitContexts/GitApplicationContextProvider"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentSwitcher.tsx b/app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/SegmentSwitcher.tsx similarity index 88% rename from app/client/src/pages/Editor/IDE/EditorPane/components/SegmentSwitcher.tsx rename to app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/SegmentSwitcher.tsx index e8c48fcde922..82344b097de9 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentSwitcher.tsx +++ b/app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/SegmentSwitcher.tsx @@ -1,7 +1,8 @@ import React, { useMemo } from "react"; import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import { EditorEntityTab } from "IDE/Interfaces/EditorTypes"; -import { useCurrentEditorState, useSegmentNavigation } from "../../hooks"; +import { useSegmentNavigation } from "./useSegmentNavigation"; +import { useCurrentEditorState } from "../../../hooks/useCurrentEditorState"; import { EditorSegments } from "@appsmith/ads"; const SegmentSwitcher = () => { diff --git a/app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/useSegmentNavigation.ts b/app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/useSegmentNavigation.ts new file mode 100644 index 000000000000..61f7b8c7d5cb --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/components/SegmentSwitcher/useSegmentNavigation.ts @@ -0,0 +1,46 @@ +import { useParentEntityInfo } from "ee/IDE/hooks/useParentEntityInfo"; +import { EditorEntityTab } from "IDE/Interfaces/EditorTypes"; +import history, { NavigationMethod } from "utils/history"; +import { + jsCollectionListURL, + queryListURL, + widgetListURL, +} from "ee/RouteBuilder"; +import { IDE_TYPE } from "ee/IDE/Interfaces/IDETypes"; + +export const useSegmentNavigation = (): { + onSegmentChange: (value: string) => void; +} => { + const { parentEntityId: baseParentEntityId } = useParentEntityInfo( + IDE_TYPE.App, + ); + + /** + * Callback to handle the segment change + * + * @param value + * @returns + * + */ + const onSegmentChange = (value: string) => { + switch (value) { + case EditorEntityTab.QUERIES: + history.push(queryListURL({ baseParentEntityId }), { + invokedBy: NavigationMethod.SegmentControl, + }); + break; + case EditorEntityTab.JS: + history.push(jsCollectionListURL({ baseParentEntityId }), { + invokedBy: NavigationMethod.SegmentControl, + }); + break; + case EditorEntityTab.UI: + history.push(widgetListURL({ baseParentEntityId }), { + invokedBy: NavigationMethod.SegmentControl, + }); + break; + } + }; + + return { onSegmentChange }; +}; diff --git a/app/client/src/pages/Editor/IDE/Layout/constants.ts b/app/client/src/pages/AppIDE/layout/constants.ts similarity index 100% rename from app/client/src/pages/Editor/IDE/Layout/constants.ts rename to app/client/src/pages/AppIDE/layout/constants.ts diff --git a/app/client/src/pages/Editor/IDE/Layout/hooks/useEditorStateLeftPaneWidth.ts b/app/client/src/pages/AppIDE/layout/hooks/useEditorStateLeftPaneWidth.ts similarity index 95% rename from app/client/src/pages/Editor/IDE/Layout/hooks/useEditorStateLeftPaneWidth.ts rename to app/client/src/pages/AppIDE/layout/hooks/useEditorStateLeftPaneWidth.ts index 97801344b8b4..34be2e9b0c6f 100644 --- a/app/client/src/pages/Editor/IDE/Layout/hooks/useEditorStateLeftPaneWidth.ts +++ b/app/client/src/pages/AppIDE/layout/hooks/useEditorStateLeftPaneWidth.ts @@ -9,7 +9,7 @@ import { useSelector } from "react-redux"; import { getIDEViewMode } from "selectors/ideSelectors"; import { getPropertyPaneWidth } from "selectors/propertyPaneSelectors"; import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes"; -import { useCurrentEditorState } from "../../hooks"; +import { useCurrentEditorState } from "../../hooks/useCurrentEditorState"; import { previewModeSelector } from "selectors/editorSelectors"; import { useGitProtectedMode } from "pages/Editor/gitSync/hooks/modHooks"; diff --git a/app/client/src/pages/Editor/IDE/Layout/hooks/useGridLayoutTemplate.ts b/app/client/src/pages/AppIDE/layout/hooks/useGridLayoutTemplate.ts similarity index 96% rename from app/client/src/pages/Editor/IDE/Layout/hooks/useGridLayoutTemplate.ts rename to app/client/src/pages/AppIDE/layout/hooks/useGridLayoutTemplate.ts index c58548156633..e489a21b3c01 100644 --- a/app/client/src/pages/Editor/IDE/Layout/hooks/useGridLayoutTemplate.ts +++ b/app/client/src/pages/AppIDE/layout/hooks/useGridLayoutTemplate.ts @@ -2,8 +2,8 @@ import React from "react"; import type { AnimatedGridUnit } from "components/AnimatedGridLayout"; import { useSelector } from "react-redux"; import useWindowDimensions from "utils/hooks/useWindowDimensions"; -import { useCurrentEditorState } from "../../hooks"; -import { useCurrentAppState } from "../../hooks/useCurrentAppState"; +import { useCurrentEditorState } from "../../hooks/useCurrentEditorState"; +import { useCurrentAppState } from "IDE/hooks/useCurrentAppState"; import { getPropertyPaneWidth } from "selectors/propertyPaneSelectors"; import { previewModeSelector } from "selectors/editorSelectors"; import { getIDEViewMode } from "selectors/ideSelectors"; diff --git a/app/client/src/pages/AppIDE/layout/hooks/useWidgetSelectionBlockListener.ts b/app/client/src/pages/AppIDE/layout/hooks/useWidgetSelectionBlockListener.ts new file mode 100644 index 000000000000..72eed0de9de6 --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/hooks/useWidgetSelectionBlockListener.ts @@ -0,0 +1,45 @@ +import { useLocation } from "react-router"; +import { useDispatch, useSelector } from "react-redux"; +import { FocusEntity, identifyEntityFromPath } from "navigation/FocusEntity"; +import { getIsAltFocusWidget, getWidgetSelectionBlock } from "selectors/ui"; +import { useEffect } from "react"; +import { altFocusWidget, setWidgetSelectionBlock } from "actions/widgetActions"; + +export function useWidgetSelectionBlockListener() { + const { pathname } = useLocation(); + const dispatch = useDispatch(); + const currentFocus = identifyEntityFromPath(pathname); + const isAltFocused = useSelector(getIsAltFocusWidget); + const widgetSelectionIsBlocked = useSelector(getWidgetSelectionBlock); + + useEffect(() => { + const inUIMode = [ + FocusEntity.CANVAS, + FocusEntity.WIDGET, + FocusEntity.WIDGET_LIST, + ].includes(currentFocus.entity); + + dispatch(setWidgetSelectionBlock(!inUIMode)); + }, [currentFocus, dispatch]); + + useEffect(() => { + window.addEventListener("keydown", handleKeyDown); + window.addEventListener("keyup", handleKeyUp); + + return () => { + window.removeEventListener("keydown", handleKeyDown); + window.removeEventListener("keyup", handleKeyUp); + }; + }, [isAltFocused, widgetSelectionIsBlocked]); + const handleKeyDown = (e: KeyboardEvent) => { + if (!isAltFocused && widgetSelectionIsBlocked && e.metaKey) { + dispatch(altFocusWidget(e.metaKey)); + } + }; + + const handleKeyUp = (e: KeyboardEvent) => { + if (!e.metaKey && widgetSelectionIsBlocked) { + dispatch(altFocusWidget(e.metaKey)); + } + }; +} diff --git a/app/client/src/pages/Editor/IDE/index.tsx b/app/client/src/pages/AppIDE/layout/index.tsx similarity index 87% rename from app/client/src/pages/Editor/IDE/index.tsx rename to app/client/src/pages/AppIDE/layout/index.tsx index 9b806700cfd8..348f5fd5ef08 100644 --- a/app/client/src/pages/Editor/IDE/index.tsx +++ b/app/client/src/pages/AppIDE/layout/index.tsx @@ -1,10 +1,12 @@ import React from "react"; import { selectFeatureFlagCheck } from "ee/selectors/featureFlagsSelectors"; -import { AnimatedLayout, StaticLayout } from "./Layout"; import { useSelector } from "react-redux"; import type { AppState } from "ee/reducers"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; +import { AnimatedLayout } from "./AnimatedLayout"; +import { StaticLayout } from "./StaticLayout"; + const checkAnimatedIDEFlagValue = (state: AppState) => { return selectFeatureFlagCheck( state, diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/Editor.tsx b/app/client/src/pages/AppIDE/layout/routers/JSEditor/JSEditor.tsx similarity index 78% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/Editor.tsx rename to app/client/src/pages/AppIDE/layout/routers/JSEditor/JSEditor.tsx index 647eaee91556..f9d316a1f13a 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/Editor.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/JSEditor/JSEditor.tsx @@ -1,11 +1,11 @@ import React from "react"; import { Switch, useRouteMatch } from "react-router"; -import { useJSEditorRoutes } from "ee/pages/Editor/IDE/EditorPane/JS/hooks"; +import { JSEditorRoutes } from "ee/pages/AppIDE/layouts/routers/JSEditor/constants"; import { SentryRoute } from "ee/AppRouter"; const JSEditorPane = () => { const { path } = useRouteMatch(); - const routes = useJSEditorRoutes(path); + const routes = JSEditorRoutes(path); return ( diff --git a/app/client/src/pages/Editor/IDE/EditorPane/JS/JSRender.test.tsx b/app/client/src/pages/AppIDE/layout/routers/JSEditor/JSRender.test.tsx similarity index 99% rename from app/client/src/pages/Editor/IDE/EditorPane/JS/JSRender.test.tsx rename to app/client/src/pages/AppIDE/layout/routers/JSEditor/JSRender.test.tsx index dac2b145eff5..6125f8193621 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/JS/JSRender.test.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/JSEditor/JSRender.test.tsx @@ -1,7 +1,7 @@ import { render, waitFor } from "test/testUtils"; import { Route } from "react-router-dom"; import { BUILDER_PATH } from "ee/constants/routes/appRoutes"; -import IDE from "pages/Editor/IDE/index"; +import { StaticLayout as IDE } from "../../StaticLayout"; import React from "react"; import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import { getIDETestState } from "test/factories/AppIDEFactoryUtils"; diff --git a/app/client/src/pages/AppIDE/layout/routers/JSEditor/index.ts b/app/client/src/pages/AppIDE/layout/routers/JSEditor/index.ts new file mode 100644 index 000000000000..6307a8d3e0bd --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/routers/JSEditor/index.ts @@ -0,0 +1 @@ +export { JSEditorPane } from "./JSEditor"; diff --git a/app/client/src/pages/Editor/IDE/LeftPane/index.tsx b/app/client/src/pages/AppIDE/layout/routers/LeftPane.tsx similarity index 78% rename from app/client/src/pages/Editor/IDE/LeftPane/index.tsx rename to app/client/src/pages/AppIDE/layout/routers/LeftPane.tsx index 2c855e8e3d79..59ef226148cd 100644 --- a/app/client/src/pages/Editor/IDE/LeftPane/index.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/LeftPane.tsx @@ -1,6 +1,5 @@ import React, { useMemo } from "react"; import { useSelector } from "react-redux"; -import styled from "styled-components"; import { Switch, useRouteMatch } from "react-router"; import { SentryRoute } from "ee/AppRouter"; import { @@ -12,19 +11,13 @@ import { INTEGRATION_EDITOR_PATH, SAAS_GSHEET_EDITOR_ID_PATH, } from "constants/routes"; -import AppSettingsPane from "./AppSettings"; -import DataSidePane from "./DataSidePane"; -import EditorPane from "../EditorPane"; -import LibrarySidePane from "ee/pages/Editor/IDE/LeftPane/LibrarySidePane"; +import AppSettingsPane from "../../components/AppSettings"; +import { DataSidePane } from "pages/Editor/DataSidePane"; +import EditorPane from "../components/EditorPane"; +import LibrarySidePane from "ee/pages/AppIDE/components/LibrariesList/LibrarySidePane"; import { getDatasourceUsageCountForApp } from "ee/selectors/entitiesSelector"; import { IDE_TYPE } from "ee/IDE/Interfaces/IDETypes"; - -export const LeftPaneContainer = styled.div` - height: 100%; - border-right: 1px solid var(--ads-v2-color-border); - background: var(--ads-v2-color-bg); - overflow: hidden; -`; +import { Flex } from "@appsmith/ads"; const LeftPane = () => { const { path } = useRouteMatch(); @@ -52,7 +45,12 @@ const LeftPane = () => { ); return ( - + { /> - + ); }; diff --git a/app/client/src/pages/AppIDE/layout/routers/MainPane/MainPane.tsx b/app/client/src/pages/AppIDE/layout/routers/MainPane/MainPane.tsx new file mode 100644 index 000000000000..2b5dc9bc106b --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/routers/MainPane/MainPane.tsx @@ -0,0 +1,39 @@ +import React from "react"; +import { Route, Switch, useRouteMatch } from "react-router"; +import * as Sentry from "@sentry/react"; +import { MainPaneRoutes } from "ee/pages/AppIDE/layouts/routers/MainPane/constants"; +import { useSelector } from "react-redux"; +import { selectCombinedPreviewMode } from "selectors/gitModSelectors"; +import WidgetsEditor from "pages/Editor/WidgetsEditor"; +import { useWidgetSelectionBlockListener } from "../../hooks/useWidgetSelectionBlockListener"; + +const SentryRoute = Sentry.withSentryRouting(Route); + +export const MainPane = (props: { id: string }) => { + const { path } = useRouteMatch(); + const routes = MainPaneRoutes(path); + + useWidgetSelectionBlockListener(); + + const isPreviewMode = useSelector(selectCombinedPreviewMode); + + return ( +
+ {isPreviewMode ? ( + + ) : ( + + {routes.map((route) => ( + + ))} + + )} +
+ ); +}; + +export default MainPane; diff --git a/app/client/src/pages/AppIDE/layout/routers/MainPane/index.ts b/app/client/src/pages/AppIDE/layout/routers/MainPane/index.ts new file mode 100644 index 000000000000..d4abb41a3af9 --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/routers/MainPane/index.ts @@ -0,0 +1 @@ +export { default } from "./MainPane"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/Editor.tsx b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/Editor.tsx similarity index 78% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/Editor.tsx rename to app/client/src/pages/AppIDE/layout/routers/QueryEditor/Editor.tsx index 87f43f823211..08d371d5ac1e 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/Editor.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/Editor.tsx @@ -1,12 +1,12 @@ import React from "react"; import { useRouteMatch } from "react-router"; import { Switch } from "react-router-dom"; -import { useQueryEditorRoutes } from "ee/pages/Editor/IDE/EditorPane/Query/hooks"; +import { QueryEditorRoutes } from "ee/pages/AppIDE/layouts/routers/QueryEditor/constants"; import { SentryRoute } from "ee/AppRouter"; const QueryEditor = () => { const { path } = useRouteMatch(); - const routes = useQueryEditorRoutes(path); + const routes = QueryEditorRoutes(path); return ( diff --git a/app/client/src/pages/Editor/IDE/EditorPane/Query/QueryRender.test.tsx b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/QueryRender.test.tsx similarity index 99% rename from app/client/src/pages/Editor/IDE/EditorPane/Query/QueryRender.test.tsx rename to app/client/src/pages/AppIDE/layout/routers/QueryEditor/QueryRender.test.tsx index 66292912e196..ce383f3cd063 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/Query/QueryRender.test.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/QueryRender.test.tsx @@ -1,7 +1,7 @@ import React from "react"; import { Route } from "react-router-dom"; import { render } from "test/testUtils"; -import IDE from "pages/Editor/IDE/index"; +import IDE from "../../index"; import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import { BUILDER_PATH } from "ee/constants/routes/appRoutes"; import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes"; diff --git a/app/client/src/pages/AppIDE/layout/routers/QueryEditor/index.ts b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/index.ts new file mode 100644 index 000000000000..d19bcc2d3eb9 --- /dev/null +++ b/app/client/src/pages/AppIDE/layout/routers/QueryEditor/index.ts @@ -0,0 +1 @@ +export { QueryEditor } from "./Editor"; diff --git a/app/client/src/pages/Editor/IDE/RightPane/index.tsx b/app/client/src/pages/AppIDE/layout/routers/RightPane.tsx similarity index 88% rename from app/client/src/pages/Editor/IDE/RightPane/index.tsx rename to app/client/src/pages/AppIDE/layout/routers/RightPane.tsx index d19ddee82ebc..6c185c3645c8 100644 --- a/app/client/src/pages/Editor/IDE/RightPane/index.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/RightPane.tsx @@ -1,5 +1,5 @@ import React from "react"; -import PropertyPaneWrapper from "pages/Editor/WidgetsEditor/components/PropertyPaneWrapper"; +import PropertyPaneWrapper from "../../components/PropertyPaneWrapper"; import { ADD_PATH, BUILDER_CUSTOM_PATH, diff --git a/app/client/src/pages/Editor/IDE/Sidebar.tsx b/app/client/src/pages/AppIDE/layout/routers/Sidebar.tsx similarity index 93% rename from app/client/src/pages/Editor/IDE/Sidebar.tsx rename to app/client/src/pages/AppIDE/layout/routers/Sidebar.tsx index eb711ddb35e3..b2ade7144d90 100644 --- a/app/client/src/pages/Editor/IDE/Sidebar.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/Sidebar.tsx @@ -3,7 +3,7 @@ import { useDispatch, useSelector } from "react-redux"; import { builderURL } from "ee/RouteBuilder"; import { getCurrentBasePageId } from "selectors/editorSelectors"; import history, { NavigationMethod } from "utils/history"; -import { useCurrentAppState } from "./hooks/useCurrentAppState"; +import { useCurrentAppState } from "IDE/hooks/useCurrentAppState"; import { getCurrentWorkspaceId } from "ee/selectors/selectedWorkspaceSelectors"; import { fetchWorkspace } from "ee/actions/workspaceActions"; import { IDESidebar } from "@appsmith/ads"; @@ -11,7 +11,7 @@ import { getDatasources } from "ee/selectors/entitiesSelector"; import { BottomButtons, TopButtons, -} from "ee/pages/Editor/IDE/constants/SidebarButtons"; +} from "ee/pages/AppIDE/constants/SidebarButtons"; function Sidebar() { const dispatch = useDispatch(); diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIRender.test.tsx b/app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UIRender.test.tsx similarity index 98% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/UIRender.test.tsx rename to app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UIRender.test.tsx index 015ffa44c55a..4d0194687bb1 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/UIRender.test.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UIRender.test.tsx @@ -1,7 +1,7 @@ import React from "react"; import { Route } from "react-router-dom"; import { render } from "test/testUtils"; -import IDE from "pages/Editor/IDE/index"; +import { StaticLayout as IDE } from "../../StaticLayout"; import { BUILDER_PATH } from "ee/constants/routes/appRoutes"; import { getIDETestState } from "test/factories/AppIDEFactoryUtils"; import { PageFactory } from "test/factories/PageFactory"; diff --git a/app/client/src/pages/Editor/IDE/EditorPane/UI/index.tsx b/app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UISegmentLeftPane.tsx similarity index 94% rename from app/client/src/pages/Editor/IDE/EditorPane/UI/index.tsx rename to app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UISegmentLeftPane.tsx index 32ac9bc52407..32bb42133d37 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/UI/index.tsx +++ b/app/client/src/pages/AppIDE/layout/routers/UISegmentLeftPane/UISegmentLeftPane.tsx @@ -11,8 +11,8 @@ import { WIDGETS_EDITOR_BASE_PATH, WIDGETS_EDITOR_ID_PATH, } from "constants/routes"; -import ListWidgets from "./List"; -import AddWidgets from "./Add"; +import ListWidgets from "../../../components/UIList/UIList"; +import AddWidgets from "../../../components/WidgetAdd"; import { useSelector } from "react-redux"; import { getPagePermissions } from "selectors/editorSelectors"; import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; diff --git a/app/client/src/pages/Editor/CanvasLayoutConversion/hooks/useShowSnapShotBanner.ts b/app/client/src/pages/Editor/CanvasLayoutConversion/hooks/useShowSnapShotBanner.ts index 59d12e965eba..2b15b189c9ee 100644 --- a/app/client/src/pages/Editor/CanvasLayoutConversion/hooks/useShowSnapShotBanner.ts +++ b/app/client/src/pages/Editor/CanvasLayoutConversion/hooks/useShowSnapShotBanner.ts @@ -1,7 +1,7 @@ import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; import { EditorState } from "IDE/enums"; import { getReadableSnapShotDetails } from "layoutSystems/autolayout/utils/AutoLayoutUtils"; -import { useCurrentAppState } from "pages/Editor/IDE/hooks/useCurrentAppState"; +import { useCurrentAppState } from "IDE/hooks/useCurrentAppState"; import { useSelector } from "react-redux"; import { getIsAppSettingsPaneWithNavigationTabOpen } from "selectors/appSettingsPaneSelectors"; import { getSnapshotUpdatedTime } from "selectors/autoLayoutSelectors"; diff --git a/app/client/src/pages/Editor/IDE/LeftPane/CreateDatasourcePopover.tsx b/app/client/src/pages/Editor/DataSidePane/CreateDatasourceButton.tsx similarity index 61% rename from app/client/src/pages/Editor/IDE/LeftPane/CreateDatasourcePopover.tsx rename to app/client/src/pages/Editor/DataSidePane/CreateDatasourceButton.tsx index f16012a38d62..3753a792f5ea 100644 --- a/app/client/src/pages/Editor/IDE/LeftPane/CreateDatasourcePopover.tsx +++ b/app/client/src/pages/Editor/DataSidePane/CreateDatasourceButton.tsx @@ -1,4 +1,4 @@ -import { Button, Popover, PopoverTrigger } from "@appsmith/ads"; +import { Button } from "@appsmith/ads"; import React from "react"; import history from "utils/history"; import { builderURL } from "ee/RouteBuilder"; @@ -9,7 +9,7 @@ import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; import { getHasCreateDatasourcePermission } from "ee/utils/BusinessFeatures/permissionPageHelpers"; -const CreateDatasourcePopover = () => { +const CreateDatasourceButton = () => { const userWorkspacePermissions = useSelector( (state: AppState) => getCurrentAppWorkspace(state).userPermissions ?? [], ); @@ -26,25 +26,21 @@ const CreateDatasourcePopover = () => { } return ( - - - + + + {fields.length === 0 ? ( + + ) : ( + + {fields.map((field, index) => { + return ( + + ); + })} + + )} + + ); +}; diff --git a/app/client/src/components/formControls/FunctionCallingConfigControl/components/FunctionCallingConfigToolField.tsx b/app/client/src/components/formControls/FunctionCallingConfigControl/components/FunctionCallingConfigToolField.tsx new file mode 100644 index 000000000000..e8cb942173d9 --- /dev/null +++ b/app/client/src/components/formControls/FunctionCallingConfigControl/components/FunctionCallingConfigToolField.tsx @@ -0,0 +1,173 @@ +import { Button, Text } from "@appsmith/ads"; +import type { AppState } from "ee/reducers"; +import FormControl from "pages/Editor/FormControl"; +import React, { useCallback, useEffect } from "react"; +import { useDispatch, useSelector } from "react-redux"; +import { change, formValueSelector } from "redux-form"; +import styled from "styled-components"; +import type { DropDownGroupedOptions } from "../../DropDownControl"; +import type { + FunctionCallingEntityTypeOption, + FunctionCallingEntityType, +} from "../types"; +import { selectEntityOptions } from "./selectors"; + +interface FunctionCallingConfigToolFieldProps { + fieldPath: string; + formName: string; + index: number; + onRemove: (index: number) => void; +} + +const ConfigItemRoot = styled.div` + display: flex; + flex-direction: column; + padding: var(--ads-v2-spaces-3); + border-radius: var(--ads-v2-border-radius); + border: 1px solid var(--ads-v2-color-border); + background: var(--colors-semantics-bg-inset, #f8fafc); +`; + +const ConfigItemRow = styled.div` + display: flex; + flex-direction: row; + align-items: center; + gap: var(--ads-v2-spaces-4); + justify-content: space-between; + margin-bottom: var(--ads-v2-spaces-4); +`; + +const ConfigItemSelectWrapper = styled.div` + width: 50%; + min-width: 160px; +`; + +export const FunctionCallingConfigToolField = ({ + index, + onRemove, + ...props +}: FunctionCallingConfigToolFieldProps) => { + const dispatch = useDispatch(); + const fieldValue = useSelector((state: AppState) => + formValueSelector(props.formName)(state, props.fieldPath), + ); + const entityOptions = useSelector(selectEntityOptions); + + const handleRemoveButtonClick = useCallback(() => { + onRemove(index); + }, [onRemove, index]); + + const findEntityOption = useCallback( + (entityId: string, items: FunctionCallingEntityTypeOption[]): boolean => { + return items.find(({ value }) => value === entityId) !== undefined; + }, + [entityOptions], + ); + + const findEntityType = useCallback( + (entityId: string): string => { + switch (true) { + case findEntityOption(entityId, entityOptions.Query): + return "Query"; + case findEntityOption(entityId, entityOptions.JSFunction): + return "JSFunction"; + case findEntityOption(entityId, entityOptions.SystemFunction): + return "SystemFunction"; + } + + return ""; + }, + [fieldValue.entityId, entityOptions], + ); + + useEffect( + // entityType is dependent on entityId + // Every time entityId changes, we need to find the new entityType + function handleEntityTypeChange() { + const entityType = findEntityType(fieldValue.entityId); + + dispatch( + change(props.formName, `${props.fieldPath}.entityType`, entityType), + ); + }, + [fieldValue.entityId], + ); + + return ( + + + + Function + +