1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
import React from "react";
import { Platform, View } from "react-native";
import * as Clipboard from "expo-clipboard";
import { Button } from "@/components/ui/Button";
import CustomSafeAreaView from "@/components/ui/CustomSafeAreaView";
import { Input } from "@/components/ui/Input";
import { Text } from "@/components/ui/Text";
import useAppSettings from "@/lib/settings";
import { buildApiHeaders, cn } from "@/lib/utils";
import { z } from "zod";
export default function TestConnection() {
const { settings, isLoading } = useAppSettings();
const [text, setText] = React.useState("");
const [randomId, setRandomId] = React.useState(Math.random());
const [status, setStatus] = React.useState<"running" | "success" | "error">(
"running",
);
const appendText = (text: string) => {
setText((prev) => prev + (prev ? "\n\n" : "") + text);
};
React.useEffect(() => {
if (isLoading) {
return;
}
setStatus("running");
appendText("Running connection test ...");
function runTest() {
const request = new XMLHttpRequest();
request.onreadystatechange = () => {
if (request.readyState !== 4) {
return;
}
if (request.status === 0) {
appendText("Network connection failed: " + request.responseText);
setStatus("error");
return;
}
if (request.status !== 200) {
appendText("Recieve non success error code: " + request.status);
appendText("Got the following response:");
appendText(request.responseText);
setStatus("error");
return;
}
try {
const schema = z.object({
status: z.string(),
});
const data = schema.parse(JSON.parse(request.responseText));
if (data.status !== "ok") {
appendText(`Server is not healthy: ${data.status}`);
setStatus("error");
return;
}
appendText("ALL GOOD");
setStatus("success");
} catch (e) {
appendText(`Failed to parse response as JSON: ${e}`);
appendText("Got the following response:");
appendText(request.responseText);
setStatus("error");
return;
}
};
appendText("Using address: " + settings.address);
request.open("GET", `${settings.address}/api/health`);
const headers = buildApiHeaders(settings.apiKey, settings.customHeaders);
Object.entries(headers).forEach(([key, value]) => {
request.setRequestHeader(key, value);
});
request.send();
}
runTest();
}, [settings.address, randomId]);
return (
<CustomSafeAreaView>
<View className="m-4 flex flex-col gap-2 p-2">
<Button
className="w-full"
onPress={async () => {
await Clipboard.setStringAsync(text);
}}
>
<Text>Copy Diagnostics Result</Text>
</Button>
<Button
className="w-full"
variant="secondary"
onPress={() => {
setText("");
setRandomId(Math.random());
}}
>
<Text>Retry</Text>
</Button>
<View
className={cn(
"w-full rounded-md p-2",
status === "running" && "bg-primary/50",
status === "success" && "bg-green-500",
status === "error" && "bg-red-500",
)}
>
<Text
className={cn(
"w-full text-center",
status === "running" && "text-primary-foreground",
status === "success" && "text-white",
status === "error" && "text-white",
)}
>
{status === "running" && "Running connection test ..."}
{status === "success" && "Connection test successful"}
{status === "error" && "Connection test failed"}
</Text>
</View>
<Input
className="h-fit leading-6"
style={{
fontFamily: Platform.OS === "ios" ? "Courier New" : "monospace",
}}
multiline={true}
scrollEnabled={true}
value={text}
onChangeText={setText}
editable={false}
/>
</View>
</CustomSafeAreaView>
);
}
|