diff --git a/app/(api)/api/page.tsx b/app/(api)/api/page.tsx new file mode 100644 index 00000000..9dfd5db9 --- /dev/null +++ b/app/(api)/api/page.tsx @@ -0,0 +1,36 @@ +"use client"; + +import React, { useState, useEffect } from "react"; +import dynamic from "next/dynamic"; + +const DynamicReactSwagger = dynamic(() => import("./react-swagger"), { + ssr: false, + loading: () =>
Loading...
, +}); + +export default function IndexPage() { + const [spec, setSpec] = useState(null); + + useEffect(() => { + async function fetchSpecs() { + const response = await fetch("/api/getSwaggerDocs"); + + if (response.ok) { + const fetchedSpec = await response.json(); + setSpec(fetchedSpec); + } else { + console.error("Failed to fetch API docs"); + } + } + + fetchSpecs(); + }, []); + + if (!spec) return
Loading...
; + + return ( +
+ +
+ ); +} diff --git a/app/(api)/api/react-swagger.tsx b/app/(api)/api/react-swagger.tsx new file mode 100644 index 00000000..ede2314e --- /dev/null +++ b/app/(api)/api/react-swagger.tsx @@ -0,0 +1,14 @@ +"use client"; + +import SwaggerUI from "swagger-ui-react"; +import "swagger-ui-react/swagger-ui.css"; + +type Props = { + spec: Record; +}; + +function ReactSwagger({ spec }: Props) { + return ; +} + +export default ReactSwagger; diff --git a/app/(network)/layout.tsx b/app/(network)/layout.tsx new file mode 100644 index 00000000..6098684b --- /dev/null +++ b/app/(network)/layout.tsx @@ -0,0 +1,85 @@ +"use client"; +import "../globals.scss"; +import { Inter } from "next/font/google"; +import React, { useState, useEffect } from "react"; +import { checkBackendAvailable } from "@/utils/checkBackendAvailable"; +import { List, Notification, Row } from "@canonical/react-components"; +import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; +import Navigation from "@/components/Navigation"; +import PageContent from "@/components/PageContent"; +import Loader from "@/components/Loader"; + +const inter = Inter({ subsets: ["latin"] }); +const queryClient = new QueryClient(); + +export default function RootLayout({ + children, +}: { + children: React.ReactNode; + noLayout?: boolean; +}) { + const [backendAvailable, setBackendAvailable] = useState( + null, + ); + + useEffect(() => { + const fetchData = async () => { + const isBackendAvailable = await checkBackendAvailable(); + setBackendAvailable(isBackendAvailable); + }; + + fetchData(); + }, []); + + return ( + + + SD Core + + + +
+ +
+
+ {backendAvailable === null && } + {backendAvailable === false && ( + + + {"Backend not available"} + + + )} + {backendAvailable === true && ( + + {children} + + )} +
+
+ +

+ © 2023 Canonical Ltd. Ubuntu and{" "} + Canonical are registered trademarks of + Canonical Ltd. +

+ + Legal information + , + ]} + middot + /> + +
+
+
+ + + ); +} diff --git a/app/network-configuration/page.tsx b/app/(network)/network-configuration/page.tsx similarity index 100% rename from app/network-configuration/page.tsx rename to app/(network)/network-configuration/page.tsx diff --git a/app/subscribers/page.tsx b/app/(network)/subscribers/page.tsx similarity index 93% rename from app/subscribers/page.tsx rename to app/(network)/subscribers/page.tsx index bef2c70f..278d407c 100644 --- a/app/subscribers/page.tsx +++ b/app/(network)/subscribers/page.tsx @@ -61,7 +61,9 @@ const Subscribers = () => { onConfirm: () => handleConfirmDelete(rawIMSI), children: (

- This will permanently delete the subscriber {rawIMSI}
+ This will permanently delete the subscriber{" "} + {rawIMSI} +
This action cannot be undone.

), @@ -83,7 +85,12 @@ const Subscribers = () => { return ( <> -