Merge pull request #222 from adobe/issue/refresh-model

fix: refresh model for dynamic path
adobe · Dec 11, 2023 · 2990563 · 2990563
2 parents 8c983ba + c101fce
commit 2990563
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/core/EditableComponent.tsx b/src/core/EditableComponent.tsx
@@ -54,6 +54,10 @@ export const EditableComponent = (editableProps: EditableComponentProps): JSX.El
   const path = cqPath || Utils.getCQPath({ cqPath, pagePath, itemPath });
   const [model, setModel] = React.useState(() => userModel || {});
 
+  React.useEffect(() => {
+    setModel(userModel ?? {});
+  }, [path, userModel]);
+
   React.useEffect(() => {
     const renderContent = () => updateModel({ path, forceReload, setModel, isInEditor, pagePath });
     !Object.keys(model)?.length && renderContent();
@@ -79,7 +83,6 @@ export const EditableComponent = (editableProps: EditableComponentProps): JSX.El
 
   const { appliedCssClassNames = '' } = model;
   const componentClassName = `${className} ${props.containerProps?.className || ''} ${appliedCssClassNames}`.trim();
-
   const updatedComponent = addPropsToComponent(children, pagePath ? componentProps : model);
   return isInEditor || (!props.removeDefaultStyles && componentClassName) ? (
     <div className={componentClassName} {...dataAttr}>