@edgedev/create-edge-app 1.1.17 → 1.1.18

package/.env

@@ -9,4 +9,5 @@ VITE_FIREBASE_EMULATOR_AUTH=
 VITE_FIREBASE_EMULATOR_FIRESTORE=
 VITE_FIREBASE_EMULATOR_FUNCTIONS=
 VITE_FIREBASE_EMULATOR_STORAGE=
-REGISTRATION_CODE=organization-registration-template
+REGISTRATION_CODE=organization-registration-template
+DEVELOPMENT_MODE=false

package/.env.dev

@@ -9,4 +9,5 @@ VITE_FIREBASE_EMULATOR_AUTH=9099
 VITE_FIREBASE_EMULATOR_FIRESTORE=8080
 VITE_FIREBASE_EMULATOR_FUNCTIONS=5001
 VITE_FIREBASE_EMULATOR_STORAGE=9199
-REGISTRATION_CODE=organization-registration-template
+REGISTRATION_CODE=organization-registration-template
+DEVELOPMENT_MODE=true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edgedev/create-edge-app",
-  "version": "1.1.17",
+  "version": "1.1.18",
   "description": "Create Edge Starter App",
   "bin": {
     "create-edge-app": "./bin/cli.js"

package/pages/app/account/[page].vue

@@ -62,24 +62,30 @@ const page = computed(() => {
       :subscribe-options="subscribeOptions"
       :form-schema="orgSchema"
       :org-fields="orgFields"
+      class="pt-0"
     />
     <edge-my-account
       v-if="page === 'my-account'"
+      class="pt-0"
     />
     <edge-my-profile
       v-if="page === 'my-profile'"
       :form-schema="metaSchema"
       :meta-fields="metaFields"
+      class="pt-0"
     />
     <edge-organization-members
       v-if="page === 'organization-members'"
+      class="pt-0"
     />
     <edge-my-organizations
       v-if="page === 'my-organizations'"
       :registration-code="config.public.registrationCode"
+      class="pt-0"
     />
     <edge-billing
       v-if="page === 'subscription'"
+      class="pt-0"
     />
   </div>
 </template>

package/pages/app/dashboard/[[collection]]/[[docId]].vue

@@ -1,6 +1,7 @@
 <script setup>
 import { toTypedSchema } from '@vee-validate/zod'
 import * as z from 'zod'
+
 const route = useRoute()
 const router = useRouter()
 // const edgeGlobal = inject('edgeGlobal')
@@ -66,30 +67,14 @@ const isAdmin = computed(() => {
   return edgeGlobal.isAdminGlobal(edgeFirebase).value
 })
 
-const toBool = v => v === true || v === 'true' || v === 1 || v === '1'
-
-const allowMenuItem = (item) => {
-  const isDev = config.public.developmentMode
-  const adminOnly = toBool(item.adminOnly)
-  const devOnly = toBool(item.devOnly)
-  const override = toBool(item.override)
-  if (item.override !== undefined)
-    return override
-  if (adminOnly && !isAdmin.value)
-    return false
-  if (devOnly && !isDev)
-    return false
-  return true
-}
-
 onMounted(() => {
   if (!route.params.collection) {
     const menuItems = edgeGlobal.edgeState.menuItems
-      .filter(allowMenuItem)
+      .filter(item => edgeGlobal.allowMenuItem(item, isAdmin.value))
       .map(item => ({
         ...item,
         submenu: Array.isArray(item.submenu)
-          ? item.submenu.filter(allowMenuItem)
+          ? item.submenu.filter(subItem => edgeGlobal.allowMenuItem(subItem, isAdmin.value))
           : item.submenu,
       }))
     const firstTop = (menuItems && menuItems.length) ? menuItems[0] : null
@@ -104,19 +89,21 @@ onMounted(() => {
   <div
     v-if="edgeGlobal.edgeState.organizationDocPath"
   >
-    <edge-dashboard v-if="docId === ''" :filter="state.filter" :collection="collection" class="flex-1">
+    <edge-dashboard v-if="docId === ''" :filter="state.filter" :collection="collection" class="flex-1 pt-0">
       <template #header-start>
         <LayoutDashboard class="mr-2" />
         <span class="capitalize">{{ collection }}</span>
       </template>
       <template #header-center>
         <div class="w-full px-6">
-          <edge-shad-input
-            v-model="state.filter"
-            label=""
-            name="filter"
-            placeholder="Filter..."
-          />
+          <edge-shad-form>
+            <edge-shad-input
+              v-model="state.filter"
+              label=""
+              name="filter"
+              placeholder="Filter..."
+            />
+          </edge-shad-form>
         </div>
       </template>
       <template #header-end="slotProps">
@@ -155,7 +142,7 @@ onMounted(() => {
       :doc-id="docId"
       :schema="schemas[collection]"
       :new-doc-schema="state.newDocs[collection]"
-      class="w-full max-w-7xl mx-auto flex-1"
+      class="w-full max-w-7xl mx-auto flex-1 pt-0 px-0"
     >
       <template #header-start="slotProps">
         <FilePenLine class="mr-2" />

package/pages/app/index.vue

@@ -0,0 +1,13 @@
+<script setup lang="js">
+const router = useRouter()
+onMounted(() => {
+  router.push('/app/dashboard')
+})
+</script>
+
+<template>
+  <div />
+</template>
+
+<style scoped>
+</style>

package/pages/app.vue

@@ -1,7 +1,6 @@
 <script setup>
+import { Menu } from 'lucide-vue-next'
 const edgeFirebase = inject('edgeFirebase')
-// const edgeGlobal = inject('edgeGlobal')
-
 const route = useRoute()
 
 const currentOrganization = computed(() => {
@@ -26,6 +25,18 @@ const menuBuilder = () => {
       to: '/app/dashboard/subthings',
       icon: 'Package',
     },
+    {
+      title: 'Admin Only', // Example of an admin only menu item
+      to: '/app/dashboard/subthings',
+      icon: 'Package',
+      adminOnly: true,
+    },
+    {
+      title: 'Dev Only', // Example of a dev only menu item
+      to: '/app/dashboard/subthings',
+      icon: 'Package',
+      devOnly: true,
+    },
     {
       title: 'Settings',
       to: '/app/account/my-profile',
@@ -69,6 +80,11 @@ watch(currentOrganization, async () => {
     await projectSetOrg(currentOrganization.value, edgeFirebase, edgeGlobal)
 
     const orgDocPath = `organizations/${currentOrganization.value}`
+
+    // If we want other users to "appear" as admins for admin only menu items
+    // we need to add them as admin to a least one subcollection of the organization
+    // and then add that collection to isAdminCollections example:
+    // edgeGlobal.edgeState.isAdminCollections = [`${orgDocPath}-offices`]
     edgeGlobal.edgeState.isAdminCollections = [`organizations-${orgDocPath}`]
     menuBuilder()
 
@@ -108,7 +124,7 @@ const currentOrg = computed(() => edgeFirebase.data[`organizations/${edgeGlobal.
 
 watch (currentOrg, async () => {
   if (currentOrg.value) {
-    edgeGlobal.edgeState = subscribedStatus(currentOrg.value)
+    // edgeGlobal.edgeState = subscribedStatus(currentOrg.value)
   }
 }, { immediate: true }, { deep: true })
 
@@ -244,16 +260,12 @@ edgeGlobal.edgeState.menuItems = [
             :show-settings-section="false"
           >
             <template #header>
-              <SidebarMenu>
-                <SidebarMenuItem>
-                  <SidebarMenuButton style="padding-left: 4px !important;">
-                    <Package class="!h-6 !w-6" /> <span class="text-xl">{{ orgName }}</span>
-                  </SidebarMenuButton>
-                </SidebarMenuItem>
-              </SidebarMenu>
+              <div class="flex items-center justify-center w-full">
+                <img src="/images/logo-square.png" class="w-auto h-14" alt="Edge Logo">
+              </div>
             </template>
-            <template #footer="slotProps">
-              <Card v-if="slotProps.sideBarState === 'expanded'">
+            <template #footer>
+              <!-- <Card v-if="slotProps.sideBarState === 'expanded'">
                 <CardHeader class="p-2 pt-0 md:p-4">
                   <CardTitle>Upgrade to Pro</CardTitle>
                   <CardDescription>
@@ -266,7 +278,7 @@ edgeGlobal.edgeState.menuItems = [
                     Upgrade
                   </Button>
                 </CardContent>
-              </Card>
+              </Card> -->
             </template>
           </edge-side-bar>
         </div>
@@ -293,7 +305,7 @@ edgeGlobal.edgeState.menuItems = [
                     class="p-1"
                     @click="edgeGlobal.edgeState.sidebar.toggleSidebar"
                   >
-                    <MenuSquare />
+                    <Menu class="!w-[40px] !h-[40px]" />
                   </edge-shad-button>
                   <div id="page-header" />
                 </template>

package/pages/index.vue

@@ -0,0 +1,13 @@
+<script setup lang="js">
+const router = useRouter()
+onMounted(() => {
+  router.push('/app/')
+})
+</script>
+
+<template>
+  <div />
+</template>
+
+<style scoped>
+</style>

package/plugins/firebase.client.ts

@@ -12,5 +12,6 @@ export default defineNuxtPlugin((nuxtApp) => {
     emulatorAuth: import.meta.env.VITE_FIREBASE_EMULATOR_AUTH,
     emulatorFirestore: import.meta.env.VITE_FIREBASE_EMULATOR_FIRESTORE,
     emulatorFunctions: import.meta.env.VITE_FIREBASE_EMULATOR_FUNCTIONS,
+    emulatorStorage: import.meta.env.VITE_FIREBASE_EMULATOR_STORAGE,
   }, true, true)
 })

package/public/favicon/site.webmanifest

@@ -3,12 +3,12 @@
   "short_name": "FormFling",
   "icons": [
     {
-      "src": "/android-chrome-192x192.png",
+      "src": "/favicon/android-chrome-192x192.png",
       "sizes": "192x192",
       "type": "image/png"
     },
     {
-      "src": "/android-chrome-512x512.png",
+      "src": "/favicon/android-chrome-512x512.png",
       "sizes": "512x512",
       "type": "image/png"
     }