diff --git a/src/component/FileManager/PathSelector.js b/src/component/FileManager/PathSelector.js
index d9d998e..595681d 100644
--- a/src/component/FileManager/PathSelector.js
+++ b/src/component/FileManager/PathSelector.js
@@ -15,11 +15,10 @@ import {
     MenuList,
     withStyles,
 } from "@material-ui/core";
-import Sort from './Sort';
+import Sort, { sortMethodFuncs } from './Sort';
 import API from "../../middleware/Api";
 import { toggleSnackbar } from "../../redux/explorer";
 import { withTranslation } from "react-i18next";
-import { sortMethodFuncs } from "../../redux/explorer/action";
 
 const mapStateToProps = (state) => {
     return {
diff --git a/src/component/FileManager/Sort.tsx b/src/component/FileManager/Sort.tsx
index 27f5331..017687d 100644
--- a/src/component/FileManager/Sort.tsx
+++ b/src/component/FileManager/Sort.tsx
@@ -2,27 +2,20 @@ import React, { MouseEventHandler, useState } from "react";
 import { IconButton, Menu, MenuItem } from "@material-ui/core";
 import TextTotateVerticalIcon from "@material-ui/icons/TextRotateVertical";
 import { useTranslation } from "react-i18next";
+import { CloudreveFile, SortMethod } from "./../../types/index";
 
-enum SORT_TYPE {
-    namePos = "namePos",
-    nameRev = "nameRev",
-    timePos = "timePos",
-    timeRev = "timeRev",
-    modifyTimePos = "modifyTimePos",
-    modifyTimeRev = "modifyTimeRev",
-    sizePos = "sizePos",
-    sizeRes = "sizeRes",
-}
-
-const SORT_OPTIONS = [
-    { value: SORT_TYPE.namePos, label: "A-Z" },
-    { value: SORT_TYPE.nameRev, label: "Z-A" },
-    { value: SORT_TYPE.timePos, label: "oldestUploaded" },
-    { value: SORT_TYPE.timeRev, label: "newestUploaded" },
-    { value: SORT_TYPE.modifyTimePos, label: "oldestModified" },
-    { value: SORT_TYPE.modifyTimeRev, label: "newestModified" },
-    { value: SORT_TYPE.sizePos, label: "smallest" },
-    { value: SORT_TYPE.sizeRes, label: "largest" },
+const SORT_OPTIONS: {
+    value: SortMethod;
+    label: string;
+}[] = [
+    { value: "namePos", label: "A-Z" },
+    { value: "nameRev", label: "Z-A" },
+    { value: "timePos", label: "oldestUploaded" },
+    { value: "timeRev", label: "newestUploaded" },
+    { value: "modifyTimePos", label: "oldestModified" },
+    { value: "modifyTimeRev", label: "newestModified" },
+    { value: "sizePos", label: "smallest" },
+    { value: "sizeRes", label: "largest" },
 ]
 
 export default function Sort({ value, onChange, isSmall, inherit, className }) {
@@ -33,8 +26,8 @@ export default function Sort({ value, onChange, isSmall, inherit, className }) {
         setAnchorSort(e.currentTarget);
     }
     
-    const [sortBy, setSortBy] = useState<SORT_TYPE>(value in SORT_TYPE ? value : '')
-    function onChangeSort(value: SORT_TYPE) {
+    const [sortBy, setSortBy] = useState<SortMethod>(value || '')
+    function onChangeSort(value: SortMethod) {
         setSortBy(value)
         onChange(value)
         setAnchorSort(null);
@@ -72,3 +65,41 @@ export default function Sort({ value, onChange, isSmall, inherit, className }) {
         </>
     )
 }
+
+
+type SortFunc = (a: CloudreveFile, b: CloudreveFile) => number;
+
+export const sortMethodFuncs: Record<SortMethod, SortFunc> = {
+    sizePos: (a: CloudreveFile, b: CloudreveFile) => {
+        return a.size - b.size;
+    },
+    sizeRes: (a: CloudreveFile, b: CloudreveFile) => {
+        return b.size - a.size;
+    },
+    namePos: (a: CloudreveFile, b: CloudreveFile) => {
+        return a.name.localeCompare(
+            b.name,
+            navigator.languages[0] || navigator.language,
+            { numeric: true, ignorePunctuation: true }
+        );
+    },
+    nameRev: (a: CloudreveFile, b: CloudreveFile) => {
+        return b.name.localeCompare(
+            a.name,
+            navigator.languages[0] || navigator.language,
+            { numeric: true, ignorePunctuation: true }
+        );
+    },
+    timePos: (a: CloudreveFile, b: CloudreveFile) => {
+        return Date.parse(a.create_date) - Date.parse(b.create_date);
+    },
+    timeRev: (a: CloudreveFile, b: CloudreveFile) => {
+        return Date.parse(b.create_date) - Date.parse(a.create_date);
+    },
+    modifyTimePos: (a: CloudreveFile, b: CloudreveFile) => {
+        return Date.parse(a.date) - Date.parse(b.date);
+    },
+    modifyTimeRev: (a: CloudreveFile, b: CloudreveFile) => {
+        return Date.parse(b.date) - Date.parse(a.date);
+    },
+};
diff --git a/src/component/Viewer/Video.js b/src/component/Viewer/Video.js
index 353360d..98e8391 100644
--- a/src/component/Viewer/Video.js
+++ b/src/component/Viewer/Video.js
@@ -17,7 +17,7 @@ import { Launch, PlaylistPlay, Subtitles } from "@material-ui/icons";
 import TextLoading from "../Placeholder/TextLoading";
 import SelectMenu from "./SelectMenu";
 import { getDownloadURL } from "../../services/file";
-import { sortMethodFuncs } from "../../redux/explorer/action";
+import { sortMethodFuncs } from "../FileManager/Sort";
 import { useTranslation } from "react-i18next";
 
 const Artplayer = React.lazy(() =>
diff --git a/src/redux/explorer/action.ts b/src/redux/explorer/action.ts
index a4f1353..28c6f1f 100644
--- a/src/redux/explorer/action.ts
+++ b/src/redux/explorer/action.ts
@@ -33,6 +33,7 @@ import {
     saveFileToFileSystemDirectory,
     verifyFileSystemRWPermission,
 } from "../../utils/filesystem";
+import { sortMethodFuncs } from "../../component/FileManager/Sort";
 
 export interface ActionSetFileList extends AnyAction {
     type: "SET_FILE_LIST";
@@ -113,42 +114,6 @@ export const setShiftSelectedIds = (shiftSelectedIds: any) => {
     };
 };
 
-type SortFunc = (a: CloudreveFile, b: CloudreveFile) => number;
-export const sortMethodFuncs: Record<SortMethod, SortFunc> = {
-    sizePos: (a: CloudreveFile, b: CloudreveFile) => {
-        return a.size - b.size;
-    },
-    sizeRes: (a: CloudreveFile, b: CloudreveFile) => {
-        return b.size - a.size;
-    },
-    namePos: (a: CloudreveFile, b: CloudreveFile) => {
-        return a.name.localeCompare(
-            b.name,
-            navigator.languages[0] || navigator.language,
-            { numeric: true, ignorePunctuation: true }
-        );
-    },
-    nameRev: (a: CloudreveFile, b: CloudreveFile) => {
-        return b.name.localeCompare(
-            a.name,
-            navigator.languages[0] || navigator.language,
-            { numeric: true, ignorePunctuation: true }
-        );
-    },
-    timePos: (a: CloudreveFile, b: CloudreveFile) => {
-        return Date.parse(a.create_date) - Date.parse(b.create_date);
-    },
-    timeRev: (a: CloudreveFile, b: CloudreveFile) => {
-        return Date.parse(b.create_date) - Date.parse(a.create_date);
-    },
-    modifyTimePos: (a: CloudreveFile, b: CloudreveFile) => {
-        return Date.parse(a.date) - Date.parse(b.date);
-    },
-    modifyTimeRev: (a: CloudreveFile, b: CloudreveFile) => {
-        return Date.parse(b.date) - Date.parse(a.date);
-    },
-};
-
 export const selectAll = (): ThunkAction<any, any, any, any> => {
     return (dispatch, getState): void => {
         const state = getState();