Skip to content

Commit 02a3e4a

Browse files
committed
chore: fix lint issues
1 parent 77529b4 commit 02a3e4a

File tree

5 files changed

+410
-384
lines changed

5 files changed

+410
-384
lines changed

code/components/error/error.tsx

Lines changed: 53 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,62 @@
11
"use client";
22

3-
import Link from "next/link"
3+
import Link from "next/link";
44
import React from "react";
5-
import { Button } from "@/components/ui/button"
6-
import { AlertCircle } from "lucide-react"
7-
import { Card, CardContent, CardFooter, CardHeader } from "@/components/ui/card"
5+
import { Button } from "@/components/ui/button";
6+
import { AlertCircle } from "lucide-react";
7+
import {
8+
Card,
9+
CardContent,
10+
CardFooter,
11+
CardHeader,
12+
} from "@/components/ui/card";
813
import { Logo } from "@/components/utils/logo";
914
import { useSearchParams } from "next/navigation";
1015
import { getError } from "./errors";
1116

12-
1317
export const Error = () => {
14-
const searchParams = useSearchParams();
15-
16-
const errorCode = searchParams.get("errorCode");
17-
18-
const { title, description, action, href } = getError(errorCode || "");
19-
20-
21-
return (
22-
<div className="flex min-h-screen flex-col items-center justify-center bg-background p-4">
23-
24-
<div className="absolute left-4 top-4 text-lg font-semibold text-primary md:left-8 md:top-8"><Logo /></div>
25-
26-
<Card className="mx-auto max-w-md shadow-lg">
27-
<CardHeader className="flex flex-col items-center space-y-1 pb-2 pt-6 text-center">
28-
<div className="mb-4 rounded-full bg-destructive/10 p-3">
29-
<AlertCircle className="h-10 w-10 text-destructive" />
30-
</div>
31-
<h1 className="text-2xl font-bold tracking-tight">Error</h1>
32-
<p className="text-muted-foreground">{title}</p>
33-
</CardHeader>
34-
35-
<CardContent className="text-center">
36-
<p className="mb-4">
37-
<span className="font-semibold">{description}</span>
38-
</p>
39-
</CardContent>
40-
41-
<CardFooter className="flex flex-col space-y-2">
42-
<Button asChild className="w-full">
43-
<Link href={href}>
44-
{action}
45-
</Link>
46-
</Button>
47-
</CardFooter>
48-
</Card>
49-
50-
<p className="mt-8 text-center text-sm text-muted-foreground">
51-
<span className="font-semibold">COLLABORATION TOOL SHOWCASE</span>
52-
<br />A tool for real-time collaboration
53-
</p>
18+
const searchParams = useSearchParams();
19+
20+
const errorCode = searchParams.get("errorCode");
21+
22+
const { description, action, href } = getError(errorCode || "");
23+
24+
return (
25+
<div className="flex min-h-screen flex-col items-center justify-center bg-background relative">
26+
<div className="absolute left-8 top-8 text-lg font-semibold text-primary">
27+
<h1 className="text-4xl font-noto-sans-mono font-extralight text-foreground uppercase">
28+
Whiteboard
29+
</h1>
30+
<h2 className="text-2xl font-noto-sans-mono font-extralight text-muted-foreground uppercase">
31+
Error
32+
</h2>
5433
</div>
55-
);
56-
};
34+
<div className="absolute left-8 bottom-8 text-lg font-semibold text-primary">
35+
<Logo />
36+
</div>
37+
38+
<Card className="mx-auto max-w-md shadow-lg border-0 shadow-none">
39+
<CardHeader className="flex flex-col items-center text-center">
40+
<div className="mb-4 rounded-full bg-destructive/10 p-3">
41+
<AlertCircle className="h-10 w-10 text-destructive" />
42+
</div>
43+
<h3 className="text-xl font-noto-sans font-extralight">
44+
An error has occurred
45+
</h3>
46+
</CardHeader>
47+
48+
<CardContent className="text-center">
49+
<p>
50+
<span className="text-sm font-noto-sans-mono">{description}</span>
51+
</p>
52+
</CardContent>
53+
54+
<CardFooter className="flex flex-col mt-3">
55+
<Button asChild className="w-full font-noto-sans-mono uppercase">
56+
<Link href={href}>{action}</Link>
57+
</Button>
58+
</CardFooter>
59+
</Card>
60+
</div>
61+
);
62+
};

