selfhostyourtech/reflector
2
0
Fork 0
mirror of https://github.com/Monadical-SAS/reflector.git synced 2025-12-20 20:29:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactoring to use Error instead of string in the useError hook state variable

Browse Source
This commit is contained in:
Koper
2023-09-01 12:36:13 +07:00
parent df4dc841fc
commit 41ca80358c
6 changed files with 23 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
www/app/(errors)/errorContext.tsx
View File

@@ -2,8 +2,8 @@
import React, { createContext, useContext, useState } from "react"; import React, { createContext, useContext, useState } from "react";
interface ErrorContextProps { interface ErrorContextProps {
error: string; error: Error | null;
setError: React.Dispatch<React.SetStateAction<string>>; setError: React.Dispatch<React.SetStateAction<Error | null>>;
} }
const ErrorContext = createContext<ErrorContextProps | undefined>(undefined); const ErrorContext = createContext<ErrorContextProps | undefined>(undefined);
@@ -21,7 +21,7 @@ interface ErrorProviderProps {
} }
export const ErrorProvider: React.FC<ErrorProviderProps> = ({ children }) => { export const ErrorProvider: React.FC<ErrorProviderProps> = ({ children }) => {
const [error, setError] = useState<string>(""); const [error, setError] = useState<Error | null>(null);
return ( return (
<ErrorContext.Provider value={{ error, setError }}> <ErrorContext.Provider value={{ error, setError }}>

11
www/app/(errors)/errorMessage.tsx
View File

@@ -1,13 +1,18 @@
"use client"; "use client";
import { useError } from "./errorContext"; import { useError } from "./errorContext";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import * as Sentry from "@sentry/react";
const ErrorMessage: React.FC = () => { const ErrorMessage: React.FC = () => {
const { error, setError } = useError(); const { error, setError } = useError();
const [isVisible, setIsVisible] = useState<boolean>(false); const [isVisible, setIsVisible] = useState<boolean>(false);
useEffect(() => { useEffect(() => {
if (error) setIsVisible(true); if (error) {
setIsVisible(true);
Sentry.captureException(error);
console.error("Error", error.message, error);
}
}, [error]); }, [error]);
if (!isVisible || !error) return null; if (!isVisible || !error) return null;
@@ -16,12 +21,12 @@ const ErrorMessage: React.FC = () => {
<div <div
onClick={() => { onClick={() => {
setIsVisible(false); setIsVisible(false);
setError(""); setError(null);
}} }}
className="max-w-xs z-50 fixed top-16 right-10 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded transition-opacity duration-300 ease-out opacity-100 hover:opacity-75 cursor-pointer transform hover:scale-105" className="max-w-xs z-50 fixed top-16 right-10 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded transition-opacity duration-300 ease-out opacity-100 hover:opacity-75 cursor-pointer transform hover:scale-105"
role="alert" role="alert"
> >
<span className="block sm:inline">{error}</span> <span className="block sm:inline">{error?.message}</span>
</div> </div>
); );
}; };

18
www/app/(errors)/handleError.ts
View File

@@ -1,18 +0,0 @@
import * as Sentry from "@sentry/react";
import { Dispatch, SetStateAction } from "react";
const handleError = (
setError: Dispatch<SetStateAction<String>>,
errorString: string,
errorObj?: any,
) => {
setError(errorString);
if (errorObj) {
Sentry.captureException(errorObj);
} else {
Sentry.captureMessage(errorString);
}
};
export default handleError;

6
www/app/transcripts/useTranscript.ts
View File

@@ -2,7 +2,6 @@ import { useEffect, useState } from "react";
import { DefaultApi, V1TranscriptsCreateRequest } from "../api/apis/DefaultApi"; import { DefaultApi, V1TranscriptsCreateRequest } from "../api/apis/DefaultApi";
import { GetTranscript } from "../api"; import { GetTranscript } from "../api";
import { useError } from "../(errors)/errorContext"; import { useError } from "../(errors)/errorContext";
import handleError from "../(errors)/handleError";
type UseTranscript = { type UseTranscript = {
response: GetTranscript | null; response: GetTranscript | null;
@@ -37,10 +36,7 @@ const useTranscript = (api: DefaultApi): UseTranscript => {
console.debug("New transcript created:", result); console.debug("New transcript created:", result);
}) })
.catch((err) => { .catch((err) => {
const errorString = err.response || err.message || "Unknown error"; setError(err);
handleError(setError, errorString, err);
setLoading(false);
console.error("Error creating transcript:", errorString);
}); });
}; };

