diff --git a/web/package/cockpit-agama.changes b/web/package/cockpit-agama.changes index 791086ffdd..25a4e92db1 100644 --- a/web/package/cockpit-agama.changes +++ b/web/package/cockpit-agama.changes @@ -1,3 +1,10 @@ +------------------------------------------------------------------- +Sat Aug 12 11:35:12 UTC 2023 - Balsa Asanovic + +- Added scroll up functionality to the discover iSCSI form when + the warning shows up after the submit action + (gh#openSUSE/agama#468). + ------------------------------------------------------------------- Wed Aug 2 18:59:16 UTC 2023 - Balsa Asanovic diff --git a/web/src/components/storage/iscsi/DiscoverForm.jsx b/web/src/components/storage/iscsi/DiscoverForm.jsx index e52618d99e..825c7afaaa 100644 --- a/web/src/components/storage/iscsi/DiscoverForm.jsx +++ b/web/src/components/storage/iscsi/DiscoverForm.jsx @@ -19,7 +19,7 @@ * find current contact information at www.suse.com. */ -import React, { useEffect, useState } from "react"; +import React, { useEffect, useRef, useState } from "react"; import { Alert, Form, FormGroup, @@ -46,11 +46,21 @@ export default function DiscoverForm({ onSubmit: onSubmitProp, onCancel }) { const [isLoading, setIsLoading] = useState(false); const [isFailed, setIsFailed] = useState(false); const [isValidAuth, setIsValidAuth] = useState(true); + const alertRef = useRef(null); useEffect(() => { setData(savedData); }, [setData, savedData]); + useEffect(() => { + // Scroll the alert into view + if (isFailed) + alertRef.current.scrollIntoView({ + behavior: "smooth", + block: "start" + }); + }); + const updateData = (key, value) => setData({ ...data, [key]: value }); const onAddressChange = v => updateData("address", v); const onPortChange = v => updateData("port", v); @@ -89,9 +99,15 @@ export default function DiscoverForm({ onSubmit: onSubmitProp, onCancel }) {
{ isFailed && - -

Make sure you provide the correct values

-
} +
+ +

Make sure you provide the correct values

+
+
}