diff --git a/pkg/shell/hosts_dialog.jsx b/pkg/shell/hosts_dialog.jsx index 3a8de41516a8..91ca8177d6a2 100644 --- a/pkg/shell/hosts_dialog.jsx +++ b/pkg/shell/hosts_dialog.jsx @@ -32,11 +32,14 @@ import { Alert } from "@patternfly/react-core/dist/esm/components/Alert/index.js import { Button } from "@patternfly/react-core/dist/esm/components/Button/index.js"; import { Checkbox } from "@patternfly/react-core/dist/esm/components/Checkbox/index.js"; import { ClipboardCopy } from "@patternfly/react-core/dist/esm/components/ClipboardCopy/index.js"; +import { ExpandableSection } from "@patternfly/react-core/dist/esm/components/ExpandableSection/index.js"; import { Form, FormGroup } from "@patternfly/react-core/dist/esm/components/Form/index.js"; import { Modal } from "@patternfly/react-core/dist/esm/components/Modal/index.js"; +import { Popover } from "@patternfly/react-core/dist/esm/components/Popover/index.js"; import { Radio } from "@patternfly/react-core/dist/esm/components/Radio/index.js"; import { Stack } from "@patternfly/react-core/dist/esm/layouts/Stack/index.js"; import { TextInput } from "@patternfly/react-core/dist/esm/components/TextInput/index.js"; +import { OutlinedQuestionCircleIcon } from "@patternfly/react-icons"; import { FormHelper } from "cockpit-components-form-helper"; import { ModalError } from "cockpit-components-inline-notification.jsx"; @@ -402,6 +405,7 @@ class HostKey extends React.Component { this.state = { inProgress: false, + verifyExpanded: false, error_options: props.error_options, }; @@ -464,8 +468,9 @@ class HostKey extends React.Component { } const callback = this.onAddKey; - const title = this.props.template === "invalid-hostkey" ? cockpit.format(_("$0 key changed"), this.props.host) : _("New host"); - const submitText = _("Accept key and connect"); + const title = cockpit.format(this.props.template === "invalid-hostkey" ? _("$0 key changed") : _("New host: $0"), + this.props.host); + const submitText = _("Trust and add host"); let unknown = false; let body = null; if (!key_type) { @@ -479,18 +484,27 @@ class HostKey extends React.Component {

{cockpit.format(_("To verify a fingerprint, run the following on $0 while physically sitting at the machine or through a trusted network:"), this.props.host)}

ssh-keyscan -t {key_type} localhost | ssh-keygen -lf -

{_("The resulting fingerprint is fine to share via public methods, including email.")}

-

{_("If the fingerprint matches, click 'Accept key and connect'. Otherwise, do not connect and contact your administrator.")}

+

{_("If the fingerprint matches, click 'Trust and add host'. Otherwise, do not connect and contact your administrator.")}

; } else { + const fingerprint_help = +

{ _("The resulting fingerprint is fine to share via public methods, including email.") }

+

{ _("If you are asking someone else to do the verification for you, they can send the results using any method.") }

+ }> + +
; body = <>

{cockpit.format(_("You are connecting to $0 for the first time."), this.props.host)}

-

{_("To ensure that your connection is not intercepted by a malicious third-party, please verify the host key fingerprint:")}

- {fp} -

({key_type})

-

{cockpit.format(_("To verify a fingerprint, run the following on $0 while physically sitting at the machine or through a trusted network:"), this.props.host)}

- ssh-keyscan -t {key_type} localhost | ssh-keygen -lf - -

{_("The resulting fingerprint is fine to share via public methods, including email.")}

-

{_("If the fingerprint matches, click 'Accept key and connect'. Otherwise, do not connect and contact your administrator.")}

+ this.setState({ verifyExpanded }) }> +

{_("Run this command over a trusted network or physically on the remote machine:")}

+ ssh-keyscan -t {key_type} localhost | ssh-keygen -lf - +

{_("The fingerprint should match:")} {fingerprint_help}

+ {fp} +
+ ; } diff --git a/pkg/shell/shell.scss b/pkg/shell/shell.scss index ba6a71bb8fae..fe6c8985c747 100644 --- a/pkg/shell/shell.scss +++ b/pkg/shell/shell.scss @@ -230,6 +230,11 @@ $desktop: $phone + 1px; font-size: small; } +.hostkey-verify-help { + margin-block-end: 1.5em; +} + + /* Alert fixups */ .modal-content .pf-v5-c-alert { text-align: start;