implemented deactivated services banner

Co-authored-by: Copilot <copilot@github.com>

FrontendV2/src/components/DeactivatedServices.tsx

@@ -0,0 +1,67 @@
+import { Alert, Stack, VStack, Spinner, Text, Heading } from "@chakra-ui/react";
+import { useEffect, useState } from "react";
+import { API_BASE } from "@/config/api.config";
+import Cookies from "js-cookie";
+import { useTranslation } from "react-i18next";
+
+export const DeactivatedServices = () => {
+  const { t } = useTranslation();
+
+  const [deactivatedServices, setDeactivatedServices] = useState<
+    { function_name: string }[]
+  >([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    const fetchDeactivatedServices = async () => {
+      setIsLoading(true);
+      try {
+        const response = await fetch(
+          `${API_BASE}/api/users/deactivated-services`,
+          {
+            headers: {
+              Authorization: `Bearer ${Cookies.get("token") || ""}`,
+            },
+          },
+        );
+
+        if (response.ok) {
+          const data = await response.json();
+          setDeactivatedServices(data);
+        } else {
+          console.error("Failed to fetch deactivated services");
+        }
+      } catch (error) {
+        console.error("Error fetching deactivated services:", error);
+      }
+      setIsLoading(false);
+    };
+
+    fetchDeactivatedServices();
+  }, []);
+
+  return (
+    <>
+      {deactivatedServices.length >= 1 && (
+        <Stack gap="2">
+          <Heading size={"xl"}>{t("deactivated-services")}</Heading>
+          {isLoading && (
+            <VStack colorPalette="teal">
+              <Spinner color="colorPalette.600" />
+              <Text color="colorPalette.600">{t("loading")}</Text>
+            </VStack>
+          )}
+          {deactivatedServices.length >= 1 &&
+            deactivatedServices.map((item) => (
+              <Alert.Root key={item.function_name} status="warning">
+                <Alert.Indicator />
+                <Alert.Title>
+                  {item.function_name} {t("is-deactivated")}
+                </Alert.Title>
+              </Alert.Root>
+            ))}
+        </Stack>
+      )}
+    </>
+  );
+};

FrontendV2/src/components/Header.tsx

@@ -69,6 +69,7 @@ export const Header = () => {
       className="mb-6"
       position="relative"
       pr={{ base: 10, md: 0 }} // Platz für den Mobile-Button rechts
+      marginBottom={1}
     >
       {/* Mobile: Drei-Punkte-Button, vertikal zentriert im Header */}
       <Box

FrontendV2/src/pages/HomePage.tsx

@@ -19,6 +19,7 @@ import { createLoan } from "@/utils/Fetcher";
 import { Header } from "@/components/Header";
 import { useTranslation } from "react-i18next";
 import { approvalAnimation } from "@/components/dotLottie";
+import { DeactivatedServices } from "@/components/DeactivatedServices";
 
 export interface User {
   username: string;
@@ -71,6 +72,7 @@ export const HomePage = () => {
       )}
       <Container className="px-6 sm:px-8 pt-10">
         <Header />
+        <DeactivatedServices />
         {isMsg && (
           <MyAlert
             status={msgStatus}

FrontendV2/src/utils/i18n/locales/de/de.json

@@ -94,5 +94,10 @@
     "naas-error": "Fehler mit no-as-a-service",
     "naas-error-desc": "Ein Fehler ist beim Kommunizieren mit no-as-a-service aufgetreten.",
     "naas-header": "Eine gute Möglichkeit, nein zu sagen...",
-    "error-deleting-loan-507": "Die Ausleihe kann nicht gelöscht werden, da sie noch nicht zurückgegeben wurde."
+    "error-deleting-loan-507": "Die Ausleihe kann nicht gelöscht werden, da sie noch nicht zurückgegeben wurde.",
+    "serviceDeactivatedHeadline": "Service deaktiviert",
+    "contactPage_serviceDeactivatedText": "Der Kontaktservice ist derzeit deaktiviert. Bitte versuchen Sie es später erneut.",
+    "loan_page_serviceDeactivatedText": "Der Ausleihservice ist derzeit deaktiviert. Bitte versuchen Sie es später erneut.",
+    "is-deactivated": "ist deaktiviert.",
+    "deactivated-services": "Deaktivierte Services"
 }

FrontendV2/src/utils/i18n/locales/en/en.json

@@ -97,5 +97,7 @@
     "error-deleting-loan-507": "The loan cannot be deleted because it has not been returned yet.",
     "serviceDeactivatedHeadline": "Service deactivated",
     "contactPage_serviceDeactivatedText": "The contact service is currently deactivated. Please try again later.",
-    "loan_page_serviceDeactivatedText": "The loan service is currently deactivated. Please try again later."
+    "loan_page_serviceDeactivatedText": "The loan service is currently deactivated. Please try again later.",
+    "is-deactivated": "is deactivated.",
+    "deactivated-services": "Deactivated services"
 }