accepting code for auth page

src/Home/AuthPage/AuthPage.js

@@ -1,7 +1,7 @@
 import { Preferences } from '@capacitor/preferences';
-import util from "../../util.js"
 import "./Login.js";
 import "./Signup.js"
+import "./EnterCode.js"
 
 class AuthPage extends Shadow {
     inputStyles(el) {
@@ -48,7 +48,7 @@ class AuthPage extends Shadow {
                             this.attr("selected", "1")
                         })
 
-                    p("Sign Up")
+                    p("Enter Code")
                         .state(this, "selected", function (selected) {
                             if(selected === "2") {
                                 this.fontWeight("bold")
@@ -86,10 +86,10 @@ class AuthPage extends Shadow {
                             }
                         })
 
-                    Signup()
+                    EnterCode()
                         .state(this, "selected", function (selected) {
                             if(selected === "2") {
-                                this.display("")
+                                this.display("flex")
                             } else {
                                 this.display("none")
                             }

src/Home/AuthPage/EnterCode.js

@@ -0,0 +1,99 @@
+import util from "../../util.js"
+import "./Signup.js"
+
+class EnterCode extends Shadow {
+    inputStyles(el) {
+        return el
+            .background("var(--main)")
+            .color("var(--text)")
+            .border("1px solid var(--accent)")
+            .fontSize(0.9, rem)
+            .backgroundColor("var(--searchbackground)")
+            .borderRadius(12, px)
+            .outline("none")
+            .onTouch((start) => {
+                if (start) {
+                    this.style.backgroundColor = "var(--accent)"
+                } else {
+                    this.style.backgroundColor = "var(--searchbackground)"
+                }
+            })
+    }
+
+    render() {
+        VStack(() => {
+
+            VStack(() => {
+                p("Enter the code given to you by your organization.")
+                    .color("#614945")
+                    .maxWidth(70, vw)
+                    .marginTop(3, em)
+    
+                input("Code", "70vw")
+                    .attr({ name: "firstName", type: "text" })
+                    .margin("auto")
+                    .marginVertical(1, em)
+                    .padding(1, em)
+                    .styles(this.inputStyles)
+                
+                button("==>")
+                    .padding(1, em)
+                    .fontSize(0.9, rem)
+                    .borderRadius(12, px)
+                    .background("var(--searchbackground)")
+                    .color("var(--text)")
+                    .border("1px solid var(--accent)")  
+                    .boxSizing("border-box")
+                    .onTouch(function (start) {
+                        if (start) {
+                            this.style.backgroundColor = "var(--accent)"
+                        } else {
+                            this.style.backgroundColor = "var(--searchbackground)"
+                        }
+                    })
+                    .onClick((done) => {
+                        if (done) this.submit()
+                    })
+            })
+            .state(this, "codeaccepted", function (accepted) {
+                if(!accepted) {
+                    this.display("flex")
+                } else {
+                    this.display("none")
+                }
+            })
+
+            Signup()
+            .state(this, "codeaccepted", function (accepted) {
+                if(accepted) {
+                    this.display("")
+                } else {
+                    this.display("none")
+                }
+            })
+        })
+        .horizontalAlign("center")
+        .display("flex")
+
+        this.style.display = "flex"
+    }
+
+    async submit() {
+        console.log("submit")
+        const res = await fetch(`${util.HOST}/auth/joincode`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ code: this.$("input").value })
+        });
+
+        if (res.ok) {
+            console.log("got join code succ")
+            this.attr("codeaccepted", "true")
+        } else {
+            const { error } = await res.json();
+            console.error(error)
+        }
+    }
+}
+
+register(EnterCode)

src/index.js

@@ -41,6 +41,7 @@ let Global = class {
     }
 
     onNavigate = async () => {
+        if(!global.profile) return
         let selectedNetwork = this.networkFromPath()
 
         if(!selectedNetwork) {
@@ -188,6 +189,7 @@ let Global = class {
 
         this.getProfile().then(async (status) => {
             if (status === 401) {
+                navigateTo("/")
                 AuthPage()
             } else if(status === 500) {
                 ConnectionError()