diff --git a/src/component/FileManager/Sort.js b/src/component/FileManager/Sort.js new file mode 100644 index 0000000..01788e6 --- /dev/null +++ b/src/component/FileManager/Sort.js @@ -0,0 +1,74 @@ +import React, { useState } from "react"; +import { IconButton, Menu, MenuItem } from "@material-ui/core"; +import TextTotateVerticalIcon from "@material-ui/icons/TextRotateVertical"; +import { useTranslation } from "react-i18next"; + +const 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" }, +] + +export default function Sort({ value, onChange, isSmall, inherit, className }) { + const { t } = useTranslation("application", { keyPrefix: "fileManager.sortMethods" }); + + const [anchorSort, setAnchorSort] = useState(false); + function showSortOptions(e) { + setAnchorSort(e.currentTarget); + } + + const [sortBy, setSortBy] = useState(value in SORT_TYPE ? value : '') + function onChangeSort(value) { + setSortBy(value) + onChange(value) + setAnchorSort(false); + } + return ( + <> + + + + setAnchorSort(null)} + > + { + SORT_OPTIONS.map((option, index) => ( + onChangeSort(option.value)} + > + {t(option.label)} + + )) + } + + + ) +}