diff --git a/src/backend/accounts/meta.ts b/src/backend/accounts/meta.ts
index 1747a7a3..ec6b94be 100644
--- a/src/backend/accounts/meta.ts
+++ b/src/backend/accounts/meta.ts
@@ -1,6 +1,7 @@
import { ofetch } from "ofetch";
export interface MetaResponse {
+ version: string;
name: string;
description?: string;
hasCaptcha: boolean;
diff --git a/src/pages/admin/AdminPage.tsx b/src/pages/admin/AdminPage.tsx
index d98660d2..fd5c671f 100644
--- a/src/pages/admin/AdminPage.tsx
+++ b/src/pages/admin/AdminPage.tsx
@@ -5,6 +5,8 @@ import { ConfigValuesPart } from "@/pages/parts/admin/ConfigValuesPart";
import { TMDBTestPart } from "@/pages/parts/admin/TMDBTestPart";
import { WorkerTestPart } from "@/pages/parts/admin/WorkerTestPart";
+import { BackendTestPart } from "../parts/admin/BackendTestPart";
+
export function AdminPage() {
return (
@@ -13,6 +15,7 @@ export function AdminPage() {
Useful tools to test out your current deployment
+
diff --git a/src/pages/parts/admin/BackendTestPart.tsx b/src/pages/parts/admin/BackendTestPart.tsx
new file mode 100644
index 00000000..555a20f7
--- /dev/null
+++ b/src/pages/parts/admin/BackendTestPart.tsx
@@ -0,0 +1,128 @@
+import { useState } from "react";
+import { useAsyncFn } from "react-use";
+
+import { MetaResponse, getBackendMeta } from "@/backend/accounts/meta";
+import { Button } from "@/components/Button";
+import { Icon, Icons } from "@/components/Icon";
+import { Box } from "@/components/layout/Box";
+import { Spinner } from "@/components/layout/Spinner";
+import { Divider } from "@/components/utils/Divider";
+import { Heading2 } from "@/components/utils/Text";
+import { conf } from "@/setup/config";
+
+export function BackendTestPart() {
+ const backendUrl = conf().BACKEND_URL;
+
+ const [status, setStatus] = useState<{
+ hasTested: boolean;
+ success: boolean;
+ errorText: string;
+ value: MetaResponse | null;
+ }>({
+ hasTested: false,
+ success: false,
+ errorText: "",
+ value: null,
+ });
+
+ const [testState, runTests] = useAsyncFn(async () => {
+ setStatus({
+ hasTested: false,
+ success: false,
+ errorText: "",
+ value: null,
+ });
+
+ try {
+ const backendData = await getBackendMeta(backendUrl);
+ return setStatus({
+ hasTested: true,
+ success: true,
+ errorText:
+ "Failed to call backend, double check the URL key and your internet connection",
+ value: backendData,
+ });
+ } catch (err) {
+ return setStatus({
+ hasTested: true,
+ success: false,
+ errorText:
+ "Failed to call backend, double check the URL key and your internet connection",
+ value: null,
+ });
+ }
+ }, [setStatus]);
+
+ return (
+ <>
+ Backend API test
+
+
+
+ {status.hasTested && status.success ? (
+ <>
+
+
+ Version:
+
+ {status.value?.version}
+
+
+
+ Backend name:
+
+ {status.value?.name}
+
+
+
+ Description:
+
+ {status.value?.description ?? "Not set"}
+
+
+
+ Captcha enabled:
+
+ {status.value?.hasCaptcha ? "Yes" : "No"}
+
+
+ >
+ ) : null}
+
+
+
+ {!status.hasTested ? (
+
Run the test to validate backend
+ ) : status.success ? (
+
+
+ Backend is working as expected
+
+ ) : (
+
+
+
+ Backend is not working
+
+
{status.errorText}
+
+ )}
+
+
+
+ >
+ );
+}
diff --git a/src/pages/parts/admin/TMDBTestPart.tsx b/src/pages/parts/admin/TMDBTestPart.tsx
index 33d35144..de9b53f4 100644
--- a/src/pages/parts/admin/TMDBTestPart.tsx
+++ b/src/pages/parts/admin/TMDBTestPart.tsx
@@ -77,7 +77,13 @@ export function TMDBTestPart() {
) : (
<>
- TMDB is not working
+
+
+ TMDB is not working
+
{status.errorText}
>
)}