This commit is contained in:
Manav Rathi
2025-05-27 07:31:29 +05:30
parent 4e3112a4f6
commit afbbde5f2b

View File

@@ -164,15 +164,17 @@ export const Export: React.FC<ExportProps> = ({
// UI functions
// =============
const handleChangeExportDirectoryClick = async () => {
const newFolder = await selectAndPrepareExportDirectory();
if (!newFolder) return;
const handleChangeExportDirectory = useCallback(() => {
void (async () => {
const newFolder = await selectAndPrepareExportDirectory();
if (!newFolder) return;
log.info(`Export folder changed to ${newFolder}`);
exportService.updateExportSettings({ folder: newFolder });
setExportFolder(newFolder);
await syncExportRecord(newFolder);
};
log.info(`Export folder changed to ${newFolder}`);
exportService.updateExportSettings({ folder: newFolder });
setExportFolder(newFolder);
await syncExportRecord(newFolder);
})();
}, [syncExportRecord]);
const toggleContinuousExport = async () => {
if (!(await verifyExportFolderExists())) return;
@@ -215,7 +217,7 @@ export const Export: React.FC<ExportProps> = ({
<Stack>
<ExportDirectory
exportFolder={exportFolder}
changeExportDirectory={handleChangeExportDirectoryClick}
onChangeExportDirectory={handleChangeExportDirectory}
exportStage={exportStage}
/>
<ContinuousExport
@@ -242,41 +244,43 @@ export const Export: React.FC<ExportProps> = ({
);
};
function ExportDirectory({ exportFolder, changeExportDirectory, exportStage }) {
return (
<Stack
direction="row"
sx={{
gap: 1,
justifyContent: "space-between",
alignItems: "center",
}}
>
<Typography sx={{ color: "text.muted", mr: 1 }}>
{t("destination")}
</Typography>
{exportFolder ? (
<>
<DirectoryPath path={exportFolder} />
{exportStage === ExportStage.finished ||
exportStage === ExportStage.init ? (
<ChangeDirectoryOption
onClick={changeExportDirectory}
/>
) : (
// Prevent layout shift.
<Box sx={{ width: "16px", height: "48px" }} />
)}
</>
) : (
<Button color="accent" onClick={changeExportDirectory}>
{t("select_folder")}
</Button>
)}
</Stack>
);
interface ExportDirectoryProps {
exportStage: ExportStage;
exportFolder: string;
onChangeExportDirectory: () => void;
}
const ExportDirectory: React.FC<ExportDirectoryProps> = ({
exportStage,
exportFolder,
onChangeExportDirectory,
}) => (
<Stack
direction="row"
sx={{ gap: 1, justifyContent: "space-between", alignItems: "center" }}
>
<Typography sx={{ color: "text.muted", mr: 1 }}>
{t("destination")}
</Typography>
{exportFolder ? (
<>
<DirectoryPath path={exportFolder} />
{exportStage === ExportStage.finished ||
exportStage === ExportStage.init ? (
<ChangeDirectoryOption onClick={onChangeExportDirectory} />
) : (
// Prevent layout shift.
<Box sx={{ width: "16px", height: "48px" }} />
)}
</>
) : (
<Button color="accent" onClick={onChangeExportDirectory}>
{t("select_folder")}
</Button>
)}
</Stack>
);
const DirectoryPath = ({ path }) => (
<LinkButton onClick={() => void ensureElectron().openDirectory(path)}>
<Tooltip title={path}>