From 1c48a712f11c1f04a3e6ab023dab4e163e172f23 Mon Sep 17 00:00:00 2001
From: Chukwuma Nwaugha <nwaughac@gmail.com>
Date: Mon, 11 Nov 2024 16:38:26 +0000
Subject: [PATCH] cleanup

---
 .../lib/components/CheckFinalResponse.svelte  | 21 ++++++++++++-------
 .../lib/components/RenderAudioSource.svelte   | 18 +++++++---------
 .../chat/[sessionId=sessionId]/+page.svelte   |  7 ++-----
 3 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/app/src/lib/components/CheckFinalResponse.svelte b/app/src/lib/components/CheckFinalResponse.svelte
index d565f48..2290bf2 100644
--- a/app/src/lib/components/CheckFinalResponse.svelte
+++ b/app/src/lib/components/CheckFinalResponse.svelte
@@ -8,6 +8,7 @@
 	import { createEventDispatcher } from 'svelte';
 	import { Button } from './ui/button';
 	import { getSessionContext } from '@/stores/sessionContext.svelte';
+	import RenderAudioSource from '@/components/RenderAudioSource.svelte';
 
 	export let content: string;
 
@@ -17,7 +18,7 @@
 		generate: { summary: string };
 	}>();
 
-	const { sessionId$, sessionCompleted$ } = getSessionContext();
+	const { sessionId$, sessionCompleted$, audioSource$ } = getSessionContext();
 
 	function getSummary() {
 		const replacePrefixRegex = new RegExp(FINAL_RESPONSE_PREFIX, 'gi');
@@ -42,13 +43,17 @@
 			on:click={() => dispatch('generate', { summary: getSummary() })}>Generate Audiocast</Button
 		>
 
-		<Button
-			variant="ghost"
-			class="bg-gray-800 hover:bg-gray-700 text-emerald-600 hover:text-emerald-600"
-			on:click={() => dispatch('reviewSource', { summary: getSummary() })}
-		>
-			Review Source
-		</Button>
+		{#if $audioSource$}
+			<RenderAudioSource audioSource={$audioSource$} />
+		{:else}
+			<Button
+				variant="ghost"
+				class="bg-gray-800 hover:bg-gray-700 text-emerald-600 hover:text-emerald-600"
+				on:click={() => dispatch('reviewSource', { summary: getSummary() })}
+			>
+				Review Source
+			</Button>
+		{/if}
 
 		<Button
 			variant="ghost"
diff --git a/app/src/lib/components/RenderAudioSource.svelte b/app/src/lib/components/RenderAudioSource.svelte
index 7be6c9f..caa3684 100644
--- a/app/src/lib/components/RenderAudioSource.svelte
+++ b/app/src/lib/components/RenderAudioSource.svelte
@@ -2,18 +2,17 @@
 	import * as Drawer from './ui/drawer';
 	import { Button } from './ui/button';
 	import { parse } from 'marked';
-	import { cn } from '@/utils/ui.utils';
 
 	export let audioSource: string;
 
-	let snapPoints = [0.4, 0.75, 0.9];
+	let snapPoints = [0.75, 0.9];
 	let activeSnapPoint = snapPoints[0];
 </script>
 
 <Drawer.Root {snapPoints} bind:activeSnapPoint direction="bottom" dismissible shouldScaleBackground>
 	<Drawer.Trigger>
-		<Button variant="ghost" class="bg-gray-800 hover:bg-gray-700 text-white px-16"
-			>Show AudioSource
+		<Button variant="ghost" class="bg-gray-800 hover:bg-gray-700 text-white"
+			>Manage Audiocast Sources
 		</Button>
 	</Drawer.Trigger>
 
@@ -23,13 +22,10 @@
 		<Drawer.Content class="border-neutral-800 pb-40 block h-full w-full rounded-t-md">
 			<Drawer.Title
 				class="text-2xl px-4 py-2 mx-auto md:max-w-3xl xl:max-w-4xl w-full gradient-gray-to-emerald font-medium"
-				>Audiocast Source</Drawer.Title
-			>
-			<div
-				class={cn('h-full overflow-hidden', {
-					'overflow-y-auto': activeSnapPoint > snapPoints[0]
-				})}
-			>
+				>Audiocast Source
+			</Drawer.Title>
+
+			<div class="h-full overflow-hidden overflow-y-auto">
 				<div
 					class="mx-auto relative w-full h-[calc(100%+120px)] max-w-full px-4 py-2 md:max-w-3xl xl:max-w-4xl"
 				>
diff --git a/app/src/routes/chat/[sessionId=sessionId]/+page.svelte b/app/src/routes/chat/[sessionId=sessionId]/+page.svelte
index 1066d92..0a24d9d 100644
--- a/app/src/routes/chat/[sessionId=sessionId]/+page.svelte
+++ b/app/src/routes/chat/[sessionId=sessionId]/+page.svelte
@@ -12,11 +12,10 @@
 	import { onMount } from 'svelte';
 	import { debounce } from 'throttle-debounce';
 	import Spinner from '@/components/Spinner.svelte';
-	import RenderAudioSource from '@/components/RenderAudioSource.svelte';
 
 	export let data;
 
-	const { session$, addChatItem, updateChatContent, sessionId$, fetchingSource$, audioSource$ } =
+	const { session$, addChatItem, updateChatContent, sessionId$, fetchingSource$ } =
 		getSessionContext();
 
 	let searchTerm = '';
@@ -102,9 +101,7 @@
 					{@const finalResponse = item.content.includes(FINAL_RESPONSE_SUFFIX)}
 					<ChatListItem type={item.role} content={item.content} loading={item.loading} />
 
-					{#if finalResponse && $audioSource$}
-						<RenderAudioSource audioSource={$audioSource$} />
-					{:else if finalResponse}
+					{#if finalResponse}
 						<ChatListActionItems {sessionId} let:ongenerate let:onreviewSource let:onstartNew>
 							{#if $fetchingSource$}
 								<Spinner />