frontend/options: sort/numeric names
Massimo Melina committed
Feb 17, 2023 at 17:28 UTC
146ff285bae2dc6b790f7ea7050d1df21e1b56d2
3 files changed
+14
-4
frontend/src/options.ts
+6
@@ -43,6 +43,12 @@ export function showOptions (){
43
state.foldersFirst = v
44
}
45
}, "Folders first"),
46
+ h(Checkbox, {
47
+ value: snap.sortNumerics,
48
+ onChange(v) {
49
+ state.sortNumerics = v
50
+ }
51
+ }, "Numeric names"),
52
53
h(Select, {
54
options: ['', 'light', 'dark'].map(s => ({ label: "theme: " + (s || "auto"), value: s })),
frontend/src/state.ts
+3
-1
@@ -23,6 +23,7 @@ export const state = proxy<{
23
sortBy: string,
24
invertOrder: boolean,
25
foldersFirst: boolean,
26
+ sortNumerics: boolean,
27
theme: string,
28
adminUrl?: string,
29
serverConfig?: any,
@@ -46,6 +47,7 @@ export const state = proxy<{
47
sortBy: 'name',
48
invertOrder: false,
49
foldersFirst: true,
50
+ sortNumerics: false,
51
theme: '',
52
})
53
@@ -54,7 +56,7 @@ export function useSnapState() {
56
}
57
58
const SETTINGS_KEY = 'hfs_settings'
57
-const SETTINGS_TO_STORE: (keyof typeof state)[] = ['sortBy', 'invertOrder', 'foldersFirst', 'theme']
59
+const SETTINGS_TO_STORE: (keyof typeof state)[] = ['sortBy', 'sortNumerics', 'invertOrder', 'foldersFirst', 'theme']
60
61
loadSettings()
62
for (const k of SETTINGS_TO_STORE)
frontend/src/useFetchList.ts
+5
-3
@@ -111,7 +111,7 @@ export function reloadList() {
111
const { compare:localCompare } = new Intl.Collator(navigator.language)
112
113
function sort(list: DirList) {
114
- const { sortBy, foldersFirst } = state
114
+ const { sortBy, foldersFirst, sortNumerics } = state
115
// optimization: precalculate string comparisons
116
const bySize = sortBy === 'size'
117
const byExt = sortBy === 'extension'
@@ -119,12 +119,13 @@ function sort(list: DirList) {
119
const invert = state.invertOrder ? -1 : 1
120
return list.sort((a,b) =>
121
foldersFirst && -compare(a.isFolder, b.isFolder)
122
- || invert*(bySize ? compare(a.s||0, b.s||0)
122
+ || invert * (bySize ? compare(a.s||0, b.s||0)
123
: byExt ? localCompare(a.ext, b.ext)
124
: byTime ? compare(a.t, b.t)
125
: 0
126
)
127
- || invert*localCompare(a.n, b.n) // fallback to name/path
127
+ || sortNumerics && (invert * compare(parseFloat(a.n), parseFloat(b.n)))
128
+ || invert * localCompare(a.n, b.n) // fallback to name/path
129
)
130
}
131
@@ -148,6 +149,7 @@ const sortAgain = _.debounce(()=> state.list = sort(state.list), 100)
149
subscribeKey(state, 'sortBy', sortAgain)
150
subscribeKey(state, 'invertOrder', sortAgain)
151
subscribeKey(state, 'foldersFirst', sortAgain)
152
+subscribeKey(state, 'sortNumerics', sortAgain)
153
154
subscribeKey(state, 'patternFilter', v => {
155
if (!v)