diff --git a/src/Pages/DistributedUptimeStatus/Create/index.jsx b/src/Pages/DistributedUptimeStatus/Create/index.jsx index c05d4e971..b1e54df6e 100644 --- a/src/Pages/DistributedUptimeStatus/Create/index.jsx +++ b/src/Pages/DistributedUptimeStatus/Create/index.jsx @@ -20,11 +20,13 @@ import { createToast } from "../../../Utils/toastUtils"; import { useNavigate } from "react-router-dom"; import { useMonitorsFetch } from "../../StatusPage/Create/Hooks/useMonitorsFetch"; import { useDUStatusPageFetchByUrl } from "../Status/Hooks/useDUStatusPageFetchByUrl"; +import { useTranslation } from "react-i18next"; const CreateStatus = () => { const theme = useTheme(); const { monitorId, url } = useParams(); const navigate = useNavigate(); + const { t } = useTranslation(); const isCreate = typeof url === "undefined"; const [createStatusPage, isLoading, networkError] = useCreateStatusPage(isCreate); @@ -176,7 +178,7 @@ const CreateStatus = () => { component="span" fontSize="inherit" > - {isCreate ? "Create your" : "Edit your"}{" "} + {isCreate ? t("distributedUptimeStatusCreateYour") : t("distributedUptimeStatusEditYour")}{" "} { fontSize="inherit" fontWeight="inherit" > - status page + {t("distributedUptimeStatusCreateStatusPage")} - Access + {t("distributedUptimeStatusCreateStatusPageAccess")} - If your status page is ready, you can mark it as published. + {t("distributedUptimeStatusCreateStatusPageReady")} @@ -206,9 +208,9 @@ const CreateStatus = () => { - Basic Information + {t("distributedUptimeStatusBasicInfoHeader")} - Define company name and the subdomain that your status page points to. + {t("distributedUptimeStatusBasicInfoDescription")} @@ -216,7 +218,7 @@ const CreateStatus = () => { id="companyName" name="companyName" type="text" - label="Company name" + label={t("distributedUptimeStatusCompanyNameLabel")} placeholder="Company name" value={form.companyName} onChange={handleFormChange} @@ -227,7 +229,7 @@ const CreateStatus = () => { id="url" name="url" type="url" - label="Your status page address" + label={t("distributedUptimeStatusPageAddressLabel")} disabled={!isCreate} value={form.url} onChange={handleFormChange} @@ -238,8 +240,8 @@ const CreateStatus = () => { - Logo - Upload a logo for your status page + {t("distributedUptimeStatusLogoHeader")} + {t("distributedUptimeStatusLogoDescription")} { color="accent" tabIndex={-1} > - Upload logo + {t("distributedUptimeStatusLogoUploadButton")} @@ -270,9 +272,9 @@ const CreateStatus = () => { - Standard Monitors + {t("distributedUptimeStatusStandardMonitorsHeader")} - Attach standard monitors to your status page. + {t("distributedUptimeStatusStandardMonitorsDescription")} @@ -301,7 +303,7 @@ const CreateStatus = () => { color="accent" onClick={handleSubmit} > - Save + {t("settingsSave")} diff --git a/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx b/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx index 5ec509376..7ee4ff292 100644 --- a/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx +++ b/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx @@ -1,8 +1,10 @@ import { Stack, Button, ButtonGroup } from "@mui/material"; import { useTheme } from "@emotion/react"; +import { useTranslation } from "react-i18next"; const TimeFrameHeader = ({ timeFrame, setTimeFrame, sx, ...props }) => { const theme = useTheme(); + const { t } = useTranslation(); return ( { filled={(timeFrame === 30).toString()} onClick={() => setTimeFrame(30)} > - 30 days + {t("distributedUptimeStatus30Days")} diff --git a/src/Pages/DistributedUptimeStatus/Status/index.jsx b/src/Pages/DistributedUptimeStatus/Status/index.jsx index 515bd9be5..44ca68ade 100644 --- a/src/Pages/DistributedUptimeStatus/Status/index.jsx +++ b/src/Pages/DistributedUptimeStatus/Status/index.jsx @@ -124,9 +124,9 @@ const DistributedUptimeStatus = () => { marginY={theme.spacing(4)} color={theme.palette.primary.contrastTextTertiary} > - A status page is not set up. + {t("distributedUptimeStatusPageNotSetUp")} - Please contact your administrator + {t("distributedUptimeStatusContactAdmin")} ); @@ -137,7 +137,7 @@ const DistributedUptimeStatus = () => { return ( - This status page is not public. + {t("distributedUptimeStatusPageNotPublic")} ); @@ -155,9 +155,9 @@ const DistributedUptimeStatus = () => { marginY={theme.spacing(4)} color={theme.palette.primary.contrastTextTertiary} > - Network error + {t("networkError")} - Please check your connection + {t("checkConnection")} ); } @@ -171,7 +171,7 @@ const DistributedUptimeStatus = () => { - There is no check history for this monitor yet. + {t("distributedUptimeDetailsNoMonitorHistory")} ); @@ -246,17 +246,17 @@ const DistributedUptimeStatus = () => { gap={theme.spacing(8)} > @@ -295,7 +295,7 @@ const DistributedUptimeStatus = () => {