Implement authentication roughly

frontend/components/organisms/LoginForm.vue

@@ -58,23 +58,16 @@ export default {
   },
 
   methods: {
-    cancel() {
-      this.$emit('close')
-    },
     validate() {
       return this.$refs.form.validate()
     },
-    reset() {
-      this.$refs.form.reset()
-    },
     tryLogin() {
       if (this.validate()) {
         this.login({
           username: this.username,
           password: this.password
         })
-        this.reset()
-        this.cancel()
+        this.$router.push('/projects')
       }
     }
   }

frontend/pages/auth.vue

@@ -4,37 +4,9 @@
       <v-container class="fill-height" fluid>
         <v-row align="center" justify="center">
           <v-col cols="12" sm="8" md="4">
-            <login-form />
-            <!--
-            <v-card class="elevation-12">
-              <v-toolbar color="primary" dark flat>
-                <v-toolbar-title>Login form</v-toolbar-title>
-              </v-toolbar>
-              <v-card-text>
-                <v-form>
-                  <v-text-field
-                    label="Login"
-                    name="login"
-                    prepend-icon="person"
-                    type="text"
-                  />
-                  <v-text-field
-                    id="password"
-                    label="Password"
-                    name="password"
-                    prepend-icon="lock"
-                    type="password"
-                  />
-                </v-form>
-              </v-card-text>
-              <v-card-actions>
-                <div class="flex-grow-1" />
-                <v-btn color="primary">
-                  Login
-                </v-btn>
-              </v-card-actions>
-            </v-card>
-            -->
+            <login-form
+              :login=authenticateUser
+            />
           </v-col>
         </v-row>
       </v-container>
@@ -43,11 +15,16 @@
 </template>
 
 <script>
+import { mapActions } from 'vuex'
 import LoginForm from '@/components/organisms/LoginForm'
 
 export default {
   components: {
     LoginForm
+  },
+
+  methods: {
+    ...mapActions('auth', ['authenticateUser'])
   }
 }
 </script>

frontend/store/auth.js

@@ -21,38 +21,19 @@ export const getters = {
 
 export const actions = {
   authenticateUser({ commit }, authData) {
-    let authUrl =
-      'https://www.googleapis.com/identitytoolkit/v3/relyingparty/verifyPassword?key=' +
-      process.env.fbAPIKey
-    if (!authData.isLogin) {
-      authUrl =
-        'https://www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=' +
-        process.env.fbAPIKey
-    }
+    const authUrl = 'http://127.0.0.1:8000/v1/auth-token'
     return this.$axios
-      .$post(authUrl, {
-        email: authData.email,
-        password: authData.password,
-        returnSecureToken: true
-      })
+      .$post(authUrl, authData)
       .then((result) => {
-        commit('setToken', result.idToken)
-        localStorage.setItem('token', result.idToken)
-        localStorage.setItem(
-          'tokenExpiration',
-          new Date().getTime() + Number.parseInt(result.expiresIn) * 1000
-        )
-        Cookie.set('jwt', result.idToken)
-        Cookie.set(
-          'expirationDate',
-          new Date().getTime() + Number.parseInt(result.expiresIn) * 1000
-        )
+        alert(JSON.stringify(result))
+        commit('setToken', result.token)
+        localStorage.setItem('token', result.token)
+        Cookie.set('jwt', result.token)
       })
       .catch(e => alert(e))
   },
   initAuth({ commit, dispatch }, req) {
     let token
-    let expirationDate
     if (req) {
       if (!req.headers.cookie) {
         return
@@ -64,27 +45,16 @@ export const actions = {
         return
       }
       token = jwtCookie.split('=')[1]
-      expirationDate = req.headers.cookie
-        .split(';')
-        .find(c => c.trim().startsWith('expirationDate='))
-        .split('=')[1]
     } else {
       token = localStorage.getItem('token')
-      expirationDate = localStorage.getItem('tokenExpiration')
-    }
-    if (new Date().getTime() > +expirationDate || !token) {
-      dispatch('logout')
-      return
     }
     commit('setToken', token)
   },
   logout({ commit }) {
     commit('clearToken')
     Cookie.remove('jwt')
-    Cookie.remove('expirationDate')
     if (process.client) {
       localStorage.removeItem('token')
-      localStorage.removeItem('tokenExpiration')
     }
   }
 }