Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-24 09:28:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixes: Component inspector go blank after switching to different pages after dropping components (#7637)

Browse source
This commit is contained in:
Arpit 2023-10-06 16:35:47 +05:30 committed by GitHub
parent afbd4a24d5
commit b3625d6cef
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
frontend/src/Editor/EditorFunc.jsx
View file

@ -531,16 +531,6 @@ const EditorComponent = (props) => {
} }
}; };
const onAreaSelectionEnd = (e) => {
setSelectionInProgress(false);
e.selected.forEach((el, index) => {
const id = el.getAttribute('widgetid');
const component = appDefinition?.pages[currentPageId].components[id].component;
const isMultiSelect = e.inputEvent.shiftKey || (!e.isClick && index != 0);
setSelectedComponent(id, component, isMultiSelect);
});
};
const setSelectedComponent = (id, component, multiSelect = false) => { const setSelectedComponent = (id, component, multiSelect = false) => {
if (selectedComponents.length === 0 || !multiSelect) { if (selectedComponents.length === 0 || !multiSelect) {
switchSidebarTab(1); switchSidebarTab(1);
@ -558,6 +548,16 @@ const EditorComponent = (props) => {
} }
}; };
const onAreaSelectionEnd = (e) => {
setSelectionInProgress(false);
e.selected.forEach((el, index) => {
const id = el.getAttribute('widgetid');
const component = appDefinition?.pages[currentPageId].components[id].component;
const isMultiSelect = e.inputEvent.shiftKey || (!e.isClick && index != 0);
setSelectedComponent(id, component, isMultiSelect);
});
};
const onVersionRelease = (versionId) => { const onVersionRelease = (versionId) => {
useAppVersionStore.getState().actions.updateReleasedVersionId(versionId); useAppVersionStore.getState().actions.updateReleasedVersionId(versionId);
@ -1206,6 +1206,11 @@ const EditorComponent = (props) => {
}; };
setCurrentPageId(newPageId); setCurrentPageId(newPageId);
setHoveredComponent(null);
updateEditorState({
currentSidebarTab: 2,
selectedComponents: [],
});
appDefinitionChanged(copyOfAppDefinition, { appDefinitionChanged(copyOfAppDefinition, {
pageDefinitionChanged: true, pageDefinitionChanged: true,
@ -1748,24 +1753,20 @@ const EditorComponent = (props) => {
{currentSidebarTab === 1 && ( {currentSidebarTab === 1 && (
<div className="pages-container"> <div className="pages-container">
{selectedComponents.length === 1 && {selectedComponents.length === 1 &&
!isEmpty(appDefinition?.pages[currentPageId]?.components) && !isEmpty(appDefinition?.pages[currentPageId]?.components) &&
!isEmpty(appDefinition?.pages[currentPageId]?.components[selectedComponents[0].id]) ? ( !isEmpty(appDefinition?.pages[currentPageId]?.components[selectedComponents[0].id]) && (
<Inspector <Inspector
moveComponents={moveComponents} moveComponents={moveComponents}
componentDefinitionChanged={componentDefinitionChanged} componentDefinitionChanged={componentDefinitionChanged}
removeComponent={removeComponent} removeComponent={removeComponent}
selectedComponentId={selectedComponents[0].id} selectedComponentId={selectedComponents[0].id}
allComponents={appDefinition?.pages[currentPageId]?.components} allComponents={appDefinition?.pages[currentPageId]?.components}
key={selectedComponents[0].id} key={selectedComponents[0].id}
switchSidebarTab={switchSidebarTab} switchSidebarTab={switchSidebarTab}
darkMode={props.darkMode} darkMode={props.darkMode}
pages={getPagesWithIds()} pages={getPagesWithIds()}
></Inspector> ></Inspector>
) : ( )}
<center className="mt-5 p-2">
{props.t('editor.inspectComponent', 'Please select a component to inspect')}
</center>
)}
</div> </div>
)} )}