Adding a less complex router

src/router/index.ts

@@ -7,13 +7,19 @@ const routes: Array<RouteRecordRaw> = [
     name: "home",
     component: () =>
       import(/* webpackChunkName: "start" */ "../views/DiscoverView.vue"),
+    beforeEnter: (to, from, next) => {
+      const appStore = useAppStore();
+      const isAuthenticated = appStore.condition === "registered";
+      if (isAuthenticated) {
+        next();
+      } else {
+        next({ name: "start" });
+      }
+    },
   },
   {
     path: "/about",
     name: "about",
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
     component: () =>
       import(/* webpackChunkName: "about" */ "../views/AboutView.vue"),
   },
@@ -75,6 +81,12 @@ const routes: Array<RouteRecordRaw> = [
         /* webpackChunkName: "new-edit-commitment" */ "../views/NewEditCommitmentView.vue"
       ),
   },
+  {
+    path: "/project",
+    name: "project",
+    component: () =>
+      import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
+  },
   {
     path: "/new-edit-project",
     name: "new-edit-project",
@@ -83,12 +95,6 @@ const routes: Array<RouteRecordRaw> = [
         /* webpackChunkName: "new-edit-project" */ "../views/NewEditProjectView.vue"
       ),
   },
-  {
-    path: "/project",
-    name: "project",
-    component: () =>
-      import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"),
-  },
   {
     path: "/projects",
     name: "projects",
@@ -111,27 +117,4 @@ const router = createRouter({
   routes,
 });
 
-router.beforeEach(async (to, from, next) => {
-  const publicPages = ["/start", "/account", "/import-account"];
-  const isPublic = publicPages.includes(to.path);
-  const appStore = useAppStore();
-  console.log(to);
-  if (to.path === "/" && appStore.condition === "registered") {
-    next({ path: "/account" });
-  } else if (isPublic) {
-    switch (appStore.condition) {
-      case "registered":
-        next();
-        break;
-      default:
-        next();
-        break;
-    }
-  } else if (appStore.condition === "uninitialized") {
-    next({ path: "/start" });
-  } else {
-    next();
-  }
-});
-
 export default router;

src/views/NewEditProjectView.vue

@@ -10,7 +10,6 @@
           class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
           ><fa icon="chevron-left" class="fa-fw"></fa
         ></router-link>
-
         [New/Edit] Project
       </h1>
     </div>
@@ -39,7 +38,7 @@
       type="text"
       placeholder="Project Name"
       class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
-      v-modal="projectName"
+      v-model="projectName"
     />
 
     <textarea
@@ -134,6 +133,12 @@ export default class NewEditProjectView extends Vue {
       try {
         const resp = await this.axios.post(url, payload, { headers });
         console.log(resp.status, resp.data);
+        const route = {
+          name: "project",
+          params: { projectId: resp.data },
+        };
+        console.log(route);
+        this.$router.push(route);
       } catch (error) {
         console.log(error);
       }

src/views/ProjectViewView.vue

@@ -130,5 +130,10 @@ import { Options, Vue } from "vue-class-component";
 @Options({
   components: {},
 })
-export default class ProjectViewView extends Vue {}
+export default class ProjectViewView extends Vue {
+  projectId = "";
+  created(): void {
+    console.log(this.projectId);
+  }
+}
 </script>