diff --git a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx b/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx index 7eeba362e2e1..9d58eceb7a99 100644 --- a/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx +++ b/app/client/src/ce/pages/Editor/IDE/EditorPane/Query/hooks.tsx @@ -51,18 +51,16 @@ export const useQueryAdd = () => { return; } - let url = ""; + const url = getQueryUrl(currentEntityInfo); - url = getQueryUrl(currentEntityInfo); history.push(url); - }, [currentEntityInfo]); + }, [currentEntityInfo, dispatch, ideViewMode]); const closeAddQuery = useCallback(() => { - let url = ""; + const url = getQueryUrl(currentEntityInfo, false); - url = getQueryUrl(currentEntityInfo, false); history.push(url); - }, [currentEntityInfo, ideViewMode]); + }, [currentEntityInfo]); return { openAddQuery, closeAddQuery }; }; @@ -113,6 +111,15 @@ export const useGroupedAddQueryOperations = (): GroupedAddOperations => { return groups; }; +const PluginActionEditor = lazy(async () => + retryPromise( + async () => + import( + /* webpackChunkName: "PluginActionEditor" */ "pages/Editor/AppPluginActionEditor" + ), + ), +); + const ApiEditor = lazy(async () => retryPromise( async () => @@ -145,13 +152,65 @@ const QueryEmpty = lazy(async () => ); export const useQueryEditorRoutes = (path: string): UseRoutes => { - return useMemo( + const isActionRedesignEnabled = useFeatureFlag( + FEATURE_FLAG.release_actions_redesign_enabled, + ); + + const skeleton = useMemo(() => , []); + + const newComponents = useMemo( + () => [ + { + 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: "AddQuery", + exact: true, + component: () => ( + + + + ), + path: [`${path}${ADD_PATH}`, `${path}/:baseQueryId${ADD_PATH}`], + }, + { + key: "QueryEmpty", + component: () => ( + + + + ), + exact: true, + path: [path], + }, + ], + [path, skeleton], + ); + + const oldComponents = useMemo( () => [ { key: "ApiEditor", - component: (args) => { + component: (args: object) => { return ( - }> + ); @@ -166,18 +225,18 @@ export const useQueryEditorRoutes = (path: string): UseRoutes => { { key: "AddQuery", exact: true, - component: (args) => ( - }> - + component: () => ( + + ), path: [`${path}${ADD_PATH}`, `${path}/:baseQueryId${ADD_PATH}`], }, { key: "SAASEditor", - component: (args) => { + component: (args: object) => { return ( - }> + ); @@ -191,9 +250,9 @@ export const useQueryEditorRoutes = (path: string): UseRoutes => { }, { key: "QueryEditor", - component: (args) => { + component: (args: object) => { return ( - }> + ); @@ -203,17 +262,23 @@ export const useQueryEditorRoutes = (path: string): UseRoutes => { }, { key: "QueryEmpty", - component: (args) => ( - }> - + component: () => ( + + ), exact: true, path: [path], }, ], - [path], + [path, skeleton], ); + + if (isActionRedesignEnabled) { + return newComponents; + } + + return oldComponents; }; export const useAddQueryListItems = () => { diff --git a/app/client/src/ee/pages/Editor/AppPluginActionEditor/AppPluginActionEditor.tsx b/app/client/src/ee/pages/Editor/AppPluginActionEditor/AppPluginActionEditor.tsx deleted file mode 100644 index 2d974cc98581..000000000000 --- a/app/client/src/ee/pages/Editor/AppPluginActionEditor/AppPluginActionEditor.tsx +++ /dev/null @@ -1,3 +0,0 @@ -import { default as CE_AppPluginActionEditor } from "ce/pages/Editor/AppPluginActionEditor/AppPluginActionEditor"; - -export default CE_AppPluginActionEditor; diff --git a/app/client/src/pages/Editor/APIEditor/index.tsx b/app/client/src/pages/Editor/APIEditor/index.tsx index 568fca9c0199..8e97ac8ec2c7 100644 --- a/app/client/src/pages/Editor/APIEditor/index.tsx +++ b/app/client/src/pages/Editor/APIEditor/index.tsx @@ -38,7 +38,6 @@ import { resolveIcon } from "../utils"; import { ENTITY_ICON_SIZE, EntityIcon } from "../Explorer/ExplorerIcons"; import { getIDEViewMode } from "selectors/ideSelectors"; import { EditorViewMode } from "ee/entities/IDE/constants"; -import { AppPluginActionEditor } from "pages/Editor/AppPluginActionEditor"; type ApiEditorWrapperProps = RouteComponentProps; @@ -164,14 +163,6 @@ function ApiEditorWrapper(props: ApiEditorWrapperProps) { return ; }, [action?.name, isConverting, icon]); - const isActionRedesignEnabled = useFeatureFlag( - FEATURE_FLAG.release_actions_redesign_enabled, - ); - - if (isActionRedesignEnabled) { - return ; - } - return ( ; @@ -187,14 +186,6 @@ function QueryEditor(props: QueryEditorProps) { ); }, [action?.name, isConverting, icon]); - const isActionRedesignEnabled = useFeatureFlag( - FEATURE_FLAG.release_actions_redesign_enabled, - ); - - if (isActionRedesignEnabled) { - return ; - } - return (