auth init

client/src/routes/home.tsx

@@ -1,30 +1,31 @@
 import { h } from 'preact';
-import { connect } from 'unistore/preact'
+import { useState, useEffect } from 'preact/hooks';
 
 import actions from './../actions';
 import Bundle from './../components/bundle';
 
-interface Props {
-    bundles: any[];
-    getBundles: () => void,
+
+function Home() {
+    const [bundles, setBundles] = useState([]);
+
+    useEffect(() => {
+        actions.getBundles().then(setBundles);
+    }, []);
+
+    if (!bundles.length) {
+        return (
+            <div class={'home'}>
+                loading...
+            </div>
+        );
+    }
+
+
+    return (
+        <div class={'home'}>
+            {bundles.map(Bundle)}
+        </div>
+    );
 }
 
-function Home({ bundles, getBundles }: Props) {
-	if (!bundles.length) {
-		getBundles();
-
-		return (
-			<div class={'home'}>
-				loading...
-			</div>
-		);
-	}
-
-	return (
-		<div class={'home'}>
-			{bundles.map(Bundle)}
-		</div>
-	);
-}
-
-export default connect('bundles', actions)(Home);
+export default Home;

client/src/routes/login.tsx

@@ -0,0 +1,35 @@
+import { h } from 'preact';
+import { useState, useEffect } from 'preact/hooks';
+import axios from 'axios';
+
+const Register = () => {
+    const [email, setEmail] = useState('')
+    const [password, setPassword] = useState('');
+
+    async function postLogin() {
+        const { data } = await axios.post(`http://localhost:41337/auth/login`, {
+            email,
+            password,
+        });
+        console.log(data);
+    }
+
+    function handleSubmit(e) {
+        e.preventDefault();
+        postLogin();
+    }
+
+    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)} />
+                <label for="password">password: </label>
+                <input type="password" name="password" id="password" value={password} required onChange={(e) => setPassword(e.target.value)} />
+                <input type="submit" value="Login" onClick={handleSubmit} />
+            </form>
+        </div>
+    );
+};
+
+export default Register;

client/src/routes/register.tsx

@@ -0,0 +1,35 @@
+import { h } from 'preact';
+import { useState, useEffect } from 'preact/hooks';
+import axios from 'axios';
+
+const Register = () => {
+    const [email, setEmail] = useState('')
+    const [password, setPassword] = useState('');
+
+    async function postRegister() {
+        const { data } = await axios.post(`http://localhost:41337/auth/register`, {
+            email,
+            password,
+        });
+        console.log(data);
+    }
+
+    function handleSubmit(e) {
+        e.preventDefault();
+        postRegister();
+    }
+
+    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)} />
+                <label for="password">password: </label>
+                <input type="password" name="password" id="password" value={password} required onChange={(e) => setPassword(e.target.value)} />
+                <input type="submit" value="Register" onClick={handleSubmit} />
+            </form>
+        </div>
+    );
+};
+
+export default Register;

client/src/routes/user.tsx

@@ -1,9 +1,7 @@
 import { h } from 'preact';
 import { useState, useEffect } from 'preact/hooks';
-import { connect } from 'unistore/preact';
-import axios from 'axios';
 
-import style from './style.less';
+// import style from './style.less';
 import actions from './../actions';
 import Bundle from './../components/bundle';
 
@@ -14,31 +12,26 @@ interface Props {
 }
 
 const User = ({ userId }: Props) => {
-  	const [offers, setOffers] = useState([]);
+    const [offers, setOffers] = useState([]);
 
-  	useEffect(() => {
-  		async function fetchOffers() {
-	        const { data } = await axios.get(`http://localhost:41337/user/${userId}/offers`);
-	        setOffers(data);
-  		}
-
-  		fetchOffers();
+    useEffect(() => {
+        actions.getOffers(userId).then(setOffers);
     }, [userId]);
 
 
-	if (!offers.length) {
-		return (
-			<div class={'home'}>
-				loading...
-			</div>
-		);
-	}
+    if (!offers.length) {
+        return (
+            <div class={'home'}>
+                loading...
+            </div>
+        );
+    }
 
     return (
-		<div class={'home'}>
-			{offers.map(Bundle)}
-		</div>
-	);
+        <div class={'home'}>
+            {offers.map(Bundle)}
+        </div>
+    );
 };
 
-export default connect(['offers'], actions)(User);
+export default User;