From 0125820794c16f786f9307a6d23c7fef3d4b9e27 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Thu, 15 Feb 2024 10:47:20 +0530
Subject: [PATCH 1/3] Improved: login page to use composition api pattern

---
 src/views/Login.vue | 72 ++++++++++++++++-----------------------------
 1 file changed, 25 insertions(+), 47 deletions(-)

diff --git a/src/views/Login.vue b/src/views/Login.vue
index 39e0005..a4eb241 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -24,7 +24,7 @@
   </ion-page>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 import { 
   IonButton,
   IonContent,
@@ -32,58 +32,36 @@ import {
   IonItem,
   IonPage
 } from "@ionic/vue";
-import { defineComponent } from "vue";
+import { computed, onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
-import { useStore } from "@/store";
-import { mapGetters } from "vuex";
+import store from "@/store";
 import Logo from "@/components/Logo.vue";
 import { translate } from "@/i18n"
 
-export default defineComponent({
-  name: "Login",
-  components: {
-    IonButton,
-    IonContent,
-    IonInput,
-    IonItem,
-    IonPage,
-    Logo
-  },
-  data() {
-    return {
-      username: "",
-      password: "",
-      instanceUrl: ""
-    };
-  },
-  computed: {
-    ...mapGetters({
-      currentInstanceUrlSaved: "user/getInstanceUrl"
-    })
-  },
-  mounted() {
-    this.instanceUrl = this.currentInstanceUrlSaved;
-  },
-  methods: {
-    login: function () {
-      this.store.dispatch("user/setUserInstanceUrl", this.instanceUrl.trim())
-      const { username, password } = this;
-      this.store.dispatch("user/login", { username: username.trim(), password }).then((data: any) => {
-        if (data.token) {
-          this.username = ""
-          this.password = ""
-          this.$router.push("/")
-        }
-      }).catch(err => err)
+const username = ref("")
+const password = ref("")
+const instanceUrl = ref("")
+const router = useRouter();
+
+const currentInstanceUrlSaved = computed(() => store.getters["user/getInstanceUrl"])
+
+onMounted(() => {
+  instanceUrl.value = currentInstanceUrlSaved.value;
+})
+
+function login() {
+  store.dispatch("user/setUserInstanceUrl", instanceUrl.value.trim())
+  // const { username, password } = this;
+  store.dispatch("user/login", { username: username.value.trim(), password: password.value }).then((data: any) => {
+    if (data.token) {
+      username.value = ""
+      password.value = ""
+      router.push("/")
     }
-  },
-  setup() {
-    const router = useRouter();
-    const store = useStore();
-    return { router, store, translate };
-  }
-});
+  }).catch(err => err)
+}
 </script>
+
 <style scoped>
 .login-container {
   width: 375px;

From e3061f6f9ae65a33d13d855759e64aeed4d438b7 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Thu, 15 Feb 2024 10:55:15 +0530
Subject: [PATCH 2/3] Fixed: error in console on logout regarding userId

---
 src/views/Settings.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 61acb86..966c898 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -18,7 +18,7 @@
             is added on sides from ion-item and ion-padding-vertical to compensate the removed
             vertical padding -->
             <ion-card-header class="ion-no-padding ion-padding-vertical">
-              <ion-card-subtitle>{{ userProfile.userId }}</ion-card-subtitle>
+              <ion-card-subtitle>{{ userProfile?.userId }}</ion-card-subtitle>
               <ion-card-title>{{ userProfile?.userFullName }}</ion-card-title>
             </ion-card-header>
           </ion-item>

From 43985254d17f129a4e50fb2514c3fd86ac83f76b Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yashmaheshwari551@gmail.com>
Date: Thu, 15 Feb 2024 11:06:28 +0530
Subject: [PATCH 3/3] Removed: unwanted comment

---
 src/views/Login.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/views/Login.vue b/src/views/Login.vue
index a4eb241..fc6f9c2 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -51,7 +51,6 @@ onMounted(() => {
 
 function login() {
   store.dispatch("user/setUserInstanceUrl", instanceUrl.value.trim())
-  // const { username, password } = this;
   store.dispatch("user/login", { username: username.value.trim(), password: password.value }).then((data: any) => {
     if (data.token) {
       username.value = ""