@edgedev/create-edge-app 1.1.29 → 1.2.29

package/edge/components/cms/menu.vue

@@ -382,12 +382,82 @@ const resolveBlockForPreview = (block) => {
   return null
 }
 
-const templateHasBlocks = template => Array.isArray(template?.content) && template.content.length > 0
+const normalizePreviewColumns = (row) => {
+  if (!Array.isArray(row?.columns) || !row.columns.length)
+    return []
+  return row.columns.map((column, idx) => ({
+    id: column?.id || `${row?.id || 'row'}-col-${idx}`,
+    span: Number(column?.span) || null,
+    blocks: Array.isArray(column?.blocks) ? column.blocks.filter(Boolean) : [],
+  }))
+}
+
+const templatePreviewRows = (template) => {
+  const structureRows = Array.isArray(template?.structure) ? template.structure : []
+  if (structureRows.length) {
+    return structureRows
+      .map((row, rowIndex) => ({
+        id: row?.id || `${template?.docId || 'template'}-row-${rowIndex}`,
+        columns: normalizePreviewColumns(row),
+      }))
+      .filter(row => row.columns.length > 0)
+  }
 
-const templatePreviewBlocks = (template) => {
-  if (!templateHasBlocks(template))
+  const legacyBlocks = Array.isArray(template?.content) ? template.content.filter(Boolean) : []
+  if (!legacyBlocks.length)
     return []
-  return template.content
+  return [{
+    id: `${template?.docId || 'template'}-legacy-row`,
+    columns: [{
+      id: `${template?.docId || 'template'}-legacy-col`,
+      span: null,
+      blocks: legacyBlocks,
+    }],
+  }]
+}
+
+const templateHasPreview = template => templatePreviewRows(template).length > 0
+
+const resolveTemplateBlockSource = (template, blockRef) => {
+  if (!blockRef)
+    return null
+  if (typeof blockRef === 'object')
+    return blockRef
+  const lookupId = String(blockRef).trim()
+  if (!lookupId)
+    return null
+  const templateBlocks = Array.isArray(template?.content) ? template.content : []
+  return templateBlocks.find(block => block?.id === lookupId || block?.blockId === lookupId) || null
+}
+
+const resolveTemplateBlockForPreview = (template, blockRef) => {
+  const source = resolveTemplateBlockSource(template, blockRef)
+  return resolveBlockForPreview(source)
+}
+
+const hasPreviewSpans = row => (row?.columns || []).some(column => Number.isFinite(Number(column?.span)))
+
+const previewGridClass = (row) => {
+  if (hasPreviewSpans(row))
+    return 'grid grid-cols-1 sm:grid-cols-6 gap-4'
+  const count = row?.columns?.length || 1
+  const map = {
+    1: 'grid grid-cols-1 gap-4',
+    2: 'grid grid-cols-1 sm:grid-cols-2 gap-4',
+    3: 'grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4',
+    4: 'grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4',
+    5: 'grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-5 gap-4',
+    6: 'grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-6 gap-4',
+  }
+  return map[count] || map[1]
+}
+
+const previewColumnStyle = (column) => {
+  const span = Number(column?.span)
+  if (!Number.isFinite(span))
+    return {}
+  const safeSpan = Math.min(Math.max(span, 1), 6)
+  return { gridColumn: `span ${safeSpan} / span ${safeSpan}` }
 }
 
 const renameFolderOrPageShow = (item) => {
@@ -1155,19 +1225,34 @@ const theme = computed(() => {
                           Blank page
                         </div>
                       </template>
-                      <template v-else-if="templateHasBlocks(template)">
+                      <template v-else-if="templateHasPreview(template)">
                         <div
-                          v-for="(block, idx) in templatePreviewBlocks(template)"
-                          :key="`${template.docId}-block-${idx}`"
+                          v-for="(row, rowIndex) in templatePreviewRows(template)"
+                          :key="`${template.docId}-row-${row.id || rowIndex}`"
+                          class="w-full"
                         >
-                          <edge-cms-block-api
-                            v-if="resolveBlockForPreview(block)"
-                            :content="resolveBlockForPreview(block).content"
-                            :values="resolveBlockForPreview(block).values"
-                            :meta="resolveBlockForPreview(block).meta"
-                            :theme="theme"
-                            :isolated="true"
-                          />
+                          <div :class="previewGridClass(row)">
+                            <div
+                              v-for="(column, colIndex) in row.columns"
+                              :key="`${template.docId}-row-${row.id || rowIndex}-col-${column.id || colIndex}`"
+                              class="min-w-0"
+                              :style="previewColumnStyle(column)"
+                            >
+                              <div
+                                v-for="(blockRef, blockIdx) in column.blocks || []"
+                                :key="`${template.docId}-row-${row.id || rowIndex}-col-${column.id || colIndex}-block-${blockIdx}`"
+                              >
+                                <edge-cms-block-api
+                                  v-if="resolveTemplateBlockForPreview(template, blockRef)"
+                                  :content="resolveTemplateBlockForPreview(template, blockRef).content"
+                                  :values="resolveTemplateBlockForPreview(template, blockRef).values"
+                                  :meta="resolveTemplateBlockForPreview(template, blockRef).meta"
+                                  :theme="theme"
+                                  :isolated="true"
+                                />
+                              </div>
+                            </div>
+                          </div>
                         </div>
                       </template>
                       <template v-else>

package/edge/components/cms/site.vue

@@ -14,6 +14,11 @@ const props = defineProps({
     required: false,
     default: '',
   },
+  disableAddSiteForNonAdmin: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 const edgeFirebase = inject('edgeFirebase')
 const { createDefaults: createSiteSettingsDefaults, createNewDocSchema: createSiteSettingsNewDocSchema } = useSiteSettingsTemplate()
@@ -137,6 +142,17 @@ const schemas = {
 const isAdmin = computed(() => {
   return edgeGlobal.isAdminGlobal(edgeFirebase).value
 })
+const currentOrgRoleName = computed(() => {
+  return String(edgeGlobal.getRoleName(edgeFirebase?.user?.roles || [], edgeGlobal.edgeState.currentOrganization) || '').toLowerCase()
+})
+const isOrgAdmin = computed(() => {
+  return currentOrgRoleName.value === 'admin'
+})
+const canCreateSite = computed(() => {
+  if (!props.disableAddSiteForNonAdmin)
+    return true
+  return isOrgAdmin.value
+})
 
 const siteData = computed(() => {
   return edgeFirebase.data?.[`${edgeGlobal.edgeState.organizationDocPath}/sites`]?.[props.site] || {}
@@ -362,6 +378,65 @@ const userOptions = computed(() => {
     }))
     .sort((a, b) => a.label.localeCompare(b.label))
 })
+const authUid = computed(() => String(edgeFirebase?.user?.uid || '').trim())
+const currentOrgUser = computed(() => {
+  if (!authUid.value)
+    return null
+  const users = Object.values(orgUsers.value || {})
+  return users.find((user) => {
+    const userId = String(user?.userId || '').trim()
+    const docId = String(user?.docId || '').trim()
+    const uid = String(user?.uid || '').trim()
+    return userId === authUid.value || docId === authUid.value || uid === authUid.value
+  }) || null
+})
+const currentOrgUserId = computed(() => {
+  return String(
+    currentOrgUser.value?.userId
+    || currentOrgUser.value?.docId
+    || authUid.value
+    || '',
+  ).trim()
+})
+const currentUserOption = computed(() => {
+  if (!currentOrgUserId.value)
+    return null
+  return {
+    value: currentOrgUserId.value,
+    label: currentOrgUser.value?.meta?.name || currentOrgUser.value?.meta?.email || currentOrgUserId.value,
+  }
+})
+const shouldForceCurrentUserForNewSite = computed(() => !isAdmin.value && props.site === 'new')
+const aiUserOptions = computed(() => {
+  if (!shouldForceCurrentUserForNewSite.value)
+    return userOptions.value
+  return currentUserOption.value ? [currentUserOption.value] : []
+})
+const normalizeUserIds = items => (Array.isArray(items) ? items : [])
+  .map(item => String(item || '').trim())
+  .filter(Boolean)
+const getSiteUsersModel = (workingDoc) => {
+  if (!workingDoc || typeof workingDoc !== 'object')
+    return []
+  const users = normalizeUserIds(workingDoc?.users)
+  if (!shouldForceCurrentUserForNewSite.value)
+    return users
+  if (!currentOrgUserId.value)
+    return users
+  if (users.length === 1 && users[0] === currentOrgUserId.value)
+    return users
+  workingDoc.users = [currentOrgUserId.value]
+  return workingDoc.users
+}
+const updateSiteUsersModel = (workingDoc, value) => {
+  if (!workingDoc || typeof workingDoc !== 'object')
+    return
+  if (shouldForceCurrentUserForNewSite.value) {
+    workingDoc.users = currentOrgUserId.value ? [currentOrgUserId.value] : []
+    return
+  }
+  workingDoc.users = normalizeUserIds(value)
+}
 
 const themeItemsForAllowed = (allowed, current) => {
   const base = themeOptions.value
@@ -1133,7 +1208,7 @@ const pageSettingsUpdated = async (pageData) => {
     v-if="edgeGlobal.edgeState.organizationDocPath"
   >
     <edge-editor
-      v-if="!props.page && props.site === 'new'"
+      v-if="!props.page && props.site === 'new' && canCreateSite"
       collection="sites"
       :doc-id="props.site"
       :schema="schemas.sites"
@@ -1215,7 +1290,8 @@ const pageSettingsUpdated = async (pageData) => {
           />
           <edge-shad-select-tags
             v-if="Object.keys(orgUsers).length > 0"
-            v-model="slotProps.workingDoc.users" :disabled="!edgeGlobal.isAdminGlobal(edgeFirebase).value"
+            :model-value="getSiteUsersModel(slotProps.workingDoc)"
+            :disabled="shouldForceCurrentUserForNewSite || !edgeGlobal.isAdminGlobal(edgeFirebase).value"
             :items="userOptions"
             name="users"
             label="Users"
@@ -1224,6 +1300,7 @@ const pageSettingsUpdated = async (pageData) => {
             placeholder="Select users"
             class="w-full"
             :multiple="true"
+            @update:model-value="value => updateSiteUsersModel(slotProps.workingDoc, value)"
           />
           <div class="rounded-lg border border-dashed border-slate-200 p-4 ">
             <div class="flex items-start justify-between gap-3">
@@ -1248,7 +1325,7 @@ const pageSettingsUpdated = async (pageData) => {
                 label="User Data for AI to use to build initial site"
                 placeholder="- select one -"
                 class="w-full"
-                :items="userOptions"
+                :items="aiUserOptions"
                 item-title="label"
                 item-value="value"
                 @update:model-value="value => (slotProps.workingDoc.aiAgentUserId = value || '')"
@@ -1265,6 +1342,9 @@ const pageSettingsUpdated = async (pageData) => {
         </div>
       </template>
     </edge-editor>
+    <div v-else-if="!props.page && props.site === 'new' && !canCreateSite" class="p-6 text-sm text-red-600">
+      Only organization admins can create sites.
+    </div>
     <div v-else class="flex flex-col h-[calc(100vh-58px)] overflow-hidden">
       <div class="grid grid-cols-[1fr_auto_1fr] items-center gap-3 px-4 py-2 border-b bg-secondary">
         <div class="flex items-center gap-3">

package/edge/components/cms/themeEditor.vue

@@ -132,7 +132,10 @@ watch(headObject, (newHeadElements) => {
 }, { immediate: true, deep: true })
 
 const sites = computed(() => {
-  return Object.values(edgeFirebase.data?.[`${edgeGlobal.edgeState.organizationDocPath}/sites`] || {})
+  const sitesMap = edgeFirebase.data?.[`${edgeGlobal.edgeState.organizationDocPath}/sites`] || {}
+  return Object.entries(sitesMap)
+    .map(([docId, data]) => ({ docId, ...(data || {}) }))
+    .filter(site => site.docId && site.docId !== 'templates')
 })
 
 const templatePages = computed(() => {
@@ -324,9 +327,12 @@ const templatePageOptions = computed(() => {
 
 watch (sites, async (newSites) => {
   state.loading = true
-  if (!edgeGlobal.edgeState.blockEditorSite && newSites.length > 0) {
+  const selectedSite = String(edgeGlobal.edgeState.blockEditorSite || '').trim()
+  const hasSelectedSite = newSites.some(site => site.docId === selectedSite)
+  if ((!selectedSite || !hasSelectedSite) && newSites.length > 0)
     edgeGlobal.edgeState.blockEditorSite = newSites[0].docId
-  }
+  else if (!newSites.length)
+    edgeGlobal.edgeState.blockEditorSite = ''
   await nextTick()
   state.loading = false
 }, { immediate: true, deep: true })

package/edge/components/dashboard.vue

@@ -170,6 +170,20 @@ const getByPath = (obj, path) => {
   }, obj)
 }
 
+const normalizeCollectionItems = (collectionMap = {}) => {
+  const items = Object.entries(collectionMap).map(([docId, data]) => {
+    const source = (data && typeof data === 'object') ? data : {}
+    return {
+      ...source,
+      docId: String(source.docId || docId || ''),
+    }
+  })
+  if (props.collection === 'sites') {
+    return items.filter(item => item.docId !== 'templates')
+  }
+  return items
+}
+
 const snapShotQuery = computed(() => {
   if (state.queryField && state.queryValue) {
     // console.log('snapShotQuery', state.queryField, state.queryOperator, state.queryValue)
@@ -232,7 +246,10 @@ const allData = computed(() => {
     if (!edgeFirebase.data?.[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`]) {
       return []
     }
-    return Object.values(edgeFirebase.data[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`])
+    return normalizeCollectionItems(edgeFirebase.data[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`])
+  }
+  if (props.collection === 'sites') {
+    return state.paginatedResults.filter(item => String(item?.docId || '') !== 'templates')
   }
   return state.paginatedResults
 })
@@ -243,10 +260,12 @@ const filtered = computed(() => {
     if (!edgeFirebase.data?.[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`]) {
       return []
     }
-    allData = Object.values(edgeFirebase.data[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`])
+    allData = normalizeCollectionItems(edgeFirebase.data[`${edgeGlobal.edgeState.organizationDocPath}/${props.collection}`])
   }
   else {
-    allData = state.paginatedResults
+    allData = props.collection === 'sites'
+      ? state.paginatedResults.filter(item => String(item?.docId || '') !== 'templates')
+      : state.paginatedResults
   }
 
   const qRaw = filterText.value