feat: add rate limit warning to frontend

frontend/src/lib/i18n/locales/en-US.json

@@ -6,6 +6,7 @@
     "loginSubmit": "Login",
     "loginFailTitle": "Failed to log in",
     "loginFailSubtitle": "Please check your username and password",
+    "loginFailRateLimit": "You failed to login too many times, please try again later",
     "loginSuccessTitle": "Logged in",
     "loginSuccessSubtitle": "Welcome back!",
     "loginOauthFailTitle": "Internal error",

frontend/src/lib/i18n/locales/en.json

@@ -6,6 +6,7 @@
     "loginSubmit": "Login",
     "loginFailTitle": "Failed to log in",
     "loginFailSubtitle": "Please check your username and password",
+    "loginFailRateLimit": "You failed to login too many times, please try again later",
     "loginSuccessTitle": "Logged in",
     "loginSuccessSubtitle": "Welcome back!",
     "loginOauthFailTitle": "Internal error",

frontend/src/pages/login-page.tsx

@@ -1,7 +1,7 @@
 import { Paper, Title, Text, Divider } from "@mantine/core";
 import { notifications } from "@mantine/notifications";
 import { useMutation } from "@tanstack/react-query";
-import axios from "axios";
+import axios, { type AxiosError } from "axios";
 import { useUserContext } from "../context/user-context";
 import { Navigate } from "react-router";
 import { Layout } from "../components/layouts/layout";
@@ -33,7 +33,17 @@ export const LoginPage = () => {
     mutationFn: (login: LoginFormValues) => {
       return axios.post("/api/login", login);
     },
-    onError: () => {
+    onError: (data: AxiosError) => {
+      if (data.response) {
+        if (data.response.status === 429) {
+          notifications.show({
+            title: t("loginFailTitle"),
+            message: t("loginFailRateLimit"),
+            color: "red",
+          });
+          return;
+        }
+      }
       notifications.show({
         title: t("loginFailTitle"),
         message: t("loginFailSubtitle"),