From 0376f18ca9b4ce6c494327e3972d273366ed5e85 Mon Sep 17 00:00:00 2001 From: Christopher Ng Date: Mon, 9 Sep 2024 16:11:43 -0700 Subject: fix(files): Render folders in natural sort order - Nodes are returned from the endpoint in an undefined order Signed-off-by: Christopher Ng --- apps/files/src/services/FolderTree.ts | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/apps/files/src/services/FolderTree.ts b/apps/files/src/services/FolderTree.ts index 8b156182f69..82f0fb392e5 100644 --- a/apps/files/src/services/FolderTree.ts +++ b/apps/files/src/services/FolderTree.ts @@ -11,16 +11,19 @@ import axios from '@nextcloud/axios' import { generateOcsUrl } from '@nextcloud/router' import { getCurrentUser } from '@nextcloud/auth' import { dirname, encodePath, joinPaths } from '@nextcloud/paths' +import { getCanonicalLocale, getLanguage } from '@nextcloud/l10n' import { getContents as getFiles } from './Files.ts' // eslint-disable-next-line no-use-before-define -type Tree = Array<{ +type Tree = TreeNodeData[] + +interface TreeNodeData { id: number, basename: string, displayName?: string, children: Tree, -}> +} export interface TreeNode { source: string, @@ -35,8 +38,19 @@ export const folderTreeId = 'folders' export const sourceRoot = `${davRemoteURL}/files/${getCurrentUser()?.uid}` +const collator = Intl.Collator( + [getLanguage(), getCanonicalLocale()], + { + numeric: true, + usage: 'sort', + }, +) + +const compareNodes = (a: TreeNodeData, b: TreeNodeData) => collator.compare(a.displayName ?? a.basename, b.displayName ?? b.basename) + const getTreeNodes = (tree: Tree, currentPath: string = '/', nodes: TreeNode[] = []): TreeNode[] => { - for (const { id, basename, displayName, children } of tree) { + const sortedTree = tree.toSorted(compareNodes) + for (const { id, basename, displayName, children } of sortedTree) { const path = joinPaths(currentPath, basename) const source = `${sourceRoot}${path}` const node: TreeNode = { -- cgit v1.2.3