Show messages, which are already there

src/backend/backend.js

@@ -28,6 +28,8 @@ import { incomingMessagesUpdated } from "../features/incomingMessages/incomingMe
 
 import { outgoingMessagesUpdated } from "../features/outgoingMessages/outgoingMessagesSlice";
 
+import { mapRestMessage } from "../utils/mapRestMessage";
+
 /* --------------------------- CONSTANTS -------------------------------- */
 
 const API_BASE = "https://alexerdei-team.us.ainiro.io/magic/modules/fakebook";
@@ -157,6 +159,12 @@ async function bootstrapSession(user_id) {
 	subscribePosts();
 
 	currentUserOnline();
+
+	/* inside bootstrapSession(), after openSocket() + currentUserOnline() */
+
+	subscribeMessages("incoming");
+
+	subscribeMessages("outgoing");
 }
 
 export function subscribeAuth() {
@@ -772,27 +780,65 @@ export async function updateProfile(patch) {
 
      merge in again; that’s harmless. */
 }
+/* =====================================================================
 
-/* ------------------------- messages ---------------------------------- */
 
-export function subscribeMessages(kind) {
+      MESSAGES – read-only bootstrap (Magic back-end)
-  const uid = DB.currentUser?.id;
 
-  const inc = kind === "incoming";
 
-  setTimeout(() => {
+   ===================================================================== */
-    const msgs = DB.messages.filter((m) =>
+
-      inc ? m.recipient === uid : m.sender === uid
+const MESSAGE_URL = `${API_BASE}/message`; // ← singular table name
-    );
+
+/* --------------------------------------------------------------
+
+   subscribeMessages(kind)
+
+
+   kind = "incoming" | "outgoing"
+
+   → issues ONE network call with server-side filter
+
+   -------------------------------------------------------------- */
+
+export function subscribeMessages(kind = "incoming") {
+	let cancelled = false;
+
+	(async () => {
+		try {
+			const uid = localStorage.getItem(LS_USER_ID);
+
+			if (!uid) return;
+
+			/* Magic filter param:  message.sender.eq=<uid>  etc. */
+
+			const filter =
+				kind === "incoming"
+					? `message.recipient.eq=${uid}`
+					: `message.sender.eq=${uid}`;
+
+			const url = `${MESSAGE_URL}?limit=-1&${filter}`;
+
+			const rows = await $fetch(url); // $fetch auto adds auth
+
+			if (!cancelled) {
+				const mapped = rows.map(mapRestMessage);
 
 				store.dispatch(
-      (inc ? incomingMessagesUpdated : outgoingMessagesUpdated)([...msgs])
+					(kind === "incoming"
+						? incomingMessagesUpdated
+						: outgoingMessagesUpdated)(mapped)
 				);
-  }, 0);
-
-  return () => {};
 			}
+		} catch (err) {
+			console.warn("[subscribeMessages] failed:", err.message);
+		}
+	})();
 
+	return () => {
+		cancelled = true;
+	};
+}
 export function uploadMessage(msg) {
 	DB.messages.push({ ...msg, id: genId(), timestamp: nowISO(), isRead: false });
 	persist();

src/utils/mapRestMessage.js

@@ -0,0 +1,35 @@
+/* --------------------------------------------------------------
+
+   mapRestMessage  – Magic → legacy Firebase shape
+
+   -------------------------------------------------------------- */
+
+export function mapRestMessage(row) {
+	/* Convert "2025-04-05 09:34:52" → JS ISO string the UI already
+  
+       parses with new Date() (or keep as Date object if you prefer) */
+
+	const iso = row.timestamp
+		? row.timestamp.replace(" ", "T") + "Z"
+		: new Date().toISOString();
+
+	return {
+		/* Firebase used the doc id as ‘id’; we’ll expose the PK */
+
+		id: row.message_id,
+
+		sender: row.sender,
+
+		recipient: row.recipient,
+
+		text: row.text,
+
+		photoURL: row.photoURL,
+
+		isPhoto: !!row.isPhoto,
+
+		isRead: !!row.isRead,
+
+		timestamp: iso,
+	};
+}