feat: changes to the note editor

.gitea/workflows/build-and-push.yml

@@ -1,52 +1,54 @@
 name: Build and Push App Image
 
 on:
-  push:
-    branches:
-      - main
-      - master
-    tags:
-      - "v*"
-  workflow_dispatch:
+    push:
+        branches:
+            - main
+            - master
+        tags:
+            - "v*"
+    workflow_dispatch:
 
 env:
-  # Example: registry.example.com/your-user/noteapp
-  IMAGE_NAME: ${{ secrets.REGISTRY_IMAGE }}
+    # Example: registry.example.com/your-user/noteapp
+    IMAGE_NAME: ${{ secrets.REGISTRY_IMAGE }}
 
 jobs:
-  build-and-push:
-    runs-on: ubuntu-latest
+    build-and-push:
+        runs-on: ubuntu-docker
+        container: docker:dind
+        steps:
+            - name: install nodejs
+              run: apk add --update nodejs npm
+            - name: Checkout
+              uses: actions/checkout@v4
+            - name: Set image tags
+              id: vars
+              shell: sh
+              run: |
+                  SHORT_SHA=$(printf '%s' "$GITHUB_SHA" | cut -c1-7)
+                  BRANCH=$(printf '%s' "$GITHUB_REF_NAME" | tr '/' '-')
 
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
+                  echo "short_sha=${SHORT_SHA}" >> "$GITHUB_OUTPUT"
+                  echo "branch=${BRANCH}" >> "$GITHUB_OUTPUT"
+            - name: Set up QEMU
+              uses: docker/setup-qemu-action@v2
+            - name: Login to Gitea Container Registry
+              uses: docker/login-action@v3
+              with:
+                  registry: ${{ secrets.REGISTRY_HOST }}
+                  username: ${{ secrets.REGISTRY_USERNAME }}
+                  password: ${{ secrets.REGISTRY_PASSWORD }}
 
-      - name: Set image tags
-        id: vars
-        shell: bash
-        run: |
-          SHORT_SHA="${GITHUB_SHA::7}"
-          BRANCH="${GITHUB_REF_NAME//\//-}"
-
-          echo "short_sha=${SHORT_SHA}" >> "$GITHUB_OUTPUT"
-          echo "branch=${BRANCH}" >> "$GITHUB_OUTPUT"
-
-      - name: Login to Gitea Container Registry
-        uses: docker/login-action@v3
-        with:
-          registry: ${{ secrets.REGISTRY_HOST }}
-          username: ${{ secrets.REGISTRY_USERNAME }}
-          password: ${{ secrets.REGISTRY_PASSWORD }}
-
-      - name: Build and push app image
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          file: ./devops/docker/Dockerfile
-          push: true
-          build-args: |
-            VITE_API_BASE_URL=${{ secrets.VITE_API_BASE_URL }}
-          tags: |
-            ${{ env.IMAGE_NAME }}:latest
-            ${{ env.IMAGE_NAME }}:${{ steps.vars.outputs.short_sha }}
-            ${{ env.IMAGE_NAME }}:${{ steps.vars.outputs.branch }}
+            - name: Build and push app image
+              uses: docker/build-push-action@v6
+              with:
+                  context: .
+                  file: ./devops/docker/Dockerfile
+                  push: true
+                  build-args: |
+                      VITE_API_BASE_URL=${{ secrets.VITE_API_BASE_URL }}
+                  tags: |
+                      ${{ env.IMAGE_NAME }}:latest
+                      ${{ env.IMAGE_NAME }}:${{ steps.vars.outputs.short_sha }}
+                      ${{ env.IMAGE_NAME }}:${{ steps.vars.outputs.branch }}

frontend/src/App.vue

@@ -342,10 +342,11 @@ const canManageSpaceSettings = computed(
         authStore.hasSpacePermission(currentSpace.value, "settings.member.view"),
 );
 
-const flattenCategories = (items, level = 0) =>
+const flattenCategories = (items, trail = []) =>
     items.flatMap((category) => {
-        const label = `${"  ".repeat(level)}${category.name}`;
-        return [{ id: category.id, name: category.name, label }, ...(category.subcategories?.length ? flattenCategories(category.subcategories, level + 1) : [])];
+        const nextTrail = [...trail, category.name];
+        const label = nextTrail.join("/");
+        return [{ id: category.id, name: category.name, label }, ...(category.subcategories?.length ? flattenCategories(category.subcategories, nextTrail) : [])];
     });
 
 const categoryOptions = computed(() => flattenCategories(categoryTree.value));

frontend/src/components/NoteEditor.vue

@@ -4,9 +4,6 @@
             <button class="btn btn-sm btn-primary" @click="saveNote">Save</button>
             <button v-if="canDelete" class="btn btn-sm btn-danger ms-2" @click="confirmDelete">Delete</button>
             <button class="btn btn-sm btn-outline-secondary ms-2" @click="emit('cancel')">Cancel</button>
-            <button class="btn btn-sm btn-secondary ms-2" @click="togglePreview">
-                {{ showPreview ? "Edit" : "Preview" }}
-            </button>
             <span class="save-status ms-auto" :class="saveState">{{ saveStatusLabel }}</span>
         </div>
 
@@ -19,11 +16,11 @@
             </div>
 
             <div class="row">
-                <div :class="{ 'col-md-6': showPreview, 'col-12': !showPreview }">
+                <div class="col-12 col-md-6">
                     <textarea v-model="editingNote.content" class="form-control editor-textarea" placeholder="Write your note in markdown..." @input="autoSave"></textarea>
                 </div>
 
-                <div v-if="showPreview" class="col-md-6">
+                <div class="col-12 col-md-6 mt-3 mt-md-0">
                     <div class="preview-pane border rounded p-3">
                         <div v-html="renderedMarkdown"></div>
                     </div>
@@ -101,7 +98,6 @@ const settingsStore = useSettingsStore();
 const publicSharingEnabled = ref(true);
 
 const editingNote = ref({ ...props.note });
-const showPreview = ref(false);
 const tagsInput = ref(props.note.tags?.join(", ") || "");
 const passwordAction = ref("keep");
 const notePassword = ref("");
@@ -201,10 +197,6 @@ const confirmDelete = () => {
     }
 };
 
-const togglePreview = () => {
-    showPreview.value = !showPreview.value;
-};
-
 onBeforeUnmount(() => {
     clearTimeout(saveTimeout.value);
     clearTimeout(saveStateTimeout.value);