merging

src/modules/auth.ts

@@ -1,71 +0,0 @@
-import { reactive, toRefs } from 'vue';
-import { useIpc } from './ipc';
-
-interface AuthState {
-    accessToken: string | null;
-    error?: Error;
-}
-
-const state = reactive<AuthState>({
-    accessToken: null,
-    error: undefined,
-});
-
-const AUTH_KEY = 'crimata_token';
-
-let token: string | null;
-
-token = window.localStorage.getItem(AUTH_KEY);
-if (token) {
-    state.accessToken = token;
-    window.localStorage.setItem(AUTH_KEY, token);
-}
-
-// Token authentication.
-const authToken = async () => {
-    console.log("Calling auth token!!")
-    const { invoke  } = useIpc();
-    try {
-        token = window.localStorage.getItem(AUTH_KEY);
-
-        if (!token) {
-            token = "no-token"
-        }
-
-        console.log(`Token ${token}`)
-        const res = await invoke('auth-session', token);
-        window.localStorage.setItem(AUTH_KEY, res);
-        state.accessToken = res;
-    }
-    catch(e) {
-        state.error = e;
-        console.log('ERROR: failed authentication');
-        window.localStorage.removeItem(AUTH_KEY);
-        state.accessToken = null;
-    }
-}
-
-// Gets called on socket open.
-window.ipcRenderer.on("auth", async (_event, _arg) => {
-    await authToken();
-});
-
-export const useAuth = () => {
-
-    const setToken = (token: string) => {
-        window.localStorage.setItem(AUTH_KEY, token);
-        state.accessToken = token;
-        state.error = undefined;
-    }
-
-    const logout = (): Promise<null> => {
-        window.localStorage.removeItem(AUTH_KEY);
-        return Promise.resolve(state.accessToken = null);
-    }
-
-    return {
-        setToken,
-        logout,
-        ...toRefs(state), // accessToken, error
-    }
-}

src/modules/ipc.ts

@@ -1,5 +1,6 @@
 
 export const useIpc = () => {
+    
     const invoke = async (endpoint: string, payload: any) => {
         try {
             const res = await window.ipcRenderer.invoke(endpoint, payload);
@@ -10,10 +11,7 @@ export const useIpc = () => {
     }
 
     const post = (endpoint: string, payload: any) => {
-        window.postMessage({
-            endpoint: endpoint,
-            content: payload
-        }, '*')
+        window.ipcRenderer.send(endpoint, payload);
     };
 
     return {

src/modules/message.ts

@@ -17,7 +17,9 @@ export const renderMessage = (text: boolean | string, audio: boolean | string, c
     modifier: modifier,
     time: getTimeStamp(),
     uid: uuidv4(),
-    isChild: "none"
+    isChild: "none",
+    seen: false,
+    newMessage: false
   }
 )
 

src/modules/messages.ts

@@ -14,7 +14,7 @@ const updateMessage = (annotation: Annotation) => {
   message.content.text = annotation.text
 }
 
-const loadMessages = () => {
+const loadSavedMessages = () => {
   const rawData = window.localStorage.getItem("crimata_messages");
   if (rawData) {
     const messageData = JSON.parse(rawData)
@@ -39,8 +39,8 @@ const updateGrouping = () => {
   const refs = Array.from(messages.value.keys())
 
   // Get the last three messages.
-  const first = messages.value.get(refs[refs.length - 1]) 
-  const second = messages.value.get(refs[refs.length - 2]) 
+  const first = messages.value.get(refs[refs.length - 1])
+  const second = messages.value.get(refs[refs.length - 2])
   const third = messages.value.get(refs[refs.length - 3])
 
   // If messages are simmilar, update the classes.
@@ -58,51 +58,68 @@ const updateGrouping = () => {
   }
 }
 
-const { setScroll, updateScrollRef, adjustScroll } = useScroll("messenger");
-
-loadMessages()
-setTimeout(setScroll, 1000);
-
 
 export default function useMessages() {
 
-    // Main function for updating the message view.
-    const updateMessageView = (message: RenderMessage | Annotation) => {
+  // Scroll controller.
+  const { setScroll, updateScrollRef, adjustScroll } = useScroll("messenger");
 
-      // Step 1: See if user is scrolled down.
-      updateScrollRef()
+  // Main function for updating the message view.
+  const updateMessageView = (message: RenderMessage | Annotation) => {
 
-      // Step 2: Add the new content to the view.
-      if ("content" in message) {
+    // Step 1: See if user is scrolled down.
+    updateScrollRef()
+
+    // Step 2: Add the new content to the view.
+    if ("content" in message) {
+      addMessage(message)
+    } else {
+      updateMessage(message)
+    }
+
+    // Step 3: Pop off oldest message (if > 200).
+    if (messages.value.size >= 200) {
+      const oldest = Array.from(messages.value.keys()).shift();
+      messages.value.delete(oldest);
+    }
+
+    // Step 4: Update grouping.
+    updateGrouping()
+
+    // Setp 5: Scroll the view (if scrolled down).
+    setTimeout(adjustScroll, 20);
+
+    // Step 6: Save the view data.
+    saveMessages()
+
+  }
+
+  // Seed message view with message history.
+  const prepMessageView = (newMessages: RenderMessage[]) => {
+    console.log("MSGR:Prepping messenger view.")
+
+    // Load and render saved messages and immediately scroll to bottom.
+    loadSavedMessages()
+    setTimeout(setScroll.bind(false), 10);
+
+    // Render new messages, then wait 1s to scroll.
+    if (newMessages.length) {
+
+      console.log("MSGR:Adding new messages")
+
+      newMessages.forEach(message => {
+        message.newMessage = true;
         addMessage(message)
-      } else {
-        updateMessage(message)
-      }
+      })
 
-      // Step 3: Pop off oldest message (if > 200).
-      if (messages.value.size >= 200) {
-        const oldest = Array.from(messages.value.keys()).shift();
-        messages.value.delete(oldest);
-      }
-
-      // Step 4: Update grouping.
-      updateGrouping()
-
-      // Setp 5: Scroll the view (if scrolled down).
-      setTimeout(adjustScroll, 20);
-
-      // Step 6: Save the view data.
-      saveMessages()
+      setTimeout(setScroll.bind(true), 1000);
 
     }
+  }
 
-    const resetMessages = () => {
-      messages.value.clear()
-    }
-
-    return {
-      messages,
-      updateMessageView,
-      resetMessages
-    }
+  return {
+    messages,
+    prepMessageView,
+    updateMessageView
+  }
 }

src/modules/scroll.ts

@@ -5,13 +5,13 @@ export default function useScroll(element: string) {
   let isScrolledToBottom: boolean;
 
   // Set the initial scroll position.
-  const setScroll = () => {
+  const setScroll = (smooth: boolean) => {
     const view = document.getElementById(element)
 
     if (view) {
       view.scrollTo({
         top: view.scrollHeight - view.clientHeight,
-        behavior: 'smooth'
+        behavior: (smooth) ? 'smooth' : 'auto' 
       });
     }
   }