more auth stuff

api/src/api.ts

@@ -108,7 +108,7 @@ export default function createApi(log: Log, pg: Pg, discogs) {
     app.use(bodyParser())
 
     app.keys = [SECRET];
-    app.use(session({ sameSite: 'None' }, app));
+    app.use(session(app));
 
     const { authRouter, passport } = routerAuth(log, pg);
     app.use(passport.initialize());
@@ -119,11 +119,7 @@ export default function createApi(log: Log, pg: Pg, discogs) {
         ctx.status = 200;
     });
 
-    async function requireAuth(ctx, next) {
+    router.get('/bundles', async (ctx, next) => {
-        await next();
-    }
-
-    router.get('/bundles', requireAuth, async (ctx, next) => {
         const bundles = await getBundles();
         ctx.response.body = bundles;
     })

api/src/routers/router.auth.ts

@@ -17,9 +17,10 @@ export default function authRouter(log, pg: Pg) {
         { usernameField: 'email' },
         function localStrategy(email, password, done) {
             pg.userFindEmail(email)
-                .then(user => {
+                .then(async user => {
                     if (!user) return done(null, false);
-                    if (!verifyPassword(user, password)) return done(null, false);
+                    const passwordMatch = await verifyPassword(user, password);
+                    if (!passwordMatch) return done(null, false);
                     return done(null, user);
                 })
                 .catch(e => done(e, null));
@@ -37,23 +38,39 @@ export default function authRouter(log, pg: Pg) {
 
     authRouter.post('/login', async (ctx, next) => {
         await passport.authenticate('local', (err, user, info, status) => {
-            if (user) {
+            ctx.assert(user, 401, { error: 'incorrect login' });
+
             ctx.login(user);
             ctx.status = 200;
-                ctx.body = { status: 'success' };
+            ctx.body = {
-            } else {
+                email: user.email,
-                ctx.status = 400;
+                discogs: user.discogs,
-                ctx.body = { status: 'error' };
+            };
-            }
         })(ctx, next);
     });
 
+    authRouter.get('/login', async (ctx, next) => {
+        ctx.assert(ctx.isAuthenticated(), 401, { error: 'log in required' });
+
+        const user = ctx.state.user;
+        ctx.status = 200;
+        ctx.body = {
+            email: user.email,
+            discogs: user.discogs,
+        };
+    });
+
     authRouter.post('/register', async (ctx, next) => {
         const { discogs, email, password } = ctx.request.body;
         // fetch discogs data if they have it
         const params = { discogs, email, password, data: {} };
         const user = await pg.userCreate(params)
-        ctx.response.body = user;
+        ctx.login(user);
+        ctx.status = 200;
+        ctx.body = {
+            email: user.email,
+            discogs: user.discogs,
+        };
     });
 
     return { authRouter, passport };

client/src/actions.ts

@@ -7,9 +7,7 @@ const api = axios.create({
 
 const actions = {
     getBundles: async () => {
-        const res = await api.get('/bundles');
+        const { data: bundles } = await api.get('/bundles');
-        const { data: bundles } = res;
-        console.log(res);
         return bundles;
     },
 
@@ -23,13 +21,32 @@ const actions = {
         return data;
     },
 
+    getLogin: async () => {
+        try {
+            const { data: user } = await api.get('/auth/login')
+            console.log(user);
+            return user;
+        } catch (e) {
+            return null;
+        }
+    },
+
     postLogin: async (email, password) => {
-        const res = await api.post('/auth/login', {
+        const { data } = await api.post('/auth/login', {
             email,
             password,
         });
 
-        return res.data;
+        return data;
+    },
+
+    postRegister: async (email, password) => {
+        const { data } = await api.post('/auth/register', {
+            email,
+            password,
+        });
+
+        return data;
     },
 };
 

client/src/app.tsx

@@ -1,8 +1,8 @@
 import { h } from 'preact';
-import { Route, Router } from 'preact-router';
+import { useState, useEffect } from 'preact/hooks';
-import { Provider } from 'unistore/preact'
+import { Route, Router, route } from 'preact-router';
 
-import mcratesStore from './store';
+// import mcratesStore from './store';
 import actions from './actions';
 
 import Header from './components/header';
@@ -13,23 +13,35 @@ import Register from './routes/register';
 import Search from './routes/search';
 import User from './routes/user';
 
-const store = mcratesStore();
+// const store = mcratesStore();
 
-console.log(Home);
+function App() {
+    const [user, setUser] = useState(null);
 
-const App = () => (
+    useEffect(() => {
-    <Provider store={store}>
+        async function getLogin() {
+            const user = await actions.getLogin();
+            if (!user) return route('/login');
+        }
+
+        getLogin();
+    }, []);
+
+    function loginSuccess(user) {
+        setUser(user);
+    }
+
+    return (
         <div id="app">
             <Header />
             <Router>
                 <Route path="/" component={Home} />
-                <Route path="/login" component={Login} />
+                <Route path="/login" component={Login} success={loginSuccess} />
-                <Route path="/register" component={Register} />
                 <Route path="/search" component={Search} />
                 <Route path="/user/:userId" component={User} />
             </Router>
         </div>
-    </Provider>
     );
+}
 
 export default App;

client/src/routes/login.tsx

@@ -1,13 +1,15 @@
 import { h } from 'preact';
-import { useState, useEffect } from 'preact/hooks';
+import { useState } from 'preact/hooks';
 import actions from './../actions';
 
-const Register = () => {
+const Login = ({ success }) => {
+    const [mode, setMode] = useState('login')
     const [email, setEmail] = useState('')
     const [password, setPassword] = useState('');
 
     async function postLogin() {
-        actions.postLogin(email, password);
+        const user = await actions.postLogin(email, password);
+        success(user);
     }
 
     function handleSubmit(e) {
@@ -28,4 +30,4 @@ const Register = () => {
     );
 };
 
-export default Register;
+export default Login;

client/src/routes/register.tsx

@@ -1,17 +1,15 @@
 import { h } from 'preact';
-import { useState, useEffect } from 'preact/hooks';
+import { useState } from 'preact/hooks';
-import axios from 'axios';
 
-const Register = () => {
+import actions from './../actions';
+
+const Register = ({ success }) => {
     const [email, setEmail] = useState('')
     const [password, setPassword] = useState('');
 
     async function postRegister() {
-        const { data } = await axios.post(`http://localhost:41337/auth/register`, {
+        const user = await actions.postRegister(email, password);
-            email,
+        success(user);
-            password,
-        });
-        console.log(data);
     }
 
     function handleSubmit(e) {
@@ -19,13 +17,21 @@ const Register = () => {
         postRegister();
     }
 
+    function emailChange(e) {
+        setEmail(e.target.value);
+    }
+
+    function passwordChange(e) {
+        setPassword(e.target.value);
+    }
+
     return (
         <div class={'home'}>
             <form action="" method="get" >
                 <label for="email">email: </label>
-                <input type="email" name="email" id="email" value={email} required onChange={(e) => setEmail(e.target.value)} />
+                <input type="email" name="email" id="email" value={email} required onChange={emailChange} />
                 <label for="password">password: </label>
-                <input type="password" name="password" id="password" value={password} required onChange={(e) => setPassword(e.target.value)} />
+                <input type="password" name="password" id="password" value={password} required onChange={passwordChange} />
                 <input type="submit" value="Register" onClick={handleSubmit} />
             </form>
         </div>

client/src/routes/search.tsx

@@ -1,12 +1,7 @@
 import { h } from 'preact';
-import { useState, useEffect } from 'preact/hooks';
+import { useState } from 'preact/hooks';
-import { connect } from 'unistore/preact';
 import axios from 'axios';
 
-import style from './style.less';
-import actions from './../actions';
-import Bundle from './../components/bundle';
-
 function result(r) {
     return (
         <div>{r.title}</div>