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

adds copy for topics and transcription

Browse Source
This commit is contained in:
Sara
2023-09-26 12:20:27 +02:00
parent bd070fb487
commit cd8cc2f5cd
2 changed files with 30 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
www/app/transcripts/new/page.tsx
View File

@@ -44,6 +44,12 @@ const TranscriptCreate = () => {
getAudioStream,
} = useAudioDevice();
const [hasRecorded, setHasRecorded] = useState(false);
const [transcriptStarted, setTranscriptStarted] = useState(false);
useEffect(() => {
if (!transcriptStarted && webSockets.transcriptText.length !== 0)
setTranscriptStarted(true);
}, [webSockets.transcriptText]);
return (
<>
@@ -69,15 +75,30 @@ const TranscriptCreate = () => {
useActiveTopic={useActiveTopic}
autoscroll={true}
/>
<section
className={`w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl px-2 md:px-4 flex flex-col justify-center align-center`}
className={`w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4`}
>
{!hasRecorded ? (
<div className="py-2 h-auto">
<LiveTrancription text={webSockets.transcriptText} />
</div>
<>
{transcriptStarted && (
<h2 className="md:text-lg font-bold">Transcription</h2>
)}
<div className="flex flex-col justify-center align center text-center h-full">
<div className="py-2 h-auto">
{!transcriptStarted ? (
<div className="text-center text-gray-500">
The conversation transcript will appear here after you
start recording.
</div>
) : (
<LiveTrancription text={webSockets.transcriptText} />
)}
</div>
</div>
</>
) : (
<div className="flex flex-col justify-center align center text-center">
<div className="flex flex-col justify-center align center text-center h-full text-gray-500">
<div className="p-2 md:p-4">
<FontAwesomeIcon
icon={faGear}

6
www/app/transcripts/topicList.tsx
View File

@@ -61,9 +61,11 @@ export function TopicList({
}, [activeTopic, autoscroll]);
return (
<section className="relative w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:p-4 flex flex-col justify-center align-center">
<section className="relative w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4 flex flex-col justify-center align-center">
{topics.length > 0 ? (
<>
<h2 className="md:text-lg font-bold mb-2">Topics</h2>
{autoscroll && (
<ScrollToBottom
visible={!autoscrollEnabled}
@@ -108,7 +110,7 @@ export function TopicList({
</div>
</>
) : (
<div className="text-center text-gray-500 p-4">
<div className="text-center text-gray-500">
Discussion topics will appear here after you start recording.
<br />
It may take up to 5 minutes of conversation for the first topic to