chore: checks fixed in pictique.

Author: Sahil2004

platforms/pictique/src/lib/stores/users.ts

@@ -1,44 +1,49 @@
-import { writable } from 'svelte/store';
-import { apiClient } from '$lib/utils/axios';
+import { apiClient } from "$lib/utils/axios";
+import { writable } from "svelte/store";
 
 export interface User {
-	id: string;
-	handle: string;
-	name: string;
-	description: string;
-	avatarUrl: string;
-	isVerified: boolean;
+    id: string;
+    ename: string;
+    handle: string;
+    name: string;
+    description: string;
+    avatarUrl: string;
+    isVerified: boolean;
 }
 
 export const searchResults = writable<User[]>([]);
 export const isSearching = writable(false);
 export const searchError = writable<string | null>(null);
 
 export const searchUsers = async (query: string) => {
-	if (!query.trim()) {
-		searchResults.set([]);
-		return;
-	}
+    if (!query.trim()) {
+        searchResults.set([]);
+        return;
+    }
 
-	try {
-		isSearching.set(true);
-		searchError.set(null);
-		const response = await apiClient.get(`/api/users/search?q=${encodeURIComponent(query)}`);
-		searchResults.set(response.data);
-	} catch (err) {
-		searchError.set(err instanceof Error ? err.message : 'Failed to search users');
-		searchResults.set([]);
-	} finally {
-		isSearching.set(false);
-	}
+    try {
+        isSearching.set(true);
+        searchError.set(null);
+        const response = await apiClient.get(
+            `/api/users/search?q=${encodeURIComponent(query)}`,
+        );
+        searchResults.set(response.data);
+    } catch (err) {
+        searchError.set(
+            err instanceof Error ? err.message : "Failed to search users",
+        );
+        searchResults.set([]);
+    } finally {
+        isSearching.set(false);
+    }
 };
 
 export const followUser = async (followingId: string) => {
-	try {
-		await apiClient.post('/api/users/follow', { followingId });
-		return true;
-	} catch (err) {
-		console.error('Failed to follow user:', err);
-		return false;
-	}
+    try {
+        await apiClient.post("/api/users/follow", { followingId });
+        return true;
+    } catch (err) {
+        console.error("Failed to follow user:", err);
+        return false;
+    }
 };

platforms/pictique/src/lib/types.ts

@@ -79,3 +79,38 @@ export type GroupInfo = {
     name: string;
     avatar: string;
 };
+
+export type MessageInfo = {
+    avatar: string;
+    id: string;
+    text: string;
+    unread: boolean;
+    username: string;
+};
+
+export type Participant = {
+    avatarUrl: string;
+    handle: string;
+    id: string;
+    name: string;
+    ename: string;
+};
+
+export type ChatInfo = {
+    id: string;
+    name: string;
+    updatedAt: string;
+    participants: Participant[];
+    latestMessage?: {
+        isRead: boolean;
+        text: string;
+    };
+};
+
+export type Member = {
+    id: string;
+    name?: string;
+    handle?: string;
+    ename?: string;
+    avatarUrl?: string;
+};

platforms/pictique/src/routes/(protected)/group/[id]/+page.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
-	import { onMount } from 'svelte';
-	import { ChatMessage, MessageInput } from '$lib/fragments';
-	import { Avatar, Button, Input, Label } from '$lib/ui';
 	import { goto } from '$app/navigation';
 	import { page } from '$app/state';
+	import { ChatMessage, MessageInput } from '$lib/fragments';
 	import Settings from '$lib/icons/Settings.svelte';
+	import { Avatar, Button, Input, Label } from '$lib/ui';
 	import { clickOutside } from '$lib/utils';
 	import { Pen01FreeIcons } from '@hugeicons/core-free-icons';
 	import { HugeiconsIcon } from '@hugeicons/svelte';
+	import { onMount } from 'svelte';
 
 	let messagesContainer: HTMLDivElement;
 	let messageValue = $state('');
@@ -63,8 +63,8 @@
 		setTimeout(scrollToBottom, 0);
 	});
 
