Finalising all links for article

joshua-mo-143 · Mar 10, 2023 · 912298e · 912298e
1 parent 39d8c21
commit 912298e
Show file tree

Hide file tree

Showing 9 changed files with 76 additions and 32 deletions.
diff --git a/backend/src/router.rs b/backend/src/router.rs
@@ -122,7 +122,7 @@ pub async fn login(
             }
             let session_id = rand::random::<u64>().to_string();
 
-            sqlx::query("INSERT INTO sessions (session_id, user_id) VALUES ($1, 1)")
+            sqlx::query("INSERT INTO sessions (session_id, user_id) VALUES ($1, $2) ON CONFLICT (user_id) DO UPDATE SET session_id = EXCLUDED.session_id")
                 .bind(&session_id)
                 .bind(res.get::<i32, _>("id"))
                 .execute(&state.postgres)

diff --git a/src/components/AuthedLayout.tsx b/src/components/AuthedLayout.tsx
@@ -20,7 +20,9 @@ export default function AuthedLayout({children}: props) {
   const handleLogout = async (e: React.SyntheticEvent) => {
     e.preventDefault()
 
-    const res = await fetch(`http://${window.location.host}/api/auth/logout`);
+    let url = `//${window.location.host}/api/auth/logout`
+
+    const res = await fetch(url);
 
     if (res.ok) {
       router.push("/");

diff --git a/src/components/GuestLayout.tsx b/src/components/GuestLayout.tsx
@@ -20,8 +20,8 @@ return (
                </div>
         </div>
         <div className="flex flex-col col-span-1 bg-sky-200 h-full w-full items-center justify-center">
-          <p className="text-5xl">Zest.</p>
-          <p> Your number one source for Rust news.</p>
+          <p className="text-7xl">Zest.</p>
+          <p> Your number one app for storing notes and messages.</p>
           </div>
       </main>
 

diff --git a/src/pages/api/hello.ts b/src/pages/api/hello.ts
diff --git a/src/pages/dashboard/create.tsx b/src/pages/dashboard/create.tsx
@@ -14,7 +14,9 @@ export default function Home() {
   const handleLogout = async (e: React.SyntheticEvent) => {
     e.preventDefault()
 
-    const res = await fetch(`http://${window.location.host}/api/auth/logout`);
+   const url = `//${window.location.host}/api/auth/logout`
+
+    const res = await fetch(url);
 
     if (res.ok) {
       router.push("/");
@@ -23,8 +25,11 @@ export default function Home() {
 
   const handleSubmit = async (e: React.SyntheticEvent) => {
     e.preventDefault()
+
+   const url = `//${window.location.host}/api/notes/create`
+
     try {
-    const res = await fetch(`http://${window.location.host}/api/notes/create`, {
+    const res = await fetch(url, {
       mode: 'cors',
       method: 'POST',
       headers: {

diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx
@@ -24,9 +24,12 @@ export default function Home() {
     const element = e.target as HTMLButtonElement;
     const id = element.getAttribute("data-id");
 
+    const url = `//${window.location.host}/api/notes/${id}`
+
+
     try {
 
-const res = await fetch(`http://${window.location.host}/api/notes/${id}`, {
+const res = await fetch(url, {
       mode: 'cors',
       method: 'DELETE'
     });
@@ -43,8 +46,10 @@ const res = await fetch(`http://${window.location.host}/api/notes/${id}`, {
   React.useEffect(() => {
     const fetchData = async () => {
 
+     const url = `//${window.location.host}/api/notes`
+
       try {
-        const res = await fetch(`http://${window.location.host}/api/notes`,
+        const res = await fetch(url,
         {
             method: "GET",
             credentials: "include",

diff --git a/src/pages/forgot.tsx b/src/pages/forgot.tsx
@@ -7,21 +7,49 @@ import GuestLayout from '../components/GuestLayout'
 
 export default function Home() {
 
+  const [email, setEmail] = React.useState<string>("");
+  const [success, setSuccess] = React.useState<boolean>(false);
+
   const handleSubmit = async (e: React.SyntheticEvent) => {
+      e.preventDefault()
+
+
+ const url = `//${window.location.host}/api/auth/register`
 
+
+  try {
+      let res = await fetch(url, {
+      method: 'POST',
+      mode: 'cors',
+      headers: {
+          "Content-Type": "application/json"
+        },
+    body: JSON.stringify({
+      email: email
+    }
+        )});
+
+
+  } catch (e:any) {
+    console.log(`Error: ${e}`)
+  }
   }
 
+
   return (
     <GuestLayout>
-
-              <p className="lg:text-2xl ">Forgot Password</p>
+        <p className="lg:text-2xl ">Forgot Password</p>
             <form onSubmit={handleSubmit} className="flex flex-col justify-center items-center gap-10">
         <label className="flex flex-row justify-center items-center justify-center">
               <span>E-mail:</span>
-            <input className="px-5 py-2"></input>
+            <input className="px-5 py-2" required value={email} onChange={(e) => setEmail((e.target as HTMLInputElement).value)}></input>
         </label>
         <button type="submit" className="px-5 py-2 bg-stone-200 hover:bg-stone-100 transition-all">Submit</button>
     </form>
+      <p id="success" className={success ? "" : "invisible"}>Sent! You'll receive an email if your inputted email is valid. </p>
+
+      <Link href="/" className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">Back to Main</Link>
+
     </GuestLayout>
   )
 }
diff --git a/src/pages/login.tsx b/src/pages/login.tsx
@@ -2,6 +2,7 @@ import Head from 'next/head'
 import Image from 'next/image'
 import { Inter } from '@next/font/google'
 import React from 'react'
+import Link from 'next/link'
 import {useRouter} from 'next/router'
 import GuestLayout from '../components/GuestLayout'
 
@@ -16,8 +17,10 @@ export default function Home() {
   const handleSubmit = async (e: React.SyntheticEvent) => {
     e.preventDefault()
 
+  const url = `//${window.location.host}/api/auth/login`
+
     try {
-      await fetch(`http://${window.location.host}/api/auth/login`, 
+      await fetch(url, 
         {
           method: "POST",
           mode: "cors",
@@ -57,9 +60,8 @@ export default function Home() {
             <p id="error" className="w-3/5 h-[2rem]"></p>
             <button type="submit" className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">Submit</button>
            </form>
-
 
-            <button className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">I'm a new user</button>
+            <Link href="/register" className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">I'm a new user</Link>
     </GuestLayout>
   )
 }
diff --git a/src/pages/register.tsx b/src/pages/register.tsx
@@ -2,30 +2,37 @@ import Head from 'next/head'
 import Image from 'next/image'
 import { Inter } from '@next/font/google'
 import React from 'react'
+import Link from 'next/link'
 import {useRouter} from 'next/router'
 import GuestLayout from '../components/GuestLayout'
 
 export default function Home() {
 
   let [username, setUsername] = React.useState<string>("");
+  let [email, setEmail] = React.useState<string>("");
   let [password, setPassword] = React.useState<string>("");
   let [confirm, setConfirm] = React.useState<string>("");
   let [error, setError] = React.useState<string>("");
 
   let router = useRouter();
-
+
+
 
   const handleSubmit = async (e: React.SyntheticEvent) => {
     e.preventDefault()
 
+    let element = document.querySelector('#error') as HTMLParagraphElement
+
     if (password != confirm) {
-      // @ts-ignore
-      document.querySelector("#error").innerText = "Your password and confirmed password need to be the same!"
+      element.innerText = "Your password and confirmed password need to be the same!"
       return
     }
 
+
+    const url = `//${window.location.host}/api/auth/register`
+
     try {
-      await fetch(`http://${window.location.host}/api/auth/register`, 
+      await fetch(url, 
         {
           method: "POST",
           mode: "cors",
@@ -34,6 +41,7 @@ export default function Home() {
           },
           body: JSON.stringify({
             username: username,
+            email: email,
             password: password
           }),
         })
@@ -54,6 +62,13 @@ export default function Home() {
                 <input className="px-5 py-2 w-full" name="username" type="text" placeholder="Username" value={username} required
                  onChange={(e) => setUsername((e.target as HTMLInputElement).value)}></input>
               </label>
+        <label htmlFor="email" className="flex flex-row items-center gap-4 w-[20rem]">
+        <span>Email: </span>
+
+<input className="px-5 py-2 w-full" name="email" type="email" placeholder="E-mail" value={email} required
+                onChange={(e) => setEmail((e.target as HTMLInputElement).value)}></input>
+
+              </label>
 
 <label htmlFor="password" className="flex flex-row items-center gap-4 w-[20rem]">
                 <span>Password:</span>
@@ -71,7 +86,7 @@ export default function Home() {
             <button type="submit" className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">Submit</button>
            </form>
 
-              <button className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">I have an account</button>
+              <Link href="/login" className="px-8 py-2 bg-stone-100 hover:bg-white transition-all">I have an account</Link>
     </GuestLayout>
   )
 }