Merge pull request #669 from danactive/isr

Admin > Walk: Show score + Improve perf

Author: danactive

__tests__/view/[gallery]/all.e2e.spec.ts

@@ -19,7 +19,7 @@ test.describe('All album', () => {
 
 test.describe('Admin > Walk', () => {
   test('Filesystem list', async ({ page }) => {
-    await page.goto('/admin/walk?path=/galleries/demo/media')
+    await page.goto('/admin/walk/galleries/demo/media')
     await expect(page.locator('li').filter({ hasText: 'photos' })).toBeVisible()
     await expect(page.locator('li').filter({ hasText: 'thumbs' })).toBeVisible()
     await expect(page.locator('li').filter({ hasText: 'videos' })).toBeVisible()

app/[gallery]/page.tsx

@@ -1,6 +1,6 @@
+import type { Metadata } from 'next'
 import { Suspense } from 'react'
 
-import type { Metadata } from 'next'
 import GalleryPageComponent from '../../src/components/GalleryPage'
 import getAlbums from '../../src/lib/albums'
 import getGalleries from '../../src/lib/galleries'

app/admin/walk/[...path]/page.tsx

@@ -0,0 +1,45 @@
+import type { Metadata } from 'next'
+
+import WalkClient from '../../../../src/components/Walk/WalkClient'
+import getFilesystems from '../../../../src/lib/filesystems'
+
+export const metadata: Metadata = {
+  title: 'Admin > Walk - History App',
+}
+
+export const dynamicParams = false
+
+export async function generateStaticParams() {
+  const allPaths = await getAllFolderPaths()
+  return allPaths.map(path => ({
+    path: path.split('/').filter(Boolean), // split into array, remove empty for catch-all segments
+  }))
+}
+
+async function getAllFolderPaths(path = '/') {
+  const { files } = await getFilesystems(path)
+  let paths: string[] = []
+  for (const file of files) {
+    if (file.mediumType === 'folder') {
+      const folderPath = path === '/' ? file.name : `${path}/${file.name}`
+      paths.push(folderPath)
+      // Recursively collect subfolders
+      const subPaths = await getAllFolderPaths(folderPath)
+      paths = paths.concat(subPaths)
+    }
+  }
+  return paths
+}
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ path?: string[] }>
+}) {
+  const { path: nextRoutePath = [] } = await params
+  const path = nextRoutePath.join('/')
+  const fsPath = path ? `/${path}` : '/'
+  const { files } = await getFilesystems(fsPath)
+
+  return <WalkClient files={files} />
+}

app/admin/walk/page.tsx

@@ -1,16 +1,13 @@
-import { Suspense } from 'react'
 import type { Metadata } from 'next'
 
 import WalkClient from '../../../src/components/Walk/WalkClient'
+import getFilesystems from '../../../src/lib/filesystems'
 
 export const metadata: Metadata = {
   title: 'Admin > Walk - History App',
 }
 
-export default function WalkServer() {
-  return (
-    <Suspense fallback={<div>Loading...</div>}>
-      <WalkClient />
-    </Suspense>
-  )
+export default async function Page() {
+  const { files } = await getFilesystems('/')
+  return <WalkClient files={files} />
 }