Menus: added sort method + sort order items

src/components/App.tsx

@@ -79,6 +79,8 @@ const App = observer(() => {
             clipboardLength: appState.clipboard.files.length,
             activeViewId: activeView.viewId,
             viewMode: activeView.getVisibleCache().viewmode,
+            sortMethod: activeView.getVisibleCache().sortMethod,
+            sortOrder: activeView.getVisibleCache().sortOrder,
             // missing: about opened, tab: is it needed?
         }
     }, [appState])

src/components/dialogs/ShortcutsDialog.tsx

@@ -41,6 +41,16 @@ export const buildShortcuts = async (t: TFunction<'translation', undefined>): Pr
         [t('SHORTCUT.GROUP.ACTIVE_VIEW')]: [
             { combo: `mod + ${keyboardLayoutMap['Digit1']}`, label: t('SHORTCUT.ACTIVE_VIEW.ICON_MODE') },
             { combo: `mod + ${keyboardLayoutMap['Digit2']}`, label: t('SHORTCUT.ACTIVE_VIEW.TABLE_MODE') },
+            { combo: `mod + alt + ${keyboardLayoutMap['Digit1']}`, label: t('SHORTCUT.ACTIVE_VIEW.SORT_BY_NAME') },
+            { combo: `mod + alt + ${keyboardLayoutMap['Digit2']}`, label: t('SHORTCUT.ACTIVE_VIEW.SORT_BY_SIZE') },
+            {
+                combo: `mod + shift + alt + ${keyboardLayoutMap['Digit1']}`,
+                label: t('SHORTCUT.ACTIVE_VIEW.SORT_ORDER_DESCENDING'),
+            },
+            {
+                combo: `mod + shift + alt + ${keyboardLayoutMap['Digit2']}`,
+                label: t('SHORTCUT.ACTIVE_VIEW.SORT_ORDER_ASCENDING'),
+            },
             { combo: 'space', label: t('SHORTCUT.ACTIVE_VIEW.OPEN_PREVIEW') },
             { combo: (isMac && 'mod + left') || 'alt + left', label: t('SHORTCUT.ACTIVE_VIEW.BACKWARD_HISTORY') },
             { combo: (isMac && 'mod + right') || 'alt + right', label: t('SHORTCUT.ACTIVE_VIEW.FORWARD_HISTORY') },

src/components/shortcuts/MenuAccelerators.tsx

@@ -193,6 +193,26 @@ class MenuAcceleratorsClass extends React.Component<Props> {
         cache.viewmode !== 'details' && cache.setViewMode('details')
     }
 
+    onSortByName = (): void => {
+        const cache = this.getActiveFileCache()
+        cache.sortMethod !== 'name' && cache.setSort('name')
+    }
+
+    onSortBySize = (): void => {
+        const cache = this.getActiveFileCache()
+        cache.sortMethod !== 'size' && cache.setSort('size')
+    }
+
+    onSortOrderAsc = (): void => {
+        const cache = this.getActiveFileCache()
+        cache.sortOrder !== 'asc' && cache.setSort(cache.sortMethod, 'asc')
+    }
+
+    onSortOrderDesc = (): void => {
+        const cache = this.getActiveFileCache()
+        cache.sortOrder !== 'desc' && cache.setSort(cache.sortMethod, 'desc')
+    }
+
     renderMenuAccelerators(): React.ReactElement {
         return (
             <Accelerators>
@@ -215,6 +235,10 @@ class MenuAcceleratorsClass extends React.Component<Props> {
                 <Accelerator combo="rename" onClick={this.onRename}></Accelerator>
                 <Accelerator combo="CmdOrCtrl+1" onClick={this.onToggleIconViewMode}></Accelerator>
                 <Accelerator combo="CmdOrCtrl+2" onClick={this.onToggleTableViewMode}></Accelerator>
+                <Accelerator combo="CmdOrCtrl+Alt+1" onClick={this.onSortByName}></Accelerator>
+                <Accelerator combo="CmdOrCtrl+Alt+2" onClick={this.onSortBySize}></Accelerator>
+                <Accelerator combo="CmdOrCtrl+Shift+Alt+1" onClick={this.onSortOrderAsc}></Accelerator>
+                <Accelerator combo="CmdOrCtrl+Shift+Alt+2" onClick={this.onSortOrderDesc}></Accelerator>
             </Accelerators>
         )
     }

src/electron/appMenus.ts

@@ -95,11 +95,15 @@ export class AppMenu {
         filesLength,
         status,
         viewMode,
+        sortMethod,
+        sortOrder,
     }: ReactiveProperties): MenuItemConstructorOptions[] {
         const menuStrings = this.menuStrings
         const explorerWithoutOverlay = !isOverlayOpen && isExplorer
         const explorerWithoutOverlayCanWrite = explorerWithoutOverlay && !isReadonly && status === 'ok'
         const isIconViewMode = viewMode === 'icons'
+        const isSortByName = sortMethod === 'name'
+        const isSortAscending = sortOrder === 'asc'
 
         let windowMenuIndex = 4
 
@@ -215,6 +219,45 @@ export class AppMenu {
                         checked: !isIconViewMode,
                     },
                     { type: 'separator' },
+                    {
+                        label: menuStrings['SORT_BY'],
+                        enabled: explorerWithoutOverlay,
+                        submenu: [
+                            {
+                                label: menuStrings['SORT_BY_NAME'],
+                                type: 'radio',
+                                accelerator: 'CmdOrCtrl+Alt+1',
+                                click: this.sendComboEvent,
+                                enabled: explorerWithoutOverlay,
+                                checked: isSortByName,
+                            },
+                            {
+                                label: menuStrings['SORT_BY_SIZE'],
+                                type: 'radio',
+                                accelerator: 'CmdOrCtrl+Alt+2',
+                                click: this.sendComboEvent,
+                                enabled: explorerWithoutOverlay,
+                                checked: !isSortByName,
+                            },
+                            { type: 'separator' },
+                            {
+                                label: menuStrings['SORT_ASCENDING'],
+                                type: 'checkbox',
+                                click: this.sendComboEvent,
+                                accelerator: 'CmdOrCtrl+Shift+Alt+1',
+                                enabled: explorerWithoutOverlay,
+                                checked: isSortAscending,
+                            },
+                            {
+                                label: menuStrings['SORT_DESCENDING'],
+                                type: 'checkbox',
+                                click: this.sendComboEvent,
+                                accelerator: 'CmdOrCtrl+Shift+Alt+2',
+                                enabled: explorerWithoutOverlay,
+                                checked: !isSortAscending,
+                            },
+                        ],
+                    },
                     {
                         label: menuStrings['TOGGLE_SPLITVIEW'],
                         accelerator: 'CmdOrCtrl+Shift+Alt+V',

src/locale/lang/en.json

@@ -98,6 +98,10 @@
             "ACTIVE_VIEW": {
                 "TABLE_MODE": "Table view",
                 "ICON_MODE": "Icons view",
+                "SORT_BY_NAME": "Sort by Name",
+                "SORT_BY_SIZE": "Sort by Size",
+                "SORT_ORDER_ASCENDING": "Ascending Order",
+                "SORT_ORDER_DESCENDING": "Descending Order",
                 "COPY": "Copy selected items to clipboard",
                 "PASTE": "Paste selected items into current folder",
                 "VIEW_HISTORY": "Show nav history (debug)",
@@ -136,7 +140,7 @@
             "ICON_VIEW": "Icons",
             "DETAILS_VIEW": "Details",
             "CHANGE_VIEW": "Change display mode",
-            "CHANGE_SORT_METHOD": "Change files sort order"
+            "CHANGE_SORT_METHOD": "Change files sort method"
         },
         "COMMON": {
             "SIZE": {
@@ -270,7 +274,12 @@
             "GO_FORWARD": "Forward",
             "TOGGLE_HIDDEN_FILES": "Show/Hide Hidden Files",
             "TOGGLE_ICONVIEW_MODE": "as Icons",
-            "TOGGLE_TABLEVIEW_MODE": "as List"
+            "TOGGLE_TABLEVIEW_MODE": "as List",
+            "SORT_BY": "Sort By",
+            "SORT_BY_NAME": "Name",
+            "SORT_BY_SIZE": "Size",
+            "SORT_ASCENDING": "Ascending",
+            "SORT_DESCENDING": "Descending"
         }
     }
 }

src/locale/lang/fr.json

@@ -98,6 +98,10 @@
             "ACTIVE_VIEW": {
                 "TABLE_MODE": "Vue liste",
                 "ICON_MODE": "Vue icônes",
+                "SORT_BY_NAME": "Trier par Nom",
+                "SORT_BY_SIZE": "Trier par Taille",
+                "SORT_ORDER_ASCENDING": "Croissant",
+                "SORT_ORDER_DESCENDING": "Décroissant",
                 "COPY": "Copier les éléments sélectionnés dans le presse-papier",
                 "PASTE": "Coller les éléments sélectionnés dans le presse-papier",
                 "VIEW_HISTORY": "Afficher l'historique de navigation (debug)",
@@ -270,7 +274,12 @@
             "GO_FORWARD": "Suivant",
             "TOGGLE_HIDDEN_FILES": "Voir/Cacher Fichiers Cachés",
             "TOGGLE_ICONVIEW_MODE": "Par icônes",
-            "TOGGLE_TABLEVIEW_MODE": "Par liste"
+            "TOGGLE_TABLEVIEW_MODE": "Par liste",
+            "SORT_BY": "Trier par",
+            "SORT_BY_NAME": "Nom",
+            "SORT_BY_SIZE": "Taille",
+            "SORT_ASCENDING": "Croissant",
+            "SORT_DESCENDING": "Décroissant"
         }
     }
 }

src/types/index.ts

@@ -1,5 +1,6 @@
 import { ViewModeName } from '$src/hooks/useViewMode'
 import { FileDescriptor } from '$src/services/Fs'
+import { TSORT_METHOD_NAME, TSORT_ORDER } from '$src/services/FsSort'
 import { FileState, TStatus } from '$src/state/fileState'
 import { IconName } from '@blueprintjs/icons'
 import { IpcRendererEvent } from 'electron/renderer'
@@ -51,6 +52,8 @@ export interface ReactiveProperties {
     status: TStatus
     language: string
     viewMode: ViewModeName
+    sortMethod: TSORT_METHOD_NAME
+    sortOrder: TSORT_ORDER
 }
 
 export type KeyboardLayoutMap = Record<string, string>