The weeb for the next gen discord boat - Wamellow
wamellow.com
bot
discord
add switzerland flag
+35
-27
+2
-1
app/(home)/status/api.ts
+2
-1
app/(home)/status/api.ts
···
24
24
nodes: ApiNode[];
25
25
}
26
26
27
-
export async function getStatus(): Promise<ApiV1StatusGetResponse | ApiError | undefined> {
27
+
export async function getStatus(): Promise<ApiV1StatusGetResponse | ApiError | null> {
28
28
const res = await fetch(
29
29
`${process.env.NEXT_PUBLIC_API}/status`,
30
30
{
···
33
33
}
34
34
);
35
35
36
+
if (!res.ok) return null;
36
37
return res.json();
37
38
}
+31
-24
app/(home)/status/page.tsx
+31
-24
app/(home)/status/page.tsx
···
1
+
import Notice from "@/components/notice";
1
2
import { Section } from "@/components/section";
2
3
3
4
import { getStatus } from "./api";
···
9
10
10
11
export default async function Home() {
11
12
const status = await getStatus();
12
-
13
-
if (!status || "message" in status) return;
13
+
const error = !status || "message" in status;
14
14
15
15
return (<>
16
16
<div className="md:flex gap-4 mb-12">
17
-
<div className="space-y-2 w-full md:w-3/4">
18
-
{status.clusters.map((cluster) => (
19
-
<Cluster
20
-
key={"cluster-" + cluster.id}
21
-
{...cluster}
22
-
/>
23
-
))}
24
-
</div>
17
+
{error
18
+
? <Notice message="Failed to fetch cluster status" />
19
+
:
20
+
<div className="space-y-2 w-full md:w-3/4">
21
+
{status.clusters.map((cluster) => (
22
+
<Cluster
23
+
key={"cluster-" + cluster.id}
24
+
{...cluster}
25
+
/>
26
+
))}
27
+
</div>
28
+
}
25
29
26
-
<div className="lg:w-1/4 md:w-1/3 mt-8 md:mt-0">
27
-
<Side
28
-
status={status}
29
-
/>
30
-
</div>
30
+
{!error && (
31
+
<div className="lg:w-1/4 md:w-1/3 mt-8 md:mt-0">
32
+
<Side status={status} />
33
+
</div>
34
+
)}
31
35
</div>
32
36
33
37
<Section title="TTS & VC Nodes">
34
38
The streaming servers used for in Voice-Chat Text to Speech!
35
39
</Section>
36
40
37
-
<div className="grid gap-2 grid-cols-2 md:grid-cols-3 lg:grid-cols-4 w-full">
38
-
{status.nodes.map((node, i) => (
39
-
<Node
40
-
key={"node-" + node.id}
41
-
node={node}
42
-
index={i + 1}
43
-
/>
44
-
))}
45
-
</div>
41
+
{error
42
+
? <Notice message="Failed to fetch node status" />
43
+
: <div className="grid gap-2 grid-cols-2 md:grid-cols-3 lg:grid-cols-4 w-full">
44
+
{status.nodes.map((node, i) => (
45
+
<Node
46
+
key={"node-" + node.id}
47
+
node={node}
48
+
index={i + 1}
49
+
/>
50
+
))}
51
+
</div>
52
+
}
46
53
</>);
47
54
}
+2
-2
app/(home)/status/side.component.tsx
+2
-2
app/(home)/status/side.component.tsx
···
18
18
const [guildId, setGuildId] = useState<string>("");
19
19
20
20
const clusterId = useMemo(
21
-
() => /^\d{15,20}$/.test(guildId) ?
22
-
getClusterId(guildId || "", status.clusters.length)
21
+
() => /^\d{15,20}$/.test(guildId)
22
+
? getClusterId(guildId || "", status.clusters.length)
23
23
: null,
24
24
[guildId]
25
25
);
public/icons/br.png
public/icons/br.png
This is a binary file and will not be displayed.
public/icons/ch.webp
public/icons/ch.webp
This is a binary file and will not be displayed.