various improvements

This commit is contained in:
Zoe
2023-04-20 21:19:22 -05:00
parent b6d3b045aa
commit 3ea8167569
60 changed files with 12369 additions and 7625 deletions

109
pages/channel/[id].vue Normal file → Executable file
View File

@@ -1,83 +1,84 @@
<!-- eslint-disable vue/no-multiple-template-root -->
<template>
<MessagePane />
<div class="fixed mr-3"
:style="`top: ${emojiPickerData.top}px; right: ${emojiPickerData.right}px`">
<Transition>
<EmojiPicker v-on:pickedEmoji="pickedEmoji($event)"
:opened="emojiPickerData.opened" />
</Transition>
</div>
<MessagePane />
<div
class="fixed mr-3"
:style="`top: ${emojiPickerData.top}px; right: ${emojiPickerData.right}px`"
>
<Transition>
<Popup
:opened="emojiPickerData.opened"
:openedBy="emojiPickerData.type"
@pickedEmoji="pickedEmoji($event)"
/>
</Transition>
</div>
</template>
<script lang="ts">
import { Server } from 'socket.io';
import { useGlobalStore } from '~/stores/store'
import { IChannel } from '~/types'
import { useGlobalStore } from '~/stores/store';
import { IChannel, IServer } from '~/types';
definePageMeta({
middleware: 'auth'
})
});
export default {
async setup() {
const route = useRoute();
const headers = useRequestHeaders(['cookie']) as Record<string, string>;
const server: IChannel = await $fetch(`/api/channels/${route.params.id}`, { headers });
// if (!useGlobalStore().servers.find((e) => e.id == server.serverId)?.participants) {
const realServer: IServer = await $fetch(`/api/guilds/${server.serverId}`, { headers });
if (!realServer) throw new Error('realServer not found, this means that the channel is serverless but not a dm????');
useGlobalStore().addServer(realServer);
// }
if (typeof route.params.id !== 'string') throw new Error('route.params.id must be a string, but got an array presumably?');
useGlobalStore().setActiveServer('servers', route.params.id);
useGlobalStore().setActiveChannel(server);
useGlobalStore().closeEmojiPicker();
server.messages?.forEach((e) => {
e.body = parseMessageBody(e.body, useGlobalStore().activeChannel);
});
return {
server,
};
},
data() {
return {
socket: storeToRefs(useGlobalStore()).socket as unknown as Server,
emojiPickerData: storeToRefs(useGlobalStore()).emojiPickerData,
emojiPickerStyles: {
top: storeToRefs(useGlobalStore()).emojiPickerData.top + 'px',
right: storeToRefs(useGlobalStore()).emojiPickerData.right + 'px',
top: storeToRefs(useGlobalStore()).emojiPickerData.value.top + 'px',
right: storeToRefs(useGlobalStore()).emojiPickerData.value.right + 'px',
}
}
};
},
mounted() {
this.socket.on(`addChannel-${this.server.serverId}`, (ev) => {
const newChannel = ev as IChannel
useGlobalStore().addChannel(this.server.serverId, newChannel)
})
const newChannel = ev as IChannel;
useGlobalStore().addChannel(this.server.serverId, newChannel);
});
},
async updated() {
const route = useRoute()
const headers = useRequestHeaders(['cookie']) as Record<string, string>;
if (!this.server) return;
this.server = await $fetch(`/api/channels/${route.params.id}`, { headers });
if (typeof route.params.id !== 'string') throw new Error('route.params.id must be a string, but got an array presumiably?')
const route = useRoute();
if (typeof route.params.id !== 'string') throw new Error('route.params.id must be a string, but got an array presumiably?');
if (useGlobalStore().activeChannel.id !== this.server.id) {
useGlobalStore().closeEmojiPicker()
useGlobalStore().setActiveServer('servers', route.params.id)
// update the server with the refreshed data
useGlobalStore().updateServer(route.params.id, this.server.server)
}
},
async setup() {
const route = useRoute()
const headers = useRequestHeaders(['cookie']) as Record<string, string>
const server: IChannel = await $fetch(`/api/channels/${route.params.id}`, { headers })
const realServer = useGlobalStore().servers?.find((e) => e.channels.some((el) => el.id == route.params.id))
if (!realServer) throw new Error('realServer not found, this means that the channel is serverless but not a dm????');
useGlobalStore().addServer(realServer);
if (typeof route.params.id !== 'string') throw new Error('route.params.id must be a string, but got an array presumiably?')
useGlobalStore().setActiveServer('servers', route.params.id)
useGlobalStore().setActiveChannel(server)
useGlobalStore().closeEmojiPicker()
server.messages?.forEach((e) => {
e.body = parseMessageBody(e.body, useGlobalStore().activeChannel)
})
return {
server,
useGlobalStore().closeEmojiPicker();
useGlobalStore().setActiveServer('servers', route.params.id);
}
},
methods: {
pickedEmoji(emoji: string) {
const { $emit } = useNuxtApp()
$emit('pickedEmoji', emoji)
useGlobalStore().closeEmojiPicker()
const { $emit } = useNuxtApp();
$emit('pickedEmoji', emoji);
useGlobalStore().closeEmojiPicker();
},
}
}
};
</script>