code/components/error/errors.ts

Lines changed: 25 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,35 @@
1-
const missingRequiredParameters = {
2-
title: "Missing required parameters",
1+
const errors = {
2+
"room-required-parameters": {
33
description: "No room or username defined.",
44
action: "Back to Home",
55
href: "/",
6-
}
6+
},
7+
"room-failed-connection": {
8+
description: "Failed to obtain the room connection endpoint.",
9+
action: "Back to Home",
10+
href: "/",
11+
},
12+
};
713

814
type CommonErrors = {
9-
[key: string]: {
10-
title: string
11-
description: string
12-
action: string
13-
href: string
14-
}
15-
}
15+
[key: string]: {
16+
description: string;
17+
action: string;
18+
href: string;
19+
};
20+
};
1621

1722
const COMMON_ERRORS: CommonErrors = {
18-
"missing-required-parameters": missingRequiredParameters,
19-
}
23+
"room-required-parameters": errors["room-required-parameters"],
24+
"room-failed-connection": errors["room-failed-connection"],
25+
};
2026

2127
export const getError = (errorCode: string) => {
22-
return COMMON_ERRORS[errorCode] || {
23-
title: "Unknown error",
24-
description: "An unknown error occurred.",
25-
action: "Back to Home",
26-
href: "/",
28+
return (
29+
COMMON_ERRORS[errorCode] || {
30+
description: "An unknown error occurred.",
31+
action: "Back to Home",
32+
href: "/",
2733
}
28-
}
34+
);
35+
};

code/components/room-components/room-loader.tsx

Lines changed: 35 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,51 @@
1-
"use client"
1+
"use client";
22

3-
import { motion } from "framer-motion"
4-
import { Logo } from "../utils/logo"
3+
import { motion } from "framer-motion";
4+
import { Logo } from "../utils/logo";
55

66
type RoomLoaderProps = {
7-
roomId: string;
7+
roomId?: string;
88
content: string;
9-
}
9+
description?: string;
10+
};
1011

11-
export function RoomLoader({ roomId, content }: Readonly<RoomLoaderProps>) {
12+
export function RoomLoader({
13+
roomId,
14+
content,
15+
description,
16+
}: Readonly<RoomLoaderProps>) {
1217
return (
1318
<div className="flex flex-col items-center justify-center space-y-4 p-4">
1419
<motion.div
15-
animate={{
16-
rotate: 360,
17-
}}
18-
transition={{
19-
duration: 2,
20-
repeat: Number.POSITIVE_INFINITY,
21-
ease: "linear",
22-
}}
23-
>
24-
<Logo kind="large" variant="no-text"/>
25-
</motion.div>
20+
animate={{
21+
rotate: 360,
22+
}}
23+
transition={{
24+
duration: 2,
25+
repeat: Number.POSITIVE_INFINITY,
26+
ease: "linear",
27+
}}
28+
>
29+
<Logo kind="large" variant="no-text" />
30+
</motion.div>
2631
<motion.div
2732
initial={{ opacity: 0 }}
2833
animate={{ opacity: 1 }}
2934
transition={{ duration: 0.8 }}
3035
className="flex flex-col justify-center items-center"
31-
>
32-
<p className="text-lg text-primary">CONNECTING TO ROOM <b>{roomId}</b></p>
33-
<p className="text-base text-primary">{content}</p>
36+
>
37+
<div className="font-noto-sans font-extralight text-base text-primary uppercase">
38+
{content}
39+
</div>
40+
{roomId && (
41+
<div className="font-noto-sans text-2xl text-primary">{roomId}</div>
42+
)}
43+
{description && (
44+
<div className="font-noto-sans-mono text-base text-primary mt-3">
45+
{description}
46+
</div>
47+
)}
3448
</motion.div>
3549
</div>
36-
)
50+
);
3751
}
38-

