Error bounds fixed

This commit is contained in:
Atridad Lahiji 2023-11-22 17:06:29 -07:00
parent df66277d30
commit a5f13a8a06
No known key found for this signature in database
6 changed files with 63 additions and 62 deletions

View file

@ -31,9 +31,9 @@ export async function loader({ context, params, request }: LoaderFunctionArgs) {
}); });
if (!room) { if (!room) {
return json("Room is Missing!", { return json(undefined, {
status: 404, status: 404,
statusText: "BAD REQUEST!", statusText: "NOT FOUND!",
}); });
} }

View file

@ -26,17 +26,6 @@ export async function loader({ context, params, request }: LoaderFunctionArgs) {
}); });
} }
const room = await db.query.rooms.findFirst({
where: eq(rooms.id, roomId),
});
if (!room) {
return json("Room is Missing!", {
status: 404,
statusText: "BAD REQUEST!",
});
}
const name = sessionClaims.name as string; const name = sessionClaims.name as string;
const image = sessionClaims.image as string; const image = sessionClaims.image as string;
const metadata = sessionClaims.metadata as { const metadata = sessionClaims.metadata as {

View file

@ -26,17 +26,6 @@ export async function loader({ context, params, request }: LoaderFunctionArgs) {
}); });
} }
const room = await db.query.rooms.findFirst({
where: eq(rooms.id, roomId),
});
if (!room) {
return json("Room is Missing!", {
status: 404,
statusText: "BAD REQUEST!",
});
}
return eventStream(request.signal, function setup(send) { return eventStream(request.signal, function setup(send) {
async function handler() { async function handler() {
const votesByRoomId = await db.query.votes.findMany({ const votesByRoomId = await db.query.votes.findMany({

View file

@ -13,7 +13,8 @@ export const loader: LoaderFunction = async (args) => {
if (!userId) { if (!userId) {
return redirect("/sign-in"); return redirect("/sign-in");
} }
return {};
if (userId) return {};
}; };
type RoomsResponse = type RoomsResponse =

View file

@ -1,6 +1,6 @@
import { getAuth } from "@clerk/remix/ssr.server"; import { getAuth } from "@clerk/remix/ssr.server";
import { LoaderFunction, redirect } from "@remix-run/node"; import { LoaderFunction, json, redirect } from "@remix-run/node";
import { Link, useParams } from "@remix-run/react"; import { Link, useParams, useRouteError } from "@remix-run/react";
import { import {
CheckCircleIcon, CheckCircleIcon,
CopyIcon, CopyIcon,
@ -20,16 +20,67 @@ import { useEventSource } from "remix-utils/sse/react";
import { PresenceItem, RoomResponse, VoteResponse } from "~/services/types"; import { PresenceItem, RoomResponse, VoteResponse } from "~/services/types";
import { isAdmin, jsonToCsv } from "~/services/helpers"; import { isAdmin, jsonToCsv } from "~/services/helpers";
import { useUser } from "@clerk/remix"; import { useUser } from "@clerk/remix";
import { db } from "~/services/db.server";
import { rooms } from "~/services/schema";
import { eq } from "drizzle-orm";
import { shitList } from "~/services/consts";
// Loader
export const loader: LoaderFunction = async (args) => { export const loader: LoaderFunction = async (args) => {
const { userId } = await getAuth(args); const { userId, sessionClaims } = await getAuth(args);
if (!userId) { if (!userId) {
return redirect("/sign-in"); return redirect("/sign-in");
} }
const room = await db.query.rooms.findFirst({
where: eq(rooms.id, args.params.roomId as string),
});
if (!room) {
throw new Response(null, {
status: 404,
statusText: "Not Found",
});
}
let isShit = false;
const email = sessionClaims.email as string;
shitList.forEach((shitItem) => {
if (email.includes(shitItem)) {
isShit = true;
}
});
if (isShit) {
return redirect(
"https://www.youtube.com/watch?v=dQw4w9WgXcQ&pp=ygUXbmV2ZXIgZ29ubmEgZ2l2ZSB5b3UgdXA%3D"
);
}
return {}; return {};
}; };
// Checks for 404
export function ErrorBoundary() {
return (
<span className="text-center">
<h1 className="text-5xl font-bold m-2">404</h1>
<h1 className="text-5xl font-bold m-2">
Oops! This room does not appear to exist, or may have been deleted! 😢
</h1>
<Link
about="Back to home."
to="/"
className="btn btn-secondary normal-case text-xl m-2"
>
Back to Home
</Link>
</span>
);
}
export default function Room() { export default function Room() {
const { user } = useUser(); const { user } = useUser();
const params = useParams(); const params = useParams();
@ -49,7 +100,9 @@ export default function Room() {
let roomFromDbParsed = (roomFromDb ? JSON.parse(roomFromDb!) : undefined) as let roomFromDbParsed = (roomFromDb ? JSON.parse(roomFromDb!) : undefined) as
| RoomResponse | RoomResponse
| null
| undefined; | undefined;
let votesFromDbParsed = JSON.parse(votesFromDb!) as VoteResponse | undefined; let votesFromDbParsed = JSON.parse(votesFromDb!) as VoteResponse | undefined;
let presenceDateParsed = JSON.parse(presenceData!) as let presenceDateParsed = JSON.parse(presenceData!) as
| PresenceItem[] | PresenceItem[]
@ -62,24 +115,6 @@ export default function Room() {
// Handlers // Handlers
// ================================= // =================================
async function getRoomHandler() {
const response = await fetch(`/api/internal/room/${roomId}`, {
cache: "no-cache",
method: "GET",
});
return (await response.json()) as RoomResponse;
}
async function getVotesHandler() {
const dbVotesResponse = await fetch(`/api/internal/room/${roomId}/votes`, {
cache: "no-cache",
method: "GET",
});
const dbVotes = (await dbVotesResponse.json()) as VoteResponse;
return dbVotes;
}
async function setVoteHandler(value: string) { async function setVoteHandler(value: string) {
if (roomFromDb) { if (roomFromDb) {
await fetch(`/api/vote/set/${roomId}`, { await fetch(`/api/vote/set/${roomId}`, {
@ -208,11 +243,11 @@ export default function Room() {
// UI // UI
// ================================= // =================================
// Room is loading // Room is loading
if (roomFromDbParsed === null) { if (!roomFromDbParsed) {
return <LoadingIndicator />; return <LoadingIndicator />;
// Room has been loaded // Room has been loaded
} else { } else {
return roomFromDb ? ( return (
<div className="flex flex-col gap-4 text-center justify-center items-center"> <div className="flex flex-col gap-4 text-center justify-center items-center">
<div className="text-2xl">{roomFromDbParsed?.roomName}</div> <div className="text-2xl">{roomFromDbParsed?.roomName}</div>
<div className="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-md"> <div className="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-md">
@ -439,20 +474,6 @@ export default function Room() {
</> </>
)} )}
</div> </div>
) : (
<span className="text-center">
<h1 className="text-5xl font-bold m-2">404</h1>
<h1 className="text-5xl font-bold m-2">
Oops! This room does not appear to exist, or may have been deleted! 😢
</h1>
<Link
about="Back to home."
to="/"
className="btn btn-secondary normal-case text-xl m-2"
>
Back to Home
</Link>
</span>
); );
} }
} }

1
app/services/consts.ts Normal file
View file

@ -0,0 +1 @@
export const shitList = ["ama.ab.ca"];