diff --git a/public/locales/en-US/translation.json b/public/locales/en-US/translation.json index cadb80d..e7d8963 100644 --- a/public/locales/en-US/translation.json +++ b/public/locales/en-US/translation.json @@ -286,8 +286,12 @@ } }, "actions": { - "enable2fa": "2-Factor-Authentication", + "enable2fa": "Two-Factor-Authentication", "aliasPreferences": "Alias Preferences" + }, + "2fa": { + "title": "Two-Factor-Authentication", + "alreadyEnabled": "You have successfully enabled 2FA!" } }, "LogoutRoute": { diff --git a/src/App.tsx b/src/App.tsx index 208316b..dcdef42 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -27,6 +27,7 @@ import ReportsRoute from "~/routes/ReportsRoute" import ReservedAliasDetailRoute from "~/routes/ReservedAliasDetailRoute" import ReservedAliasesRoute from "~/routes/ReservedAliasesRoute" import RootRoute from "~/routes/Root" +import Settings2FARoute from "~/routes/Settings2FARoute" import SettingsAliasPreferencesRoute from "~/routes/SettingsAliasPreferencesRoute" import SettingsRoute from "~/routes/SettingsRoute" import SignupRoute from "~/routes/SignupRoute" @@ -96,6 +97,10 @@ const router = createBrowserRouter([ path: "/settings/alias-preferences", element: , }, + { + path: "/settings/2fa", + element: , + }, { path: "/reports", loader: getServerSettings, diff --git a/src/apis/get-has-2fa-enabled.ts b/src/apis/get-has-2fa-enabled.ts new file mode 100644 index 0000000..80063b2 --- /dev/null +++ b/src/apis/get-has-2fa-enabled.ts @@ -0,0 +1,9 @@ +import {client} from "~/constants/axios-client" + +export default async function getHas2FAEnabled(): Promise { + const {data} = await client.get(`${import.meta.env.VITE_SERVER_BASE_URL}/v1/setup-otp/`, { + withCredentials: true, + }) + + return data.enabled +} diff --git a/src/routes/Settings2FARoute.tsx b/src/routes/Settings2FARoute.tsx new file mode 100644 index 0000000..0f7e9c9 --- /dev/null +++ b/src/routes/Settings2FARoute.tsx @@ -0,0 +1,32 @@ +import {ReactElement} from "react" +import {AxiosError} from "axios" +import {useTranslation} from "react-i18next" + +import {useQuery} from "@tanstack/react-query" +import {Alert} from "@mui/material" + +import {QueryResult, SimplePageBuilder} from "~/components" +import getHas2FAEnabled from "~/apis/get-has-2fa-enabled" + +export default function Settings2FARoute(): ReactElement { + const {t} = useTranslation() + const query = useQuery(["get_2fa_enabled"], getHas2FAEnabled) + + return ( + + query={query}> + {has2FAEnabled => + has2FAEnabled ? ( + <> + + {t("routes.SettingsRoute.2fa.alreadyEnabled")} + + + ) : ( + <> + ) + } + + + ) +}