From 4ecd723cec3c782e70ea329d44c86eb352e3063e Mon Sep 17 00:00:00 2001 From: grimhilt Date: Mon, 8 May 2023 01:10:13 +0200 Subject: [PATCH] load message in page loading --- README.md | 33 +++++++++++++++++-------------- front/README.md | 24 ---------------------- front/src/store/store.ts | 21 ++++++++------------ front/src/views/room/RoomView.vue | 8 +++----- 4 files changed, 29 insertions(+), 57 deletions(-) delete mode 100644 front/README.md diff --git a/README.md b/README.md index 463685e..4f05692 100644 --- a/README.md +++ b/README.md @@ -1,28 +1,31 @@ # TRIFORM -*WORK IN PROGRESS* + +_WORK IN PROGRESS_ TRIFORM (Threaded Rooms Interface For Organised Relational Mails) is a mail client which sorts mails into conversations based on the members present in each mails. ## Features -- [x] Multi account -- [x] Live syncing of mails -- [x] Live syncing of flags -- [x] Mark as read/unread -- [ ] Attachments -- [ ] Send new mails -- [ ] Respond to mails -- [ ] Delete mails -- [ ] Live sync with the ui +- [x] Multi account (tested only with gmail) +- [x] Live syncing of mails +- [x] Live syncing of flags +- [x] Mark as read/unread +- [x] Flag important +- [ ] Attachments +- [ ] Send new mails +- [ ] Respond to mails +- [x] Delete mails +- [ ] Delete rooms +- [ ] Live sync with the ui ## Installation ## Definitions -- Room: General space where messages are grouped. -- Channel: Space use for newsletters or other conversations when there is a low need for reply. -- Group: Space contening several users that are part of the conversation. -- DM: Space defining a conversation with only one other member. -- Thread: Sub-Space generally created when changing the number of member in a space. +- Room: General space where messages are grouped. +- Channel: Space use for newsletters or other conversations when there is a low need for reply. +- Group: Space contening several users that are part of the conversation. +- DM: Space defining a conversation with only one other member. +- Thread: Sub-Space generally created when changing the number of member in a space. ## Examples diff --git a/front/README.md b/front/README.md deleted file mode 100644 index 3af539c..0000000 --- a/front/README.md +++ /dev/null @@ -1,24 +0,0 @@ -# mail - -## Project setup -``` -yarn install -``` - -### Compiles and hot-reloads for development -``` -yarn serve -``` - -### Compiles and minifies for production -``` -yarn build -``` - -### Lints and fixes files -``` -yarn lint -``` - -### Customize configuration -See [Configuration Reference](https://cli.vuejs.org/config/). diff --git a/front/src/store/store.ts b/front/src/store/store.ts index eb79e9c..be8733e 100644 --- a/front/src/store/store.ts +++ b/front/src/store/store.ts @@ -77,8 +77,6 @@ function updateSeen(state: State, roomId: number, flag: string[], adding: boolea } } } -// define injection key todo -// export const key: InjectionKey> = Symbol() const store = createStore({ state: { @@ -96,9 +94,6 @@ const store = createStore({ }, setActiveRoom(state, payload) { state.activeRoom = payload; - // todo load room on load page - const room = roomOnId(state, payload); - if (!room) return; let roomMessage = msgOnRoomId(state, payload); if (!roomMessage) { state.roomMessages.push({ messages: [], fetch: LoadingState.notLoaded, roomId: payload }); @@ -115,7 +110,6 @@ const store = createStore({ }); }, addRooms(state, payload) { - // todo add if not exist const buffer: RoomFromBack[] = []; payload.rooms.forEach((room: RoomFromBack) => { if (room.roomType == RoomType.THREAD) { @@ -134,7 +128,6 @@ const store = createStore({ }); }, removeRoom(state, payload) { - console.log(payload); const roomMessageIndex = state.roomMessages.findIndex((roomM) => roomM.roomId === payload.roomId); state.roomMessages.splice(roomMessageIndex, 1); const roomIndex = state.rooms.findIndex((room) => room.id === payload.roomId); @@ -147,21 +140,18 @@ const store = createStore({ parentRoom.threadIds = parentRoom?.threadIds.filter((id) => id !== roomToDelete.id); } } + // todo fix to many at the same time bug state.rooms.splice(roomIndex, 1); // state.activeRoom = state.rooms[0].id; // router.push(`/${state.activeRoom}`); }, addMessages(state, payload) { - // todo add if not exist - const room = roomOnId(state, payload.roomId); - if (!room) return; let roomMessage = msgOnRoomId(state, payload.roomId); if (!roomMessage) { state.roomMessages.push({ roomId: payload.roomId, messages: [], fetch: LoadingState.notLoaded }); roomMessage = msgOnRoomId(state, payload.roomId); } if (!roomMessage) return; - payload.messages.forEach((message: any) => { message.flags = message.flags?.split(",") ?? []; roomMessage?.messages.push(message); @@ -225,9 +215,14 @@ const store = createStore({ messages: (state) => (roomId: number): Message[] => { + if (!roomId) return []; const roomMessage = msgOnRoomId(state, roomId); - if (roomMessage) return roomMessage.messages; - state.roomMessages.push({ messages: [], roomId: roomId, fetch: LoadingState.notLoaded }); + if (roomMessage && roomMessage.fetch === LoadingState.loaded) return roomMessage.messages; + if (!roomMessage) { + state.roomMessages.push({ messages: [], roomId: roomId, fetch: LoadingState.notLoaded }); + } else if (roomMessage.fetch === LoadingState.loaded) { + return roomMessage.messages; + } store.dispatch("fetchMessages", { roomId: roomId, obj: msgOnRoomId(state, roomId) }); return msgOnRoomId(state, roomId)?.messages ?? []; }, diff --git a/front/src/views/room/RoomView.vue b/front/src/views/room/RoomView.vue index ec00d48..6e6cd82 100644 --- a/front/src/views/room/RoomView.vue +++ b/front/src/views/room/RoomView.vue @@ -17,10 +17,10 @@ const id = ref(parseInt(route.params.id)); let room = ref(); onBeforeMount(async () => { + console.log(id.value); store.commit("setActiveRoom", id.value); room.value = store.getters.room(id.value); - messages.value = store.getters.messages(room.value?.id); - console.log(room.value); + messages.value = store.getters.messages(id.value); }); onBeforeRouteUpdate(async (to, from) => { @@ -28,9 +28,7 @@ onBeforeRouteUpdate(async (to, from) => { id.value = parseInt(to.params.id); store.commit("setActiveRoom", id.value); room.value = await store.getters.room(id.value); - messages.value = store.getters.messages(room.value?.id); - - console.log(room.value); + messages.value = store.getters.messages(id.value); } });