feat: implement fetchMe

components/MessageArea.vue

@@ -44,9 +44,11 @@ import type { MessageResponse, ScrollPosition, UserResponse } from '~/types/inte
 import scrollToBottom from '~/utils/scrollToBottom';
 import { generateIrcColor } from '#imports';
 
+const { fetchMe } = useApi()
+
 const props = defineProps<{ channelUrl: string, amount?: number, offset?: number }>();
 
-const me = await fetchWithApi("/me") as UserResponse;
+const me = await fetchMe() as UserResponse;
 
 const messageTimestamps = ref<Record<string, number>>({});
 const messagesType = ref<Record<string, "normal" | "grouped">>({});

composables/api.ts

@@ -21,6 +21,10 @@ export const useApi = () => {
 		return ensureIsArray(await fetchWithApi(`/me/guilds`));
 	}
 
+	async function fetchMe(): Promise<UserResponse | undefined> {
+		return await fetchWithApi("/me")
+	}
+
 	async function fetchChannels(guildId: string): Promise<ChannelResponse[]> {
 		return ensureIsArray(await fetchWithApi(`/guilds/${guildId}/channels`));
 	}
@@ -98,6 +102,7 @@ export const useApi = () => {
 		fetchGuilds,
 		fetchGuild,
 		fetchMyGuilds,
+		fetchMe,
 		fetchChannels,
 		fetchChannel,
 		fetchMembers,

utils/editMessage.ts

@@ -1,9 +1,12 @@
 import type { MessageProps } from "~/types/props";
 
+const { fetchMe } = useApi()
+
 export default async (element: HTMLDivElement, props: MessageProps) => {
 	console.log("message:", element);
-	const me = await fetchWithApi("/me") as any;
-	if (props.author?.uuid == me.uuid) {
+	const me = await fetchMe();
+
+	if (me && props.author?.uuid == me.uuid) {
 		const text = element.getElementsByClassName("message-text")[0] as HTMLDivElement;
 		text.contentEditable = "true";
 		text.focus();