user orgs!!

src/components/page/container.vue

@@ -47,7 +47,7 @@
     )
     list-items(
       :wide="false",
-      v-for="type in organisations[org].model[item.type]",
+      v-for="type in types",
       :key="type",
       :type="type",
       :editable="editable",
@@ -106,6 +106,14 @@ gunItem.map().on((data: any, key: string) => {
   item[key] = data;
 });
 
+const types = computed(() => {
+  if (organisations[props.org]) {
+    return organisations[props.org].model[item.type];
+  } else {
+    return model[item.type];
+  }
+});
+
 const edit = reactive({
   icon: false,
   title: false,

src/pages/org/[org].vue

@@ -1,7 +1,7 @@
 <template lang="pug">
 main#main
   .title 
-    router-link(to="/org/") Organisations / {{ organisations[org].title }}
+    router-link(to="/org/") Organisations / {{ organisations?.[org]?.title || org }}
   router-view(v-slot="{ Component }")
     transition(name="fade")
       component(:is="Component")

src/pages/org/[org]/[type].vue

@@ -4,7 +4,7 @@
     type-icon.type(
       @click="$router.push(`/org/${org}/${atype}`)",
       :class="{ active: atype == type }",
-      v-for="atype in Object.keys(organisations[org].model)",
+      v-for="atype in types",
       :key="atype",
       :type="atype"
     )
@@ -14,13 +14,21 @@
 </template>
 
 <script setup lang="ts">
-import { defineProps } from "vue";
-import { organisations } from "../../../store/model";
+import { computed, defineProps } from "vue";
+import { model, organisations } from "../../../store/model";
 
 const props = defineProps({
   type: String,
   org: String,
 });
+
+const types = computed(() => {
+  if (organisations[props.org]) {
+    return Object.keys(organisations[props.org].model);
+  } else {
+    return Object.keys(model);
+  }
+});
 </script>
 
 <style lang="stylus" scoped>

src/pages/org/[org]/index.vue

@@ -1,18 +1,18 @@
 <template lang="pug">
-.types {{ organisations[org] }}
+.types {{ organisations?.[org] }}
   type-counter(
     @click="$router.push(`/org/${org}/${type}`)",
-    v-for="type in Object.keys(organisations[org].model)",
+    v-for="type in types",
     :key="type",
     :type="type",
     :parent="org"
   )
 </template>
 
 <script setup lang="ts">
-import { defineProps } from "vue";
+import { computed, defineProps } from "vue";
 import { useTitle } from "@vueuse/core";
-import { organisations } from "../../../store/model";
+import { model, organisations } from "../../../store/model";
 
 const props = defineProps({
   org: String,
@@ -22,6 +22,14 @@ useTitle(`Explore ${props.org}`);
 function explore(ev) {
   console.log(ev);
 }
+
+const types = computed(() => {
+  if (organisations[props.org]) {
+    return Object.keys(organisations[props.org].model);
+  } else {
+    return Object.keys(model);
+  }
+});
 </script>
 
 <style lang="stylus" scoped>

src/pages/org/index.vue

@@ -10,13 +10,19 @@ main#main
       :type="type",
       :parent="path"
     )
+  form.custom(@submit.prevent.stop)
+    input(type="text", v-model="customOrg")
+    router-link(:to="`/org/${customOrg}`") {{ customOrg }}
 </template>
 
 <script setup lang="ts">
 import { organisations, types } from "../../store/model";
 import { useTitle } from "@vueuse/core";
+import { ref } from "vue";
 
-useTitle("Explore");
+useTitle("Organisations");
+
+const customOrg = ref("");
 </script>
 
 <style lang="stylus" scoped>