Upload folder using huggingface_hub

client/app.css

@@ -461,13 +461,23 @@ textarea { resize: vertical; }
   border: 1px solid var(--border); border-radius: 12px; font-size: 13px;
 }
 #slug-legend .legend-title { color: var(--text-3); font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 8px; }
-#slug-legend .legend-row { display: flex; align-items: center; gap: 10px; padding: 2px 0; }
-#slug-legend .legend-row a { color: var(--text); text-decoration: none; }
-#slug-legend .legend-row a:hover { text-decoration: underline; }
-#slug-legend .arrow { color: var(--text-3); }
+#slug-legend table { border-collapse: collapse; width: 100%; }
+#slug-legend th { text-align: left; font-size: 11.5px; color: var(--text-3); font-weight: 600; padding: 4px 12px 4px 0; border-bottom: 1px solid var(--line); }
+#slug-legend td { padding: 5px 12px 5px 0; border-bottom: 1px solid var(--line); }
+#slug-legend tr:last-child td { border-bottom: none; }
+#slug-legend td a { color: var(--text); text-decoration: none; }
+#slug-legend td a:hover { text-decoration: underline; }
 #slug-legend code {
   background: rgba(0, 0, 0, 0.05); padding: 1px 7px; border-radius: 5px; cursor: pointer;
   font-size: 12px;
 }
 #slug-legend code:hover { background: rgba(29, 92, 69, 0.12); }
 #slug-legend code.copied { background: var(--accent-soft); color: var(--accent); }
+
+
+/* compact structure page: no phantom card height, hint above the field */
+.structure-mode #editor { min-height: 0; padding: 22px 28px; }
+#structure-hint {
+  margin-bottom: 12px; padding: 10px 14px; font-size: 12.5px; color: var(--text-2);
+  background: rgba(29, 92, 69, 0.05); border: 1px solid var(--line); border-radius: 10px;
+}

client/src/doc.js

@@ -203,6 +203,17 @@ async function initPage() {
     })
   }
 
+  document.getElementById('layout').classList.toggle('structure-mode', pageSlug === '_structure')
+  document.getElementById('structure-hint')?.remove()
+  if (pageSlug === '_structure') {
+    const hint = el(
+      'div',
+      { id: 'structure-hint' },
+      'This YAML is the page tree: one "- slug" line per page, indent two spaces to nest. Pages missing here show under "unfiled" — nothing is ever deleted by editing this. Changes can also be proposed as suggestions.'
+    )
+    document.getElementById('editor').before(hint)
+  }
+
   renderMargin(editor)
   setTimeout(() => updateTitle(editor), 600)
 }
@@ -440,27 +451,37 @@ function renderSlugLegend(s) {
     return
   }
   const box = existing || el('div', { id: 'slug-legend' })
-  box.replaceChildren(el('div', { class: 'legend-title' }, 'Pages on this project — use the slug in the structure above'))
+  const table = el('table', {})
+  const thead = el('thead', {})
+  const hr = el('tr', {})
+  hr.append(el('th', {}, 'Page'), el('th', {}, 'Slug (click to copy)'))
+  thead.appendChild(hr)
+  table.appendChild(thead)
+  const tbody = el('tbody', {})
   for (const [slug, title] of Object.entries(s.titles || {})) {
     if (slug === '_structure') continue
-    const row = el('div', { class: 'legend-row' })
+    const tr = el('tr', {})
+    const tdTitle = el('td', {})
     const a = el('a', { href: slug === 'home' ? `/d/${docId}` : `/d/${docId}/${slug}` }, title || slug)
     a.addEventListener('click', e => {
       if (e.metaKey || e.ctrlKey || e.button !== 0) return
       e.preventDefault()
       openPage(slug)
     })
-    row.appendChild(a)
-    row.appendChild(el('span', { class: 'arrow' }, '→'))
+    tdTitle.appendChild(a)
+    const tdSlug = el('td', {})
     const code = el('code', { title: 'Click to copy' }, slug)
     code.addEventListener('click', () => {
       navigator.clipboard?.writeText(slug)
       code.classList.add('copied')
       setTimeout(() => code.classList.remove('copied'), 800)
     })
-    row.appendChild(code)
-    box.appendChild(row)
+    tdSlug.appendChild(code)
+    tr.append(tdTitle, tdSlug)
+    tbody.appendChild(tr)
   }
