www: fix loading of past transcript before the user is authenticated

www/app/transcripts/[transcriptId]/page.tsx

@@ -13,6 +13,8 @@ import FinalSummary from "../finalSummary";
 import ShareLink from "../shareLink";
 import QRCode from "react-qr-code";
 import TranscriptTitle from "../transcriptTitle";
+import { featRequireLogin } from "../../../app/lib/utils";
+import { useFiefIsAuthenticated } from "@fief/fief/nextjs/react";
 
 type TranscriptDetails = {
   params: {
@@ -21,13 +23,20 @@ type TranscriptDetails = {
 };
 
 export default function TranscriptDetails(details: TranscriptDetails) {
+  const isAuthenticated = useFiefIsAuthenticated();
   const api = getApi();
-  const transcript = useTranscript(details.params.transcriptId);
-  const topics = useTopics(api, details.params.transcriptId);
-  const waveform = useWaveform(api, details.params.transcriptId);
+  const [transcriptId, setTranscriptId] = useState<string>("");
+  const transcript = useTranscript(api, transcriptId);
+  const topics = useTopics(api, transcriptId);
+  const waveform = useWaveform(api, transcriptId);
   const useActiveTopic = useState<Topic | null>(null);
 
-  if (transcript?.error || topics?.error || waveform?.error) {
+  useEffect(() => {
+    if (featRequireLogin() && !isAuthenticated) return;
+    setTranscriptId(details.params.transcriptId);
+  }, [api]);
+
+  if (transcript?.error /** || topics?.error || waveform?.error **/) {
     return (
       <Modal
         title="Transcription Not Found"
@@ -45,9 +54,7 @@ export default function TranscriptDetails(details: TranscriptDetails) {
 
   return (
     <>
-      {transcript?.loading === true ||
-      waveform?.loading == true ||
-      topics?.loading == true ? (
+      {transcript?.loading === true || topics?.loading == true ? (
         <Modal title="Loading" text={"Loading transcript..."} />
       ) : (
         <>
@@ -55,6 +62,7 @@ export default function TranscriptDetails(details: TranscriptDetails) {
             {transcript?.response?.title && (
               <TranscriptTitle title={transcript.response.title} />
             )}
+            {waveform?.loading == true && (
               <Recorder
                 topics={topics?.topics || []}
                 useActiveTopic={useActiveTopic}
@@ -62,6 +70,7 @@ export default function TranscriptDetails(details: TranscriptDetails) {
                 isPastMeeting={true}
                 transcriptId={transcript?.response?.id}
               />
+            )}
           </div>
           <div className="grid grid-cols-1 lg:grid-cols-2 grid-rows-2 lg:grid-rows-1 gap-2 lg:gap-4 h-full">
             <TopicList

www/app/transcripts/[transcriptId]/record/page.tsx

@@ -36,8 +36,8 @@ const TranscriptRecord = (details: TranscriptDetails) => {
     }
   }, []);
 
-  const transcript = useTranscript(details.params.transcriptId);
   const api = getApi();
+  const transcript = useTranscript(api, details.params.transcriptId);
   const webRTC = useWebRTC(stream, details.params.transcriptId, api);
   const webSockets = useWebSockets(details.params.transcriptId);
 

www/app/transcripts/useTopics.ts

@@ -13,15 +13,14 @@ type TranscriptTopics = {
   error: Error | null;
 };
 
-const useTranscript = (api: DefaultApi, id: string): TranscriptTopics => {
+const useTopics = (api: DefaultApi, id: string): TranscriptTopics => {
   const [topics, setTopics] = useState<Topic[] | null>(null);
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setErrorState] = useState<Error | null>(null);
   const { setError } = useError();
 
   const getTopics = (id: string) => {
-    if (!id)
-      throw new Error("Transcript ID is required to get transcript topics");
+    if (!id) return;
 
     setLoading(true);
     const requestParameters: V1TranscriptGetTopicsRequest = {
@@ -47,4 +46,4 @@ const useTranscript = (api: DefaultApi, id: string): TranscriptTopics => {
   return { topics, loading, error };
 };
 
-export default useTranscript;
+export default useTopics;

www/app/transcripts/useTranscript.ts

@@ -1,11 +1,7 @@
 import { useEffect, useState } from "react";
-import {
-  V1TranscriptGetRequest,
-  V1TranscriptsCreateRequest,
-} from "../api/apis/DefaultApi";
+import { DefaultApi, V1TranscriptGetRequest } from "../api/apis/DefaultApi";
 import { GetTranscript } from "../api";
 import { useError } from "../(errors)/errorContext";
-import getApi from "../lib/getApi";
 
 type Transcript = {
   response: GetTranscript | null;
@@ -13,15 +9,14 @@ type Transcript = {
   error: Error | null;
 };
 
-const useTranscript = (id: string | null): Transcript => {
+const useTranscript = (api: DefaultApi, id: string | null): Transcript => {
   const [response, setResponse] = useState<GetTranscript | null>(null);
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setErrorState] = useState<Error | null>(null);
   const { setError } = useError();
-  const api = getApi();
 
   const getTranscript = (id: string | null) => {
-    if (!id) throw new Error("Transcript ID is required to get transcript");
+    if (!id) return;
 
     setLoading(true);
     const requestParameters: V1TranscriptGetRequest = {

www/app/transcripts/useWaveform.ts

@@ -19,8 +19,7 @@ const useWaveform = (api: DefaultApi, id: string): AudioWaveFormResponse => {
   const { setError } = useError();
 
   const getWaveform = (id: string) => {
-    if (!id)
-      throw new Error("Transcript ID is required to get transcript waveform");
+    if (!id) return;
 
     setLoading(true);
     const requestParameters: V1TranscriptGetAudioWaveformRequest = {