Files
leonpan-assets/src/component/FileManager/FolderPicker.tsx
2025-10-19 13:31:11 +00:00

71 lines
2.3 KiB
TypeScript
Executable File

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;