diff --git a/src/components/KymaModules/KymaModulesCreate.js b/src/components/KymaModules/KymaModulesCreate.js index a8fd45f8be..8a2b1a9fdc 100644 --- a/src/components/KymaModules/KymaModulesCreate.js +++ b/src/components/KymaModules/KymaModulesCreate.js @@ -3,6 +3,7 @@ import { useState } from 'react'; import { useTranslation } from 'react-i18next'; import { ResourceForm } from 'shared/ResourceForm'; +import './KymaModulesCreate.scss'; export default function KymaModulesCreate({ resource, ...props }) { const { t } = useTranslation(); @@ -13,6 +14,7 @@ export default function KymaModulesCreate({ resource, ...props }) { return ( { @@ -407,6 +411,7 @@ export function KymaModulesList(props) { return ( { - if (leavingForm) { + // Check if form is opened based on width + if (leavingForm && formElementRef.current?.clientWidth > 0) { if ( JSON.stringify(excludeStatus(resource)) !== JSON.stringify(excludeStatus(initialResource)) || @@ -324,5 +325,4 @@ export function ResourceForm({ {createPortal(, document.body)} ); - // } } diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js index f4c5f0ec23..3f9a219174 100644 --- a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js +++ b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js @@ -49,6 +49,7 @@ export const DynamicPageComponent = ({ showYamlTab, protectedResource, protectedResourceWarning, + className, }) => { const [showTitleDescription, setShowTitleDescription] = useState(false); const [layoutColumn, setLayoutColumn] = useRecoilState(columnLayoutState); @@ -241,7 +242,7 @@ export const DynamicPageComponent = ({ return ( { if (isFormOpen.formOpen) { e.preventDefault(); - setIsResourceEdited({ - ...isResourceEdited, - discardAction: () => { - setSelectedSectionIdState(e.detail.sectionId); - setIsResourceEdited({ - isEdited: false, - }); - }, - }); - setIsFormOpen({ formOpen: true, leavingForm: true }); - return; } - setSelectedSectionIdState(e.detail.sectionId); + + handleActionIfFormOpen( + isResourceEdited, + setIsResourceEdited, + isFormOpen, + setIsFormOpen, + () => { + setSelectedSectionIdState(e.detail.sectionId); + setIsResourceEdited({ + isEdited: false, + }); + }, + ); + if (e.detail.sectionId === 'edit') { setIsFormOpen({ formOpen: true }); } diff --git a/src/shared/components/ResourceDetails/ResourceDetails.js b/src/shared/components/ResourceDetails/ResourceDetails.js index c81e1401c5..af296a8dce 100644 --- a/src/shared/components/ResourceDetails/ResourceDetails.js +++ b/src/shared/components/ResourceDetails/ResourceDetails.js @@ -174,6 +174,7 @@ function Resource({ showHealthCardsTitle, statusConditions, headerContent, + className, }) { useVersionWarning({ resourceUrl, resourceType }); const { t } = useTranslation(); @@ -401,6 +402,7 @@ function Resource({ return (