fix: Updating widget tree item props to show the correct icon for child widgets (#39605)
## Description Updating widget tree item props to show the correct icon for child widgets. Fixes [#39602](https://github.com/appsmithorg/appsmith/issues/39602) ## Automation /ok-to-test tags="@tag.IDE" ### 🔍 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/13700282344> > Commit: d67f80f838cdd01bf738bed3eea832d86c038a0c > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=13700282344&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.IDE` > Spec: > <hr>Thu, 06 Mar 2025 14:24:55 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** - Enhanced the entity explorer by introducing an optional `type` classification for each tree item, enabling more detailed visualization. - Improved icon rendering in widget items by basing visual updates on each item's `type`, ensuring a consistent display across the interface. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
parent
acac8c185d
commit
26d1b34ab9
|
|
@ -34,18 +34,21 @@ const Tree: EntityListTreeProps["items"] = [
|
|||
isExpanded: true,
|
||||
isSelected: false,
|
||||
name: "Parent 1",
|
||||
type: "LIST_WIDGET",
|
||||
children: [
|
||||
{
|
||||
id: "1.1",
|
||||
isExpanded: false,
|
||||
isSelected: true,
|
||||
name: "Child 1.1",
|
||||
type: "CONTAINER_WIDGET",
|
||||
children: [
|
||||
{
|
||||
id: "1.1.1",
|
||||
isExpanded: false,
|
||||
isSelected: false,
|
||||
name: "Child 1.1.1",
|
||||
type: "IMAGE_WIDGET",
|
||||
},
|
||||
{
|
||||
id: "1.1.2",
|
||||
|
|
@ -53,6 +56,7 @@ const Tree: EntityListTreeProps["items"] = [
|
|||
isExpanded: false,
|
||||
isSelected: false,
|
||||
name: "Child 1.1.2",
|
||||
type: "TEXT_WIDGET",
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -61,6 +65,7 @@ const Tree: EntityListTreeProps["items"] = [
|
|||
isExpanded: false,
|
||||
isSelected: false,
|
||||
name: "Child 1.2",
|
||||
type: "TABLE_WIDGET",
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -69,6 +74,7 @@ const Tree: EntityListTreeProps["items"] = [
|
|||
isExpanded: false,
|
||||
isSelected: false,
|
||||
name: "Parent 2",
|
||||
type: "BUTTON_WIDGET",
|
||||
},
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ const defaultProps: EntityListTreeProps = {
|
|||
isSelected: false,
|
||||
isDisabled: false,
|
||||
name: "Parent 1",
|
||||
type: "CONTAINER_WIDGET",
|
||||
children: [
|
||||
{
|
||||
id: "1-1",
|
||||
|
|
@ -29,6 +30,7 @@ const defaultProps: EntityListTreeProps = {
|
|||
isDisabled: false,
|
||||
name: "Child 1.1",
|
||||
children: [],
|
||||
type: "TABLE_WIDGET",
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -61,6 +63,7 @@ describe("EntityListTree", () => {
|
|||
isDisabled: false,
|
||||
name: "No Children Parent",
|
||||
children: [],
|
||||
type: "TABLE_WIDGET",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -84,6 +87,7 @@ describe("EntityListTree", () => {
|
|||
isSelected: false,
|
||||
isDisabled: false,
|
||||
name: "Parent 1",
|
||||
type: "CONTAINER_WIDGET",
|
||||
children: [
|
||||
{
|
||||
id: "1-1",
|
||||
|
|
@ -92,6 +96,7 @@ describe("EntityListTree", () => {
|
|||
isDisabled: false,
|
||||
name: "Child 1.1",
|
||||
children: [],
|
||||
type: "TABLE_WIDGET",
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ export interface EntityListTreeItem {
|
|||
isDisabled?: boolean;
|
||||
id: string;
|
||||
name: string;
|
||||
type: string;
|
||||
}
|
||||
|
||||
export interface EntityListTreeProps {
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ export const UIEntityListTree = () => {
|
|||
name: widget.widgetName,
|
||||
isSelected: selectedWidgets.includes(widget.widgetId),
|
||||
isExpanded: expandedWidgets.includes(widget.widgetId),
|
||||
type: widget.type,
|
||||
}));
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -68,8 +68,8 @@ export const WidgetTreeItem = ({ item }: { item: EntityListTreeItem }) => {
|
|||
);
|
||||
|
||||
const startIcon = useMemo(
|
||||
() => <WidgetTypeIcon type={widget?.type} />,
|
||||
[widget?.type],
|
||||
() => <WidgetTypeIcon type={item.type} />,
|
||||
[item.type],
|
||||
);
|
||||
|
||||
const onClick = useCallback(
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user