feat: update members fetching to handle endpoint pagination update

composables/api.ts

@@ -1,4 +1,4 @@
-import type { ChannelResponse, GuildMemberResponse, GuildResponse, MessageResponse, StatsResponse, UserResponse } from "~/types/interfaces";
+import type { ChannelResponse, GuildMemberResponse, GuildMembersResponse, GuildResponse, MessageResponse, StatsResponse, UserResponse } from "~/types/interfaces";
 
 function ensureIsArray(list: any) {
 	if (Array.isArray(list)) {
@@ -33,8 +33,15 @@ export const useApi = () => {
 		return await fetchWithApi(`/channels/${channelId}`)
 	}
 
-	async function fetchMembers(guildId: string): Promise<GuildMemberResponse[]> {
-		return ensureIsArray(await fetchWithApi(`/guilds/${guildId}/members`));
+	async function fetchMembers(guildId: string, options?: { per_page?: number, page?: number }): Promise<GuildMembersResponse> {
+		const query = new URLSearchParams();
+		query.set("page", options?.page ? options.page.toString() : "1");
+		if (options?.per_page) {
+			query.set("per_page", options.per_page.toString());
+		}
+
+		console.log("members query:", query);
+		return await fetchWithApi(`/guilds/${guildId}/members?${query.toString()}`) as GuildMembersResponse;
 	}
 
 	async function fetchMember(guildId: string, memberId: string): Promise<GuildMemberResponse | undefined> {

pages/servers/[serverId]/channels/[channelId].vue

@@ -77,7 +77,10 @@ onActivated(async () => {
 });
 
 async function setArrayVariables() {
+	const membersRes = await fetchMembers(route.params.serverId as string);
+	members.value = membersRes.objects;
 	members.value = await fetchMembers(route.params.serverId as string);
+	console.log("Placeholder count:", totalMemberCount.value);
 	const guildUrl = `guilds/${route.params.serverId}`;
 	channels.value = await fetchWithApi(`${guildUrl}/channels`);
 	console.log("channels:", channels.value);

types/interfaces.ts

@@ -31,6 +31,13 @@ export interface GuildMemberResponse {
 	user: UserResponse
 }
 
+export interface GuildMembersResponse {
+	objects: GuildMemberResponse[],
+	amount: number,
+	pages: number,
+	page: number
+}
+
 export interface ChannelResponse {
 	uuid: string,
 	guild_uuid: string,