summaryrefslogtreecommitdiff
path: root/src/pages
diff options
context:
space:
mode:
Diffstat (limited to 'src/pages')
-rw-r--r--src/pages/Home.tsx8
-rw-r--r--src/pages/LogIn.tsx33
-rw-r--r--src/pages/ProjectsList.tsx49
-rw-r--r--src/pages/SignUp.tsx53
-rw-r--r--src/pages/index.ts4
5 files changed, 147 insertions, 0 deletions
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
new file mode 100644
index 0000000..7762636
--- /dev/null
+++ b/src/pages/Home.tsx
@@ -0,0 +1,8 @@
+export const Home = () => {
+ return (
+ <header>
+ <a href="/signup">Sign Up</a>
+ <a href="/login">Log In</a>
+ </header>
+ );
+}; \ No newline at end of file
diff --git a/src/pages/LogIn.tsx b/src/pages/LogIn.tsx
new file mode 100644
index 0000000..c787dce
--- /dev/null
+++ b/src/pages/LogIn.tsx
@@ -0,0 +1,33 @@
+import { useContext } from 'preact/hooks';
+import { useSignal } from '@preact/signals';
+import { route } from 'preact-router';
+import { Pb } from '../pb.ts';
+
+export const LogIn = () => {
+ const pb = useContext(Pb);
+
+ const email = useSignal('');
+ const password = useSignal('');
+
+ const onSubmit = async (event: SubmitEvent) => {
+ event.preventDefault();
+ const user = await pb.collection('users').authWithPassword(email.value, password.value);
+ if (pb.authStore.isValid) {
+ route('/' + user.username);
+ }
+ };
+
+ return (
+ <form onSubmit={onSubmit}>
+ <label>
+ Email:
+ <input type="text" value={email} onInput={e => email.value = e.target.value} />
+ </label>
+ <label>
+ Password:
+ <input type="password" value={password} onInput={e => password.value = e.target.value} />
+ </label>
+ <button>Log In</button>
+ </form>
+ );
+}; \ No newline at end of file
diff --git a/src/pages/ProjectsList.tsx b/src/pages/ProjectsList.tsx
new file mode 100644
index 0000000..b30c73e
--- /dev/null
+++ b/src/pages/ProjectsList.tsx
@@ -0,0 +1,49 @@
+import { useContext, useEffect } from 'preact/hooks';
+import { useSignal } from '@preact/signals';
+import { route } from 'preact-router';
+import { Pb } from '../pb.ts';
+
+export const ProjectsList = ({ user }) => {
+ console.log(user);
+ const pb = useContext(Pb);
+ const projects = useSignal(null);
+ const projectName = useSignal('');
+
+ useEffect(() => {
+ pb.collection('projects')
+ .getList(1, 20, { sort: '-mtime' })
+ .then(p => projects.value = p);
+ }, []);
+
+ const onCreateProject = async (event: FormEvent) => {
+ event.preventDefault();
+ const project = await pb.collection('projects').create({
+ name: projectName.value,
+ owner: pb.authStore.model.id,
+ });
+ route(`/${user}/${project.name}`);
+ };
+
+ if (projects.value === null) {
+ return (
+ <p>Loading...</p>
+ );
+ }
+ return (
+ <main>
+ <h1>{user}</h1>
+ <form onSubmit={onCreateProject}>
+ <label>
+ Name:
+ <input type="text" value={projectName} onInput={e => projectName.value = e.target.value} />
+ </label>
+ <button>Create roject</button>
+ </form>
+ <ul>
+ {projects.value.items.map(p => (
+ <li><a href={`/${user}/${p.name}`}>{p.name}</a></li>
+ ))}
+ </ul>
+ </main>
+ );
+}; \ No newline at end of file
diff --git a/src/pages/SignUp.tsx b/src/pages/SignUp.tsx
new file mode 100644
index 0000000..99cc7d6
--- /dev/null
+++ b/src/pages/SignUp.tsx
@@ -0,0 +1,53 @@
+import { useContext } from 'preact/hooks';
+import { useSignal } from '@preact/signals';
+import { route } from 'preact-router';
+import { Pb } from '../pb.ts';
+
+export const SignUp = () => {
+ const pb = useContext(Pb);
+
+ const username = useSignal('');
+ const email = useSignal('');
+ const password = useSignal('');
+ const confirm = useSignal('');
+
+ const onSubmit = async (event: SubmitEvent) => {
+ event.preventDefault();
+ const user = await pb.collection('users').create({
+ username: username.value,
+ email: email.value,
+ emailVisibility: true,
+ password: password.value,
+ passwordConfirm: confirm.value,
+ });
+ if (pb.authStore.isValid) {
+ route('/' + user.username);
+ }
+ };
+
+ return (
+ <main class="container">
+ <article>
+ <form onSubmit={onSubmit}>
+ <label>
+ Username:
+ <input type="text" value={username} onInput={e => username.value = e.target.value} />
+ </label>
+ <label>
+ Email:
+ <input type="text" value={email} onInput={e => email.value = e.target.value} />
+ </label>
+ <label>
+ Password:
+ <input type="password" value={password} onInput={e => password.value = e.target.value} />
+ </label>
+ <label>
+ Confirm Password:
+ <input type="password" value={confirm} onInput={e => confirm.value = e.target.value} />
+ </label>
+ <button>Sign Up</button>
+ </form>
+ </article>
+ </main>
+ );
+}; \ No newline at end of file
diff --git a/src/pages/index.ts b/src/pages/index.ts
new file mode 100644
index 0000000..8b28ea6
--- /dev/null
+++ b/src/pages/index.ts
@@ -0,0 +1,4 @@
+export { Home } from './Home.tsx';
+export { SignUp } from './SignUp.tsx';
+export { LogIn } from './LogIn.tsx';
+export { ProjectsList } from './ProjectsList.tsx'; \ No newline at end of file