code/components/room/room.layout.tsx

Lines changed: 0 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -9,29 +9,13 @@ import { RoomStatusOverlay } from "@/components/room-components/overlay/room-sta
99
import { ToolsOverlay } from "@/components/room-components/overlay/tools-overlay";
1010
import { MultiuseOverlay } from "@/components/room-components/overlay/multiuse-overlay";
1111
import { useWeave } from "@inditextech/weavejs-react";
12-
import { RoomLoader } from "../room-components/room-loader";
1312
import { WEAVE_INSTANCE_STATUS } from "@inditextech/weavejs-sdk";
14-
import { RoomError } from "../room-components/room-error";
1513
import { ZoomHandlerOverlay } from "../room-components/overlay/zoom-handler-overlay";
1614

17-
const statusMap = {
18-
["idle"]: "Idle",
19-
["starting"]: "Starting Weave...",
20-
["loadingFonts"]: "Loading custom fonts...",
21-
["running"]: "Running",
22-
};
23-
2415
export const RoomLayout = () => {
2516
const status = useWeave((state) => state.status);
2617
const roomLoaded = useWeave((state) => state.room.loaded);
2718

28-
const roomId = useCollaborationRoom((state) => state.room);
29-
const errorFetchConnectionUrl = useCollaborationRoom(
30-
(state) => state.fetchConnectionUrl.error
31-
);
32-
const loadingFetchConnectionUrl = useCollaborationRoom(
33-
(state) => state.fetchConnectionUrl.loading
34-
);
3519
const contextMenuShow = useCollaborationRoom(
3620
(state) => state.contextMenu.show
3721
);
@@ -49,46 +33,9 @@ export const RoomLayout = () => {
4933
);
5034
const loadingImage = useCollaborationRoom((state) => state.images.loading);
5135

52-
if (loadingFetchConnectionUrl) {
53-
return (
54-
<div className="absolute top-0 left-0 right-0 bottom-0 bg-light-background-1 flex justify-center items-center">
55-
<RoomLoader
56-
roomId={roomId ?? "undefined"}
57-
content="Loading fetch URL"
58-
/>
59-
</div>
60-
);
61-
}
62-
63-
if (errorFetchConnectionUrl) {
64-
return (
65-
<div className="absolute top-0 left-0 right-0 bottom-0 bg-light-background-1 flex justify-center items-center">
66-
<RoomError
67-
content={`Failed to fetch client connection URL for room ${roomId}`}
68-
/>
69-
</div>
70-
);
71-
}
72-
7336
return (
7437
<div className="w-full h-full relative flex">
7538
<div id="weave" className="w-full h-full"></div>
76-
{status !== WEAVE_INSTANCE_STATUS.RUNNING && (
77-
<div className="absolute top-0 left-0 right-0 bottom-0 bg-light-background-1 flex justify-center items-center">
78-
<RoomLoader
79-
roomId={roomId ?? "undefined"}
80-
content={statusMap[status]}
81-
/>
82-
</div>
83-
)}
84-
{status === WEAVE_INSTANCE_STATUS.RUNNING && !roomLoaded && (
85-
<div className="absolute top-0 left-0 right-0 bottom-0 bg-light-background-1 flex justify-center items-center">
86-
<RoomLoader
87-
roomId={roomId ?? "undefined"}
88-
content="Loading room content..."
89-
/>
90-
</div>
91-
)}
9239
{status === WEAVE_INSTANCE_STATUS.RUNNING && roomLoaded && (
9340
<>
9441
<ContextMenuRender

0 commit comments

Comments
 (0)