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:
Ashit Rath 2025-05-05 12:56:09 +05:30 committed by GitHub
parent 3212d738ca
commit b310d751e4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 43 additions and 17 deletions

View File

@ -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 = () =>

View File

@ -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,22 +191,36 @@ const PropertyPaneTitle = memo(function PropertyPaneTitle(
className="flex-grow"
onKeyDown={handleTabKeyDown}
>
<EditableText
className="flex-grow text-lg font-semibold t--property-pane-title"
defaultValue={name}
editInteractionKind={EditInteractionKind.SINGLE}
fill
hideEditIcon
isEditingDefault={isEditingDefault}
onBlur={!props.isPanelTitle ? updateTitle : undefined}
onBlurEverytime={handleOnBlurEverytime}
onTextChanged={!props.isPanelTitle ? undefined : updateNewTitle}
placeholder={props.title}
savingState={updating ? SavingState.STARTED : SavingState.NOT_STARTED}
underline
valueTransform={!props.isPanelTitle ? removeSpecialChars : undefined}
wrapperRef={containerRef}
/>
{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}
editInteractionKind={EditInteractionKind.SINGLE}
fill
hideEditIcon
isEditingDefault={isEditingDefault}
onBlur={!props.isPanelTitle ? updateTitle : undefined}
onBlurEverytime={handleOnBlurEverytime}
onTextChanged={!props.isPanelTitle ? undefined : updateNewTitle}
placeholder={props.title}
savingState={
updating ? SavingState.STARTED : SavingState.NOT_STARTED
}
underline
valueTransform={
!props.isPanelTitle ? removeSpecialChars : undefined
}
wrapperRef={containerRef}
/>
)}
</StyledEditableContainer>
{/* ACTIONS */}

View File

@ -287,6 +287,7 @@ function PropertyPaneView(
>
<PropertyPaneTitle
actions={actions}
isRenameDisabled={widgetProperties?.isRenameDisabled}
key={widgetProperties.widgetId}
title={widgetProperties.widgetName}
widgetId={widgetProperties.widgetId}

View File

@ -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) => {