71 lines
2.3 KiB
TypeScript
71 lines
2.3 KiB
TypeScript
|
import { Box, styled, useMediaQuery, useTheme } from "@mui/material";
|
||
|
|
import Grid from "@mui/material/Grid2";
|
||
|
|
import { useAppSelector } from "../../redux/hooks.ts";
|
||
|
|
import { getFileLinkedUri } from "../../util"; // Grid version 2
|
||
|
|
import ContextMenu from "./ContextMenu/ContextMenu.tsx";
|
||
|
|
import { FileManager, FileManagerIndex } from "./FileManager.tsx";
|
||
|
|
import TreeNavigation from "./TreeView/TreeNavigation.tsx";
|
||
|
|
|
||
|
|
const StyledGridItem = styled(Grid)(() => ({
|
||
|
|
display: "flex",
|
||
|
|
height: "100%",
|
||
|
|
}));
|
||
|
|
|
||
|
|
export const useFolderSelector = () => {
|
||
|
|
const currentPath = useAppSelector((state) => state.fileManager[FileManagerIndex.selector].pure_path);
|
||
|
|
const selected = useAppSelector((state) => state.fileManager[FileManagerIndex.selector].selected);
|
||
|
|
|
||
|
|
if (selected && Object.keys(selected).length > 0) {
|
||
|
|
const selectedFile = selected[Object.keys(selected)[0]];
|
||
|
|
return [selectedFile, getFileLinkedUri(selectedFile)] as const;
|
||
|
|
}
|
||
|
|
|
||
|
|
return [undefined, currentPath] as const;
|
||
|
|
};
|
||
|
|
|
||
|
|
export interface FolderPickerProps {
|
||
|
|
disableSharedWithMe?: boolean;
|
||
|
|
disableTrash?: boolean;
|
||
|
|
initialPath?: string;
|
||
|
|
}
|
||
|
|
|
||
|
|
const FolderPicker = ({ disableSharedWithMe, disableTrash, initialPath }: FolderPickerProps) => {
|
||
|
|
const theme = useTheme();
|
||
|
|
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
|
||
|
|
const path = useAppSelector((state) => state.fileManager[FileManagerIndex.main].path);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Box sx={{ width: "100%", display: "flex" }}>
|
||
|
|
<Grid container columnSpacing={2} sx={{ width: "100%", margin: "0 -4px" }}>
|
||
|
|
<StyledGridItem
|
||
|
|
size={{
|
||
|
|
xs: 12,
|
||
|
|
md: 2,
|
||
|
|
}}
|
||
|
|
sx={{
|
||
|
|
overflowY: "auto",
|
||
|
|
overflowX: "hidden",
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<TreeNavigation
|
||
|
|
index={FileManagerIndex.selector}
|
||
|
|
disableSharedWithMe={disableSharedWithMe}
|
||
|
|
disableTrash={disableTrash}
|
||
|
|
/>
|
||
|
|
</StyledGridItem>
|
||
|
|
<StyledGridItem
|
||
|
|
size={{
|
||
|
|
xs: 12,
|
||
|
|
md: 10,
|
||
|
|
}}
|
||
|
|
sx={{ height: isMobile ? "initial" : "100%" }}
|
||
|
|
>
|
||
|
|
<FileManager index={FileManagerIndex.selector} initialPath={initialPath ?? path} skipRender={isMobile} />
|
||
|
|
</StyledGridItem>
|
||
|
|
<ContextMenu fmIndex={FileManagerIndex.selector} />
|
||
|
|
</Grid>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
export default FolderPicker;
|