diff --git a/app/client/src/pages/Editor/Explorer/Entity/Name.tsx b/app/client/src/pages/Editor/Explorer/Entity/Name.tsx index a8afb9af0d..7c59201f6d 100644 --- a/app/client/src/pages/Editor/Explorer/Entity/Name.tsx +++ b/app/client/src/pages/Editor/Explorer/Entity/Name.tsx @@ -3,7 +3,7 @@ import EditableText, { } from "components/editorComponents/EditableText"; import TooltipComponent from "components/ads/Tooltip"; import { Colors } from "constants/Colors"; -import { get } from "lodash"; +import _, { get } from "lodash"; import React, { forwardRef, @@ -149,7 +149,9 @@ export const EntityName = forwardRef( const dispatch = useDispatch(); - const existingActionNames: string[] = useSelector(getExistingActionNames); + const existingActionNames: string[] | [] = _.compact( + useSelector(getExistingActionNames), + ); const existingJSCollectionNames: string[] = useSelector( getExistingJSCollectionNames, diff --git a/app/client/src/selectors/entitiesSelector.ts b/app/client/src/selectors/entitiesSelector.ts index 60ce1644e0..34d43cce42 100644 --- a/app/client/src/selectors/entitiesSelector.ts +++ b/app/client/src/selectors/entitiesSelector.ts @@ -494,8 +494,40 @@ export const getExistingWidgetNames = createSelector( export const getExistingActionNames = createSelector( (state: AppState) => state.entities.actions, - (actions) => - actions.map((action: { config: { name: string } }) => action.config.name), + getCurrentPageId, + // editingEntityName is actually an id and not a name per say and it points to the id of an action being edited through the explorer. + (state: AppState) => state.ui.explorer.entity.editingEntityName, + (actions, currentPageId, editingEntityId) => { + // get the current action being edited + const editingAction = + editingEntityId && + actions.filter( + (action: { config: { id: string } }) => + action.config.id === editingEntityId, + ); + + // if the current action being edited is on the same page, filter the actions on the page and return their names. + if (editingAction && editingAction[0].config.pageId === currentPageId) { + return actions.map( + (actionItem: { config: { name: string; pageId: string } }) => { + if (actionItem.config.pageId === currentPageId) { + return actionItem.config.name; + } + return undefined; + }, + ); + } else { + // if current action being edited is on another page, filter the actions not on the page and return their names. + return actions.map( + (actionItem: { config: { name: string; pageId: string } }) => { + if (actionItem.config.pageId !== currentPageId) { + return actionItem.config.name; + } + return undefined; + }, + ); + } + }, ); export const getExistingJSCollectionNames = createSelector(