Skip to content

fix(web): make hostname strings fully translatable #2268

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dgdavid merged 1 commit into from
Apr 14, 2025
Merged

fix(web): make hostname strings fully translatable #2268

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions web/src/components/system/HostnamePage.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ describe("HostnamePage", () => {
static: "",
});
screen.getByText("Success alert:");
screen.getByText("Hostname successfully updated.");
screen.getByText("Hostname successfully updated");
});
});

Expand Down Expand Up @@ -135,7 +135,7 @@ describe("HostnamePage", () => {
static: "testing-server",
});
screen.getByText("Success alert:");
screen.getByText("Hostname successfully updated.");
screen.getByText("Hostname successfully updated");
});

it("renders an error when static hostname is selected but left empty", async () => {
Expand Down Expand Up @@ -163,7 +163,7 @@ describe("HostnamePage", () => {
});

screen.getByText("Warning alert:");
screen.getByText(/Something went wrong/);
screen.getByText(/Hostname could not be updated/);
});
});

Expand Down
9 changes: 5 additions & 4 deletions web/src/components/system/HostnamePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ export default function HostnamePage() {
const hasTransientHostname = isEmpty(staticHostname);
const [success, setSuccess] = useState<string | null>(null);
const [error, setError] = useState<string | null>(null);
const [requestError, setRequestError] = useState<string | null>(null);
const [settingHostname, setSettingHostname] = useState(!hasTransientHostname);
const [hostname, setHostname] = useState(staticHostname);

Expand All @@ -55,6 +56,7 @@ export default function HostnamePage() {
const submit = async (e: SyntheticEvent) => {
e.preventDefault();
setError(null);
setRequestError(null);
setSuccess(null);

if (settingHostname && isEmpty(hostname)) {
Expand All @@ -63,10 +65,8 @@ export default function HostnamePage() {
}

updateHostname({ static: settingHostname ? hostname : "" })
.then(() => setSuccess("Hostname successfully updated."))
.catch(() =>
setError("Something went wrong while updating the hostname. Please, try again."),
);
.then(() => setSuccess(_("Hostname successfully updated")))
.catch(() => setRequestError(_("Hostname could not be updated")));
};

// TRANSLATORS: The title for a notification shown when the static hostname
Expand Down Expand Up @@ -99,6 +99,7 @@ export default function HostnamePage() {

<Form id="hostnameForm" onSubmit={submit}>
{success && <Alert variant="success" isInline title={success} />}
{requestError && <Alert variant="warning" isInline title={requestError} />}
Copy link
Contributor Author

@dgdavid dgdavid Apr 14, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not using error here, which would be more precise, because it is not being used in other forms at the time of writing. As said in the PR description, we're aware that better form validation and error reporting is needed but they should be addresses all together once we find a way to do so.

{error && (
<Alert variant="warning" isInline title={_("Check the following before continuing")}>
{error}
Expand Down