23
www/app/transcripts/useWebRTC.ts
View File

@@ -5,7 +5,6 @@ import {
V1TranscriptRecordWebrtcRequest, V1TranscriptRecordWebrtcRequest,
} from "../api/apis/DefaultApi"; } from "../api/apis/DefaultApi";
import { useError } from "../(errors)/errorContext"; import { useError } from "../(errors)/errorContext";
import handleError from "../(errors)/handleError";
const useWebRTC = ( const useWebRTC = (
stream: MediaStream | null, stream: MediaStream | null,
@@ -25,16 +24,12 @@ const useWebRTC = (
try { try {
p = new Peer({ initiator: true, stream: stream }); p = new Peer({ initiator: true, stream: stream });
} catch (error) { } catch (error) {
handleError( setError(error);
setError,
`Failed to create WebRTC Peer: ${error.message}`,
error,
);
return; return;
} }
p.on("error", (err) => { p.on("error", (err) => {
handleError(setError, `WebRTC error: ${err.message}`, err); setError(new Error(`WebRTC error: ${err}`));
}); });
p.on("signal", (data: any) => { p.on("signal", (data: any) => {
@@ -53,19 +48,11 @@ const useWebRTC = (
try { try {
p.signal(answer); p.signal(answer);
} catch (error) { } catch (error) {
handleError( setError(error);
setError,
`Failed to signal answer: ${error.message}`,
error,
);
} }
}) })
.catch((err) => { .catch((error) => {
const errorString = setError(error);
"WebRTC signaling error: " +
(err.response || err.message || "Unknown error");
handleError(setError, errorString, err);
console.error(errorString);
}); });
} }
}); });

20
www/app/transcripts/useWebSockets.ts
View File

@@ -1,7 +1,6 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Topic, FinalSummary, Status } from "./webSocketTypes"; import { Topic, FinalSummary, Status } from "./webSocketTypes";
import { useError } from "../(errors)/errorContext"; import { useError } from "../(errors)/errorContext";
import handleError from "../(errors)/handleError";
type UseWebSockets = { type UseWebSockets = {
transcriptText: string; transcriptText: string;
@@ -106,32 +105,25 @@ export const useWebSockets = (transcriptId: string | null): UseWebSockets => {
break; break;
default: default:
console.error("Unknown event:", message.event); setError(
handleError( new Error(`Received unknown WebSocket event: ${message.event}`),
setError,
`Received unknown WebSocket event: ${message.event}`,
); );
} }
} catch (error) { } catch (error) {
handleError( setError(error);
setError,
`Failed to process WebSocket message: ${error.message}`,
error,
);
} }
}; };
ws.onerror = (error) => { ws.onerror = (error) => {
console.error("WebSocket error:", error); console.error("WebSocket error:", error);
handleError(setError, "A WebSocket error occurred.", error); setError(new Error("A WebSocket error occurred."));
}; };
ws.onclose = (event) => { ws.onclose = (event) => {
console.debug("WebSocket connection closed"); console.debug("WebSocket connection closed");
if (event.code !== 1000) { if (event.code !== 1000) {
handleError( setError(
setError, new Error(`WebSocket closed unexpectedly with code: ${event.code}`),
`WebSocket closed unexpectedly with code: ${event.code}`,
); );
} }
}; };