Vue updates

Author: keerlu

vue/vue-getting-started/src/components/Chat.vue

@@ -2,43 +2,42 @@
 
 <template>
   <div id="talkjs-container" style="width: 100%; height: 500px">
-      <i>Loading chat...</i>
+    <i>Loading chat...</i>
   </div>
 </template>
 
 <script setup>
-  import Talk from "talkjs";
-  import { onMounted } from 'vue';
+import Talk from "talkjs";
+import { onMounted } from "vue";
 
-  onMounted(() => {
-    Talk.ready.then(() => {
-      const me = new Talk.User({
-        id: 'nina',
-        name: 'Nina',
-        email: '[email protected]',
-        photoUrl: 'https://talkjs.com/new-web/avatar-7.jpg',
-        welcomeMessage: 'Hi!',
-      });
-      const session = new Talk.Session({
-        appId: '<APP_ID>',
-        me: me,
-      });
+onMounted(() => {
+  Talk.ready.then(() => {
+    const session = new Talk.Session({
+      appId: "<APP_ID>",
+      userId: "nina",
+    });
+    session.currentUser.createIfNotExists({
+      name: "Nina",
+      email: "[email protected]",
+      photoUrl: "https://talkjs.com/new-web/avatar-7.jpg",
+      welcomeMessage: "Hi!",
+    });
 
-      const other = new Talk.User({
-        id: 'frank',
-        name: 'Frank',
-        email: '[email protected]',
-        photoUrl: 'https://talkjs.com/new-web/avatar-8.jpg',
-        welcomeMessage: 'Hey, how can I help?',
-      });
+    const otherRef = session.user("frank");
+    otherRef.createIfNotExists({
+      name: "Frank",
+      email: "[email protected]",
+      photoUrl: "https://talkjs.com/new-web/avatar-8.jpg",
+      welcomeMessage: "Hey, how can I help?",
+    });
 
-      const conversation = session.getOrCreateConversation('new_conversation');
-      conversation.setParticipant(me);
-      conversation.setParticipant(other);
+    const conversationRef = session.conversation("new_conversation");
+    conversationRef.createIfNotExists();
+    conversationRef.participant(otherRef).createIfNotExists();
 
-      const chatbox = session.createChatbox();
-      chatbox.select(conversation);
-      chatbox.mount(document.getElementById('talkjs-container'));
-      });
+    const chatbox = session.createChatbox();
+    chatbox.select(conversationRef);
+    chatbox.mount(document.getElementById("talkjs-container"));
   });
+});
 </script>