mirror of https://github.com/usememos/memos
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
96 lines
3.1 KiB
TypeScript
96 lines
3.1 KiB
TypeScript
import { Button, IconButton, Input } from "@mui/joy";
|
|
import { useState } from "react";
|
|
import { toast } from "react-hot-toast";
|
|
import * as api from "@/helpers/api";
|
|
import { useGlobalStore } from "@/store/module";
|
|
import { useTranslate } from "@/utils/i18n";
|
|
import { generateDialog } from "./Dialog";
|
|
import Icon from "./Icon";
|
|
import LearnMore from "./LearnMore";
|
|
|
|
interface Props extends DialogProps {
|
|
localStoragePath?: string;
|
|
confirmCallback?: () => void;
|
|
}
|
|
|
|
const UpdateLocalStorageDialog: React.FC<Props> = (props: Props) => {
|
|
const t = useTranslate();
|
|
const { destroy, localStoragePath, confirmCallback } = props;
|
|
const globalStore = useGlobalStore();
|
|
const [path, setPath] = useState(localStoragePath || "");
|
|
|
|
const handleCloseBtnClick = () => {
|
|
destroy();
|
|
};
|
|
|
|
const handleConfirmBtnClick = async () => {
|
|
try {
|
|
await api.upsertSystemSetting({
|
|
name: "local-storage-path",
|
|
value: JSON.stringify(path.trim()),
|
|
});
|
|
await globalStore.fetchSystemStatus();
|
|
} catch (error: any) {
|
|
console.error(error);
|
|
if (error.response.data.error) {
|
|
const errorText = error.response.data.error as string;
|
|
const internalIndex = errorText.indexOf("internal=");
|
|
if (internalIndex !== -1) {
|
|
const internalError = errorText.substring(internalIndex + 9);
|
|
toast.error(internalError);
|
|
}
|
|
} else {
|
|
toast.error(error.response.data.message);
|
|
}
|
|
}
|
|
if (confirmCallback) {
|
|
confirmCallback();
|
|
}
|
|
destroy();
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div className="dialog-header-container">
|
|
<p className="title-text">{t("setting.storage-section.update-local-path")}</p>
|
|
<IconButton size="sm" onClick={handleCloseBtnClick}>
|
|
<Icon.X className="w-5 h-auto" />
|
|
</IconButton>
|
|
</div>
|
|
<div className="dialog-content-container max-w-xs">
|
|
<p className="text-sm break-words mb-1">{t("setting.storage-section.update-local-path-description")}</p>
|
|
<div className="flex flex-row items-center mb-2 gap-x-2">
|
|
<span className="text-sm text-gray-400 break-all">e.g. {"assets/{timestamp}_{filename}"}</span>
|
|
<LearnMore url="https://usememos.com/docs/advanced-settings/local-storage" />
|
|
</div>
|
|
<Input
|
|
className="mb-2"
|
|
placeholder={t("setting.storage-section.local-storage-path")}
|
|
fullWidth
|
|
value={path}
|
|
onChange={(e) => setPath(e.target.value)}
|
|
/>
|
|
<div className="mt-2 w-full flex flex-row justify-end items-center space-x-1">
|
|
<Button variant="plain" color="neutral" onClick={handleCloseBtnClick}>
|
|
{t("common.cancel")}
|
|
</Button>
|
|
<Button onClick={handleConfirmBtnClick}>{t("common.update")}</Button>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
function showUpdateLocalStorageDialog(localStoragePath?: string, confirmCallback?: () => void) {
|
|
generateDialog(
|
|
{
|
|
className: "update-local-storage-dialog",
|
|
dialogName: "update-local-storage-dialog",
|
|
},
|
|
UpdateLocalStorageDialog,
|
|
{ localStoragePath, confirmCallback },
|
|
);
|
|
}
|
|
|
|
export default showUpdateLocalStorageDialog;
|