+  table.appendChild(tbody)
+  box.replaceChildren(el('div', { class: 'legend-title' }, 'Pages in this project'), table)
   if (!existing) document.getElementById('editor').after(box)
 }
 
@@ -572,6 +593,11 @@ async function loadStructure() {
 }
 
 function updateTitle(editor) {
+  if (pageSlug === '_structure') {
+    document.getElementById('doc-title').textContent = 'Structure'
+    document.title = 'Structure'
+    return
+  }
   let title = 'Untitled'
   editor.state.doc.descendants(node => {
     if (title === 'Untitled' && node.isTextblock && node.textContent.trim()) {

server/collab.js

@@ -77,6 +77,24 @@ export const hocuspocus = new Hocuspocus({
         try {
           migrateLegacySuggestionAnchors(document)
         } catch {}
+        // structure pages are just the yaml field now — drop old heading/intro
+        try {
+          if (String(documentName).endsWith('::_structure') && !document.isDestroyed) {
+            const fragment = document.getXmlFragment(FIELD)
+            let hasCode = false
+            for (let i = 0; i < fragment.length; i++) {
+              if (fragment.get(i) instanceof Y.XmlElement && fragment.get(i).nodeName === 'codeBlock') hasCode = true
+            }
+            if (hasCode) {
+              document.transact(() => {
+                for (let i = fragment.length - 1; i >= 0; i--) {
+                  const el2 = fragment.get(i)
+                  if (!(el2 instanceof Y.XmlElement) || el2.nodeName !== 'codeBlock') fragment.delete(i, 1)
+                }
+              })
+            }
+          }
+        } catch {}
       }, 50)
     }
   },
@@ -791,21 +809,13 @@ export async function ensureStructurePage(projectId) {
   await withDoc(name, document => {
     const fragment = document.getXmlFragment(FIELD)
     if (fragment.length > 0) return
-    const h = new Y.XmlElement('heading')
-    h.setAttribute('level', 1)
-    const ht = new Y.XmlText()
-    ht.insert(0, 'Structure')
-    h.insert(0, [ht])
-    const intro = new Y.XmlElement('paragraph')
-    const it = new Y.XmlText()
-    it.insert(0, 'This page defines the sidebar tree: one "- slug" line per page, indent 2 spaces to nest. Pages missing here appear under "unfiled". Edit it directly or discuss changes as suggestions.')
-    intro.insert(0, [it])
+    // just the yaml field — the explanation lives in the page chrome
     const code = new Y.XmlElement('codeBlock')
     code.setAttribute('language', 'yaml')
     const ct = new Y.XmlText()
     ct.insert(0, defaultStructureYaml(slugs))
     code.insert(0, [ct])
-    fragment.insert(0, [h, intro, code])
+    fragment.insert(0, [code])
   })
   store.upsertPageMeta(projectId, '_structure', { title: 'Structure', createdAt: Date.now() })
   ensuredStructure.add(projectId)

server/playground.js

@@ -134,14 +134,7 @@ export async function seedPlayground(username, existingId = null) {
   await seedPage(id, home)
   await seedPage(docNameFor(id, 'notes'), NOTES_MD)
   store.upsertPageMeta(id, 'notes', { title: 'Notes', createdAt: Date.now() })
-  await seedPage(docNameFor(id, '_structure'), `# Structure
-
-This page defines the sidebar tree: one "- slug" line per page, indent 2 spaces to nest. Pages missing here appear under "unfiled". Edit it directly or discuss changes as suggestions.
-
-\`\`\`yaml
-- home
-- notes
-\`\`\``)
+  await seedPage(docNameFor(id, '_structure'), '```yaml\n- home\n- notes\n```')
   store.upsertPageMeta(id, '_structure', { title: 'Structure', createdAt: Date.now() })
 
   // block indices in HOME_MD (after image insertion): find dynamically