From 71d784204b54c24cd68a90124169a039a4654a79 Mon Sep 17 00:00:00 2001
From: Haris Razis <dev@xrazis.com>
Date: Sat, 26 Dec 2020 15:22:11 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A8=20Fix=20user=20login/register?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

User can login and register but session is not persistent.
---
 server/routes/auth.js   | 21 +++++++++++++--------
 web/src/main.ts         |  2 ++
 web/src/store/index.ts  |  8 ++++++--
 web/src/views/Login.vue |  6 +++---
 4 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/server/routes/auth.js b/server/routes/auth.js
index 7b67a3a..188aec9 100644
--- a/server/routes/auth.js
+++ b/server/routes/auth.js
@@ -2,13 +2,22 @@ const express = require('express');
 const passport = require('passport')
 const router = express.Router();
 
-router.get('/auth/login', passport.authenticate('local'),
-    (req, res) => {
-        res.redirect('/dashboard');
+router.post('/auth/login',
+    (req, res, next) => {
+        passport.authenticate('local', {}, (err, user, info) => {
+            if (err)
+                return res.status(400).json({errors: err});
+            if (!user)
+                return res.status(400).json({errors: info});
+
+            req.logIn(user, () => {
+                return res.status(200).json({success: `logged in ${user.id}`});
+            });
+        })(req, res, next);
     }
 );
 
-router.get('/auth/logout', (req, res) => {
+router.post('/auth/logout', (req, res) => {
     req.logout();
     res.redirect('/');
 });
@@ -17,8 +26,4 @@ router.get('/auth/current_user', (req, res) => {
     res.send(req.user);
 });
 
-router.get('/auth/works', (req, res) => {
-    res.send('Become powerful you have, the dark side in you I sense. Yrsssss.');
-});
-
 module.exports = router;
diff --git a/web/src/main.ts b/web/src/main.ts
index db3e55f..28688bc 100644
--- a/web/src/main.ts
+++ b/web/src/main.ts
@@ -2,9 +2,11 @@ import {createApp} from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
+import axios from 'axios';
 
 import 'bulma/css/bulma.css';
 import '@fortawesome/fontawesome-free/css/all.css';
 import '@fortawesome/fontawesome-free/js/all.js';
 
+axios.defaults.withCredentials = true;
 createApp(App).use(store).use(router).mount('#app')
diff --git a/web/src/store/index.ts b/web/src/store/index.ts
index c82334b..29cc60f 100644
--- a/web/src/store/index.ts
+++ b/web/src/store/index.ts
@@ -23,7 +23,11 @@ export default createStore({
     actions: {
         login({commit}, user: { username: string, password: string }) {
             return new Promise((resolve, reject) => {
-                axios({method: 'post', url: 'http://localhost:8000/auth/login', data: qs.stringify({user})})
+                axios({
+                    method: 'post',
+                    url: 'http://localhost:8000/auth/login',
+                    data: qs.stringify({...user})
+                })
                     .then((resp: AxiosResponse) => {
                         commit("auth_success", user);
                         resolve(resp)
@@ -43,6 +47,6 @@ export default createStore({
     },
     modules: {},
     getters: {
-        isLoggedIn: state => !!state.status,
+        isLoggedIn: state => state.status,
     }
 })
diff --git a/web/src/views/Login.vue b/web/src/views/Login.vue
index f63a645..8165c08 100644
--- a/web/src/views/Login.vue
+++ b/web/src/views/Login.vue
@@ -9,7 +9,7 @@
         <form @submit.prevent="login">
           <div class="field">
             <p class="control has-icons-left has-icons-right">
-              <input class="input" placeholder="Username" type="text" v-model="username">
+              <input v-model="username" class="input" placeholder="Username" type="text">
               <span class="icon is-small is-left">
       <i class="fas fa-user"></i>
     </span> <span class="icon is-small is-right">
@@ -18,14 +18,14 @@
           </div>
           <div class="field">
             <p class="control has-icons-left">
-              <input class="input" placeholder="Password" type="password" v-model="password">
+              <input v-model="password" class="input" placeholder="Password" type="password">
               <span class="icon is-small is-left">
       <i class="fas fa-lock"></i></span>
             </p>
           </div>
           <div class="field">
             <p class="control">
-              <button type="submit" class="button is-success">
+              <button class="button is-success" type="submit">
                 Login
               </button>
             </p>