frontend/src/components/gallery/GalleryGrid.vue

@@ -15,6 +15,19 @@
       </div>
     </template>
 
+    <!-- Similar-mode (and any non-date-grouped result set) returns no date
+         groups — the results are ranked, not chronological. Render them as a
+         single flat list in their given order rather than nothing. -->
+    <div
+      v-if="!store.dateGroups.length && store.images.length"
+      class="fc-gallery-grid__items"
+    >
+      <GalleryItem
+        v-for="img in store.images"
+        :key="img.id" :image="img" @open="$emit('open', img.id)"
+      />
+    </div>
+
     <div v-if="store.loading" class="fc-gallery-grid__sentinel">
       <v-progress-circular indeterminate color="accent" size="28" />
     </div>

frontend/test/components/galleryGrid.spec.js

@@ -0,0 +1,47 @@
+// @vitest-environment happy-dom
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+
+import GalleryGrid from '../../src/components/gallery/GalleryGrid.vue'
+import { useGalleryStore } from '../../src/stores/gallery.js'
+import { freshPinia } from '../support/mountComponent.js'
+
+const GIStub = { name: 'GalleryItem', props: ['image'], template: '<div class="gi" />' }
+
+function mountGrid(pinia) {
+  return mount(GalleryGrid, {
+    global: {
+      plugins: [pinia],
+      stubs: { GalleryItem: GIStub, RouterLink: { template: '<a><slot /></a>' } },
+    },
+  })
+}
+
+describe('GalleryGrid', () => {
+  it('renders a flat ranked list when there are no date groups (similar mode)', () => {
+    const pinia = freshPinia()
+    const store = useGalleryStore()
+    // similar-mode shape: images present, date_groups empty, no cursor.
+    store.images = [
+      { id: 1, thumbnail_url: '/a' },
+      { id: 2, thumbnail_url: '/b' },
+      { id: 3, thumbnail_url: '/c' },
+    ]
+    store.dateGroups = []
+    const w = mountGrid(pinia)
+    expect(w.findAll('.gi').length).toBe(3)
+  })
+
+  it('renders grouped by date when date groups are present', () => {
+    const pinia = freshPinia()
+    const store = useGalleryStore()
+    store.images = [
+      { id: 1, thumbnail_url: '/a' },
+      { id: 2, thumbnail_url: '/b' },
+    ]
+    store.dateGroups = [{ year: 2026, month: 6, image_ids: [1, 2] }]
+    const w = mountGrid(pinia)
+    expect(w.find('.fc-gallery-grid__date-header').exists()).toBe(true)
+    expect(w.findAll('.gi').length).toBe(2)
+  })
+})