chore: Added isRenameDisabled and filtered UI modules from widgets section (#40553)
## Description Adds support for disabling widget renaming in the property pane through a `isRenameDisabled` property. When enabled, it displays a tooltip explaining this limitation when hovering over the widget name. Additionally, this PR hides module widgets from the widget card selection by filtering out widgets whose type starts with "MODULE_WIDGET_". Fixes https://github.com/appsmithorg/appsmith/issues/40495 ## Automation /ok-to-test tags="@tag.Widget" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/14794711021> > Commit: 3f94eafdef52b4d0543de99f9472fb3970ee415e > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=14794711021&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Widget` > Spec: > <hr>Fri, 02 May 2025 13:12:08 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added the ability to disable renaming for certain widget titles, displaying a tooltip when renaming is not allowed. - **Improvements** - Widgets identified as module widgets are now excluded from the widget cards list in the UI. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
parent
3212d738ca
commit
b310d751e4
|
|
@ -1627,6 +1627,8 @@ export const PROPERTY_PANE_EMPTY_SEARCH_RESULT_MESSAGE =
|
|||
"No properties found based on your search";
|
||||
export const PROPERTY_SEARCH_INPUT_PLACEHOLDER =
|
||||
"Search for controls, labels etc";
|
||||
export const PROPERTY_PANE_TITLE_RENAME_DISABLED = () =>
|
||||
"This widget cannot be renamed";
|
||||
export const EXPLORER_BETA_ENTITY = () => "BETA";
|
||||
export const BINDING_WIDGET_WALKTHROUGH_TITLE = () => "Widget properties";
|
||||
export const BINDING_WIDGET_WALKTHROUGH_DESC = () =>
|
||||
|
|
|
|||
|
|
@ -23,6 +23,10 @@ import {
|
|||
getIsCurrentWidgetRecentlyAdded,
|
||||
getPropertyPaneWidth,
|
||||
} from "selectors/propertyPaneSelectors";
|
||||
import {
|
||||
createMessage,
|
||||
PROPERTY_PANE_TITLE_RENAME_DISABLED,
|
||||
} from "ee/constants/messages";
|
||||
|
||||
interface PropertyPaneTitleProps {
|
||||
title: string;
|
||||
|
|
@ -31,6 +35,7 @@ interface PropertyPaneTitleProps {
|
|||
updatePropertyTitle?: (title: string) => void;
|
||||
onBackClick?: () => void;
|
||||
isPanelTitle?: boolean;
|
||||
isRenameDisabled?: boolean;
|
||||
actions: Array<{
|
||||
tooltipContent: string;
|
||||
icon: ReactElement;
|
||||
|
|
@ -186,6 +191,15 @@ const PropertyPaneTitle = memo(function PropertyPaneTitle(
|
|||
className="flex-grow"
|
||||
onKeyDown={handleTabKeyDown}
|
||||
>
|
||||
{props.isRenameDisabled ? (
|
||||
<div className="flex-grow text-lg font-semibold t--property-pane-title">
|
||||
<Tooltip
|
||||
content={createMessage(PROPERTY_PANE_TITLE_RENAME_DISABLED)}
|
||||
>
|
||||
<div>{name}</div>
|
||||
</Tooltip>
|
||||
</div>
|
||||
) : (
|
||||
<EditableText
|
||||
className="flex-grow text-lg font-semibold t--property-pane-title"
|
||||
defaultValue={name}
|
||||
|
|
@ -197,11 +211,16 @@ const PropertyPaneTitle = memo(function PropertyPaneTitle(
|
|||
onBlurEverytime={handleOnBlurEverytime}
|
||||
onTextChanged={!props.isPanelTitle ? undefined : updateNewTitle}
|
||||
placeholder={props.title}
|
||||
savingState={updating ? SavingState.STARTED : SavingState.NOT_STARTED}
|
||||
savingState={
|
||||
updating ? SavingState.STARTED : SavingState.NOT_STARTED
|
||||
}
|
||||
underline
|
||||
valueTransform={!props.isPanelTitle ? removeSpecialChars : undefined}
|
||||
valueTransform={
|
||||
!props.isPanelTitle ? removeSpecialChars : undefined
|
||||
}
|
||||
wrapperRef={containerRef}
|
||||
/>
|
||||
)}
|
||||
</StyledEditableContainer>
|
||||
|
||||
{/* ACTIONS */}
|
||||
|
|
|
|||
|
|
@ -287,6 +287,7 @@ function PropertyPaneView(
|
|||
>
|
||||
<PropertyPaneTitle
|
||||
actions={actions}
|
||||
isRenameDisabled={widgetProperties?.isRenameDisabled}
|
||||
key={widgetProperties.widgetId}
|
||||
title={widgetProperties.widgetName}
|
||||
widgetId={widgetProperties.widgetId}
|
||||
|
|
|
|||
|
|
@ -335,6 +335,10 @@ export const getCurrentPageName = createSelector(
|
|||
?.pageName,
|
||||
);
|
||||
|
||||
const isModuleWidget = (
|
||||
config: ReturnType<typeof WidgetFactory.getConfigs>[string],
|
||||
) => config.type.startsWith("MODULE_WIDGET_");
|
||||
|
||||
export const getWidgetCards = createSelector(
|
||||
getIsAutoLayout,
|
||||
getIsAnvilLayout,
|
||||
|
|
@ -357,7 +361,7 @@ export const getWidgetCards = createSelector(
|
|||
return config.widgetName !== "Map" && !config.hideCard;
|
||||
}
|
||||
|
||||
return !config.hideCard;
|
||||
return !config.hideCard && !isModuleWidget(config);
|
||||
});
|
||||
|
||||
const _cards: WidgetCardProps[] = cards.map((config) => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user