refac

src/lib/apis/channels/index.ts

@@ -71,6 +71,38 @@ export const getChannels = async (token: string = '') => {
 };
 
 
+export const getChannelById = async (token: string = '', channel_id: string) => {
+	let error = null;
+
+	const res = await fetch(`${WEBUI_API_BASE_URL}/channels/${channel_id}`, {
+		method: 'GET',
+		headers: {
+			Accept: 'application/json',
+			'Content-Type': 'application/json',
+			authorization: `Bearer ${token}`
+		}
+	})
+		.then(async (res) => {
+			if (!res.ok) throw await res.json();
+			return res.json();
+		})
+		.then((json) => {
+			return json;
+		})
+		.catch((err) => {
+			error = err.detail;
+			console.log(err);
+			return null;
+		});
+
+	if (error) {
+		throw error;
+	}
+
+	return res;
+}
+
+
 export const getChannelMessages = async (token: string = '', channel_id: string, page: number = 1) => {
 	let error = null;
 

src/lib/components/channel/Channel.svelte

@@ -1,11 +1,14 @@
 <script lang="ts">
-	import { getChannelMessages, sendMessage } from '$lib/apis/channels';
 	import { toast } from 'svelte-sonner';
-	import MessageInput from './MessageInput.svelte';
-	import Messages from './Messages.svelte';
-	import { socket } from '$lib/stores';
 	import { onDestroy, onMount, tick } from 'svelte';
 
+	import { socket } from '$lib/stores';
+	import { getChannelById, getChannelMessages, sendMessage } from '$lib/apis/channels';
+
+	import Messages from './Messages.svelte';
+	import MessageInput from './MessageInput.svelte';
+	import { goto } from '$app/navigation';
+
 	export let id = '';
 
 	let scrollEnd = true;
@@ -14,6 +17,7 @@
 	let top = false;
 	let page = 1;
 
+	let channel = null;
 	let messages = null;
 
 	$: if (id) {
@@ -28,15 +32,24 @@
 		top = false;
 		page = 1;
 		messages = null;
+		channel = null;
 
-		messages = await getChannelMessages(localStorage.token, id, page);
+		channel = await getChannelById(localStorage.token, id).catch((error) => {
+			return null;
+		});
 
-		if (messages) {
-			messagesContainerElement.scrollTop = messagesContainerElement.scrollHeight;
+		if (channel) {
+			messages = await getChannelMessages(localStorage.token, id, page);
 
-			if (messages.length < 50) {
-				top = true;
+			if (messages) {
+				messagesContainerElement.scrollTop = messagesContainerElement.scrollHeight;
+
+				if (messages.length < 50) {
+					top = true;
+				}
 			}
+		} else {
+			goto('/');
 		}
 	};
 
@@ -93,6 +106,7 @@
 	>
 		{#key id}
 			<Messages
+				{channel}
 				{messages}
 				{top}
 				onLoad={async () => {