load message in front

This commit is contained in:
grimhilt
2023-03-25 13:06:59 +01:00
parent cb5021750a
commit 097dd8bf21
12 changed files with 246 additions and 131 deletions

View File

@@ -0,0 +1,13 @@
export default class Room {
constructor(id, user, userId, roomName, mailboxId) {
this.id = id;
this.user = user;
this.userId = userId;
this.roomName = roomName;
this.mailboxId = mailboxId;
this.messages = [];
this.messagesFetched = false;
this.threads = [];
}
}

View File

@@ -1,42 +1,19 @@
import API from "@/services/imapAPI";
import { createStore } from "vuex";
import Room from "./models/Room";
const store = createStore({
state() {
return {
rooms: [
{
id: 0,
user: "clemnce",
userId: 0,
roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
mailboxId: 1,
},
{
id: 1,
user: "juliette",
roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
mailboxId: 1,
},
{
id: 2,
user: "jean",
roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
mailboxId: 2,
},
{
id: 3,
user: "luc",
roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
mailboxId: 2,
},
],
messages: [
new Room(1, "clemence", 0, "Est ex adipisicing non ipsum voluptate duis enim adipisicing labore.", 1),
new Room(2, "laurance", 0, "Est ex adipisicing non ipsum voluptate duis enim adipisicing labore.", 2),
new Room(3, "mathilde", 0, "Est ex adipisicing non ipsum voluptate duis enim adipisicing labore.", 1),
],
messages: [],
mailboxes: [],
activeMailbox: 0,
activeRoom: 0
activeRoom: 0,
};
},
mutations: {
@@ -48,16 +25,18 @@ const store = createStore({
const mailbox = state.mailboxes.find((mailbox) => mailbox.id == payload);
// todo fetched mailbox all
if (mailbox?.fetched == false) {
API.getRooms(payload).then((res) => {
// todo add if not exist
mailbox.fetched = true;
res.data.forEach((room) => {
room.fetched = false;
state.rooms.push(room);
API.getRooms(payload)
.then((res) => {
// todo add if not exist
console.log(res.data)
mailbox.fetched = true;
res.data.forEach((room) => {
state.rooms.push(new Room(room.id, room.user, room.userId, room.roomName, room.mailboxId));
});
})
.catch((err) => {
console.log(err);
});
}).catch((err) => {
console.log(err)
});
}
},
setActiveRoom(state, payload) {
@@ -66,24 +45,35 @@ const store = createStore({
// fetch messages for this room if not already fetched
const room = state.rooms.find((room) => room.id == payload);
if (!room || room?.fetched == false) {
console.log("add messages")
API.getMessages(payload).then((res) => {
// todo add if not exist
room.fetched = true;
res.data.forEach((msg) => {
state.messages.push(msg);
console.log("add messages");
API.getMessages(payload)
.then((res) => {
// todo add if not exist
room.fetched = true;
res.data.forEach((msg) => {
state.messages.push(msg);
});
})
.catch((err) => {
console.log(err);
});
}).catch((err) => {
console.log(err)
});
}
},
addMailboxes(state, payload) {
console.log(payload)
payload.forEach((mailbox) => {
mailbox.fetched = false;
state.mailboxes.push(mailbox);
});
},
addMessages(state, payload) {
const room = state.rooms.find((room) => room.id == payload.roomId);
payload.messages.forEach((message) => {
room.messages.push(message);
});
room.messagesFetched = true;
console.log(room.messages)
},
},
getters: {
rooms: (state) => () => {
@@ -91,16 +81,16 @@ const store = createStore({
return state.rooms.filter((room) => room.mailboxId == state.activeMailbox);
},
messages: (state) => (roomId) => {
const room = state.rooms.find((room) => room.id === roomId);
if (room?.fetched === false) {
console.log("ok")
const room = state.rooms.find((room) => room.id == roomId);
if (!room.messagesFetched) {
console.log("fetched Messages")
store.dispatch("fetchMessages", { roomId: room.id });
}
return [1, 2];
}
return room.messages;
},
},
actions: {
async fetchMailboxes(context) {
console.log("add mailboxes");
fetchMailboxes: async (context) => {
API.getMailboxes()
.then((res) => {
context.commit("addMailboxes", res.data);
@@ -109,8 +99,15 @@ const store = createStore({
console.log(err);
});
},
async fetchMessages(context) {
console.log(context)
fetchMessages: async (context, data) => {
API.getMessages(data.roomId)
.then((res) => {
console.log(res.data)
context.commit("addMessages", { messages: res.data, roomId: data.roomId });
})
.catch((err) => {
console.log(err);
});
},
},
});