-	function handleSend() {
-		if (!messageValue.trim()) return;
+	function handleSend(): Promise<void> {
+		if (!messageValue.trim()) return Promise.resolve();
 		messages = [
 			...messages,
 			{
@@ -77,6 +77,7 @@
 		];
 		messageValue = '';
 		setTimeout(scrollToBottom, 0);
+		return Promise.resolve();
 	}
 
 	let openEditDialog = $state(false);
@@ -152,7 +153,7 @@
 	</div>
 
 	<MessageInput
-		class="sticky start-0 bottom-[-15px] w-full"
+		class="sticky bottom-[-15px] start-0 w-full"
 		variant="dm"
 		src={group.avatar}
 		bind:value={messageValue}
@@ -188,7 +189,7 @@
 				/>
 				<label
 					for="group-avatar-input"
-					class="bg-brand-burnt-orange border-brand-burnt-orange absolute right-0 bottom-0 cursor-pointer rounded-full border p-1 shadow"
+					class="bg-brand-burnt-orange border-brand-burnt-orange absolute bottom-0 right-0 cursor-pointer rounded-full border p-1 shadow"
 				>
 					<HugeiconsIcon icon={Pen01FreeIcons} color="white" />
 				</label>
@@ -212,7 +213,7 @@
 					rows="2"
 					maxlength="260"
 					placeholder="Edit group description"
-					class="bg-grey text-black-800 font-geist placeholder:text-black-600 invalid:border-red invalid:text-red focus:invalid:text-black-800 w-full rounded-4xl border border-transparent px-6 py-3.5 text-[15px] font-normal outline-0 focus:invalid:border-transparent"
+					class="bg-grey text-black-800 font-geist placeholder:text-black-600 invalid:border-red invalid:text-red focus:invalid:text-black-800 rounded-4xl w-full border border-transparent px-6 py-3.5 text-[15px] font-normal outline-0 focus:invalid:border-transparent"
 					bind:value={groupDescription}
 				/>
 			{:else}

platforms/pictique/src/routes/(protected)/messages/+page.svelte

@@ -1,28 +1,27 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { onMount } from 'svelte';
 	import { Message } from '$lib/fragments';
 	import Group from '$lib/fragments/Group/Group.svelte';
-	import { Button, Avatar, Input } from '$lib/ui';
+	import { isSearching, searchError, searchResults, searchUsers } from '$lib/stores/users';
+	import type { ChatInfo, GroupInfo, Member, MessageInfo, userProfile } from '$lib/types';
+	import { Avatar, Button, Input } from '$lib/ui';
 	import { clickOutside } from '$lib/utils';
-	import { heading } from '../../store';
 	import { apiClient } from '$lib/utils/axios';
+	import { onMount } from 'svelte';
+	import { heading } from '../../store';
 
-	import { searchUsers, searchResults, isSearching, searchError } from '$lib/stores/users';
-	import type { GroupInfo } from '$lib/types';
-
-	let messages = $state([]);
-	let groups: GroupInfo[] = $state([]);
-	let allMembers = $state([]);
+	let messages = $state<MessageInfo[]>([]);
+	let groups = $state<GroupInfo[]>([]);
+	let allMembers = $state<Member[]>([]);
 	let selectedMembers = $state<string[]>([]);
 	let currentUserId = '';
 	let openNewChatModal = $state(false);
 	let searchValue = $state('');
 	let debounceTimer: NodeJS.Timeout;
 
 	async function loadMessages() {
-		const { data } = await apiClient.get('/api/chats');
-		const { data: userData } = await apiClient.get('/api/users');
+		const { data } = await apiClient.get<{ chats: ChatInfo[] }>('/api/chats');
+		const { data: userData } = await apiClient.get<userProfile>('/api/users');
 		currentUserId = userData.id;
 
 		messages = data.chats.map((c) => {
@@ -67,7 +66,7 @@
 
 		try {
 			if (selectedMembers.length === 1) {
-				await apiClient.post(`/api/chats/`, {
+				await apiClient.post('/api/chats/', {
 					name: allMembers.find((m) => m.id === selectedMembers[0])?.name ?? 'New Chat',
 					participantIds: [selectedMembers[0]]
 				});
@@ -125,7 +124,7 @@
 	{/if}
 
 	{#if groups.length > 0}
-		<h3 class="text-md mt-6 mb-2 font-semibold text-gray-700">Groups</h3>
+		<h3 class="text-md mb-2 mt-6 font-semibold text-gray-700">Groups</h3>
 		{#each groups as group}
 			<Group
 				name={group.name || 'New Group'}