small fixes and start auth fix

This commit is contained in:
Sara
2023-11-22 12:25:21 +01:00
parent fe7f1a0e78
commit f38dad3ad4
8 changed files with 172 additions and 164 deletions

View File

@@ -11,6 +11,7 @@ import About from "../(aboutAndPrivacy)/about";
import Privacy from "../(aboutAndPrivacy)/privacy"; import Privacy from "../(aboutAndPrivacy)/privacy";
import { DomainContextProvider } from "./domainContext"; import { DomainContextProvider } from "./domainContext";
import { getConfig } from "../lib/edgeConfig"; import { getConfig } from "../lib/edgeConfig";
import { ErrorBoundary } from "@sentry/nextjs";
const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] }); const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] });
@@ -76,6 +77,7 @@ export default async function RootLayout({ children, params }: LayoutProps) {
<body className={poppins.className + " h-screen relative"}> <body className={poppins.className + " h-screen relative"}>
<FiefWrapper> <FiefWrapper>
<DomainContextProvider config={config}> <DomainContextProvider config={config}>
<ErrorBoundary fallback={<p>"something went really wrong"</p>}>
<ErrorProvider> <ErrorProvider>
<ErrorMessage /> <ErrorMessage />
<div <div
@@ -150,6 +152,7 @@ export default async function RootLayout({ children, params }: LayoutProps) {
{children} {children}
</div> </div>
</ErrorProvider> </ErrorProvider>
</ErrorBoundary>
</DomainContextProvider> </DomainContextProvider>
</FiefWrapper> </FiefWrapper>
</body> </body>

View File

@@ -14,6 +14,7 @@ import QRCode from "react-qr-code";
import TranscriptTitle from "../transcriptTitle"; import TranscriptTitle from "../transcriptTitle";
import Player from "../player"; import Player from "../player";
import WaveformLoading from "../waveformLoading"; import WaveformLoading from "../waveformLoading";
import { useRouter } from "next/navigation";
type TranscriptDetails = { type TranscriptDetails = {
params: { params: {
@@ -21,10 +22,11 @@ type TranscriptDetails = {
}; };
}; };
const protectedPath = true; const protectedPath = false;
export default function TranscriptDetails(details: TranscriptDetails) { export default function TranscriptDetails(details: TranscriptDetails) {
const transcriptId = details.params.transcriptId; const transcriptId = details.params.transcriptId;
const router = useRouter();
const transcript = useTranscript(protectedPath, transcriptId); const transcript = useTranscript(protectedPath, transcriptId);
const topics = useTopics(protectedPath, transcriptId); const topics = useTopics(protectedPath, transcriptId);
@@ -32,15 +34,6 @@ export default function TranscriptDetails(details: TranscriptDetails) {
const useActiveTopic = useState<Topic | null>(null); const useActiveTopic = useState<Topic | null>(null);
const mp3 = useMp3(transcriptId); const mp3 = useMp3(transcriptId);
if (transcript?.error || topics?.error) {
return (
<Modal
title="Transcription Not Found"
text="A trascription with this ID does not exist."
/>
);
}
useEffect(() => { useEffect(() => {
const statusToRedirect = ["idle", "recording", "processing"]; const statusToRedirect = ["idle", "recording", "processing"];
if (statusToRedirect.includes(transcript.response?.status)) { if (statusToRedirect.includes(transcript.response?.status)) {
@@ -48,8 +41,8 @@ export default function TranscriptDetails(details: TranscriptDetails) {
// Shallow redirection does not work on NextJS 13 // Shallow redirection does not work on NextJS 13
// https://github.com/vercel/next.js/discussions/48110 // https://github.com/vercel/next.js/discussions/48110
// https://github.com/vercel/next.js/discussions/49540 // https://github.com/vercel/next.js/discussions/49540
// router.push(newUrl, undefined, { shallow: true }); router.push(newUrl, undefined);
history.replaceState({}, "", newUrl); // history.replaceState({}, "", newUrl);
} }
}, [transcript.response?.status]); }, [transcript.response?.status]);
@@ -60,11 +53,20 @@ export default function TranscriptDetails(details: TranscriptDetails) {
.replace(/ +/g, " ") .replace(/ +/g, " ")
.trim() || ""; .trim() || "";
if (transcript.error || topics?.error) {
return (
<Modal
title="Transcription Not Found"
text="A trascription with this ID does not exist."
/>
);
}
if (transcript?.loading || topics?.loading) {
return <Modal title="Loading" text={"Loading transcript..."} />;
}
return ( return (
<>
{transcript?.loading || topics?.loading ? (
<Modal title="Loading" text={"Loading transcript..."} />
) : (
<> <>
<div className="flex flex-col"> <div className="flex flex-col">
{transcript?.response?.title && ( {transcript?.response?.title && (
@@ -110,8 +112,8 @@ export default function TranscriptDetails(details: TranscriptDetails) {
<p>Loading Transcript</p> <p>Loading Transcript</p>
) : ( ) : (
<p> <p>
There was an error generating the final summary, please There was an error generating the final summary, please come
come back later back later
</p> </p>
)} )}
</div> </div>
@@ -138,7 +140,5 @@ export default function TranscriptDetails(details: TranscriptDetails) {
</div> </div>
</div> </div>
</> </>
)}
</>
); );
} }

View File

@@ -16,26 +16,30 @@ const useMp3 = (id: string, waiting?: boolean): Mp3Response => {
const api = getApi(true); const api = getApi(true);
const { api_url } = useContext(DomainContext); const { api_url } = useContext(DomainContext);
const accessTokenInfo = useFiefAccessTokenInfo(); const accessTokenInfo = useFiefAccessTokenInfo();
const [serviceWorkerReady, setServiceWorkerReady] = useState(false); const [serviceWorker, setServiceWorker] =
useState<ServiceWorkerRegistration | null>(null);
useEffect(() => { useEffect(() => {
if ("serviceWorker" in navigator) { if ("serviceWorker" in navigator) {
navigator.serviceWorker.register("/service-worker.js").then(() => { navigator.serviceWorker.register("/service-worker.js").then((worker) => {
setServiceWorkerReady(true); setServiceWorker(worker);
}); });
} }
return () => {
serviceWorker?.unregister();
};
}, []); }, []);
useEffect(() => { useEffect(() => {
if (!navigator.serviceWorker) return; if (!navigator.serviceWorker) return;
if (!navigator.serviceWorker.controller) return; if (!navigator.serviceWorker.controller) return;
if (!serviceWorkerReady) return; if (!serviceWorker) return;
// Send the token to the service worker // Send the token to the service worker
navigator.serviceWorker.controller.postMessage({ navigator.serviceWorker.controller.postMessage({
type: "SET_AUTH_TOKEN", type: "SET_AUTH_TOKEN",
token: accessTokenInfo?.access_token, token: accessTokenInfo?.access_token,
}); });
}, [navigator.serviceWorker, serviceWorkerReady, accessTokenInfo]); }, [navigator.serviceWorker, !serviceWorker, accessTokenInfo]);
useEffect(() => { useEffect(() => {
if (!id || !api || later) return; if (!id || !api || later) return;

View File

@@ -1,8 +1,5 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { import { V1TranscriptGetAudioWaveformRequest } from "../../api/apis/DefaultApi";
DefaultApi,
V1TranscriptGetAudioWaveformRequest,
} from "../../api/apis/DefaultApi";
import { AudioWaveform } from "../../api"; import { AudioWaveform } from "../../api";
import { useError } from "../../(errors)/errorContext"; import { useError } from "../../(errors)/errorContext";
import getApi from "../../lib/getApi"; import getApi from "../../lib/getApi";

View File

@@ -402,6 +402,7 @@ export const useWebSockets = (transcriptId: string | null): UseWebSockets => {
console.debug("WebSocket connection closed"); console.debug("WebSocket connection closed");
switch (event.code) { switch (event.code) {
case 1000: // Normal Closure: case 1000: // Normal Closure:
case 1005: // Closure by client FF
default: default:
setError( setError(
new Error(`WebSocket closed unexpectedly with code: ${event.code}`), new Error(`WebSocket closed unexpectedly with code: ${event.code}`),

View File

@@ -3,9 +3,9 @@ import { isDevelopment } from "./utils";
const localConfig = { const localConfig = {
features: { features: {
requireLogin: false, requireLogin: true,
privacy: true, privacy: true,
browse: false, browse: true,
}, },
api_url: "http://127.0.0.1:1250", api_url: "http://127.0.0.1:1250",
websocket_url: "ws://127.0.0.1:1250", websocket_url: "ws://127.0.0.1:1250",

View File

@@ -1,5 +1,8 @@
function shouldShowError(error: Error | null | undefined) { function shouldShowError(error: Error | null | undefined) {
if (error?.name == "ResponseError" && error["response"].status == 404) if (
error?.name == "ResponseError" &&
(error["response"].status == 404 || error["response"].status == 403)
)
return false; return false;
if (error?.name == "FetchError") return false; if (error?.name == "FetchError") return false;
return true; return true;

View File

@@ -67,7 +67,7 @@ export const getFiefAuthMiddleware = async (url) => {
parameters: {}, parameters: {},
}, },
{ {
matcher: "/transcripts/((?!new).*)", matcher: "/transcripts/((?!new))",
parameters: {}, parameters: {},
}, },
{ {