aiden
/
memos
mirror of https://github.com/usememos/memos
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: use react-hot-toast (#1321)

Browse Source
pull/1323/head
boojack 2 years ago committed by GitHub
parent df6b4b0607
commit f86816fea2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
38 changed files with 119 additions and 241 deletions
Show Stats Download Patch File Download Diff File

1
web/package.json
Unescape Escape View File

@ -23,6 +23,7 @@
"qs": "^6.11.0", "qs": "^6.11.0",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-hot-toast": "^2.4.0",
"react-i18next": "^11.18.6", "react-i18next": "^11.18.6",
"react-redux": "^8.0.1", "react-redux": "^8.0.1",
"react-router-dom": "^6.8.2", "react-router-dom": "^6.8.2",

2
web/src/App.tsx
Unescape Escape View File

@ -1,5 +1,6 @@
import { useColorScheme } from "@mui/joy"; import { useColorScheme } from "@mui/joy";
import { useEffect, Suspense } from "react"; import { useEffect, Suspense } from "react";
import { Toaster } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { RouterProvider } from "react-router-dom"; import { RouterProvider } from "react-router-dom";
import router from "./router"; import router from "./router";
@ -95,6 +96,7 @@ const App = () => {
return ( return (
<Suspense fallback={<Loading />}> <Suspense fallback={<Loading />}>
<RouterProvider router={router} /> <RouterProvider router={router} />
<Toaster position="top-right" />
</Suspense> </Suspense>
); );
}; };

8
web/src/components/ArchivedMemo.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useMemoStore } from "../store/module"; import { useMemoStore } from "../store/module";
import * as utils from "../helpers/utils"; import * as utils from "../helpers/utils";
import useToggle from "../hooks/useToggle"; import useToggle from "../hooks/useToggle";
import toastHelper from "./Toast";
import MemoContent from "./MemoContent"; import MemoContent from "./MemoContent";
import MemoResources from "./MemoResources"; import MemoResources from "./MemoResources";
import "../less/memo.less"; import "../less/memo.less";
@ -23,7 +23,7 @@ const ArchivedMemo: React.FC<Props> = (props: Props) => {
await memoStore.deleteMemoById(memo.id); await memoStore.deleteMemoById(memo.id);
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
} else { } else {
toggleConfirmDeleteBtn(); toggleConfirmDeleteBtn();
@ -37,10 +37,10 @@ const ArchivedMemo: React.FC<Props> = (props: Props) => {
rowStatus: "NORMAL", rowStatus: "NORMAL",
}); });
await memoStore.fetchMemos(); await memoStore.fetchMemos();
toastHelper.info(t("message.restored-successfully")); toast(t("message.restored-successfully"));
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

4
web/src/components/ArchivedMemoDialog.tsx
Unescape Escape View File

@ -1,10 +1,10 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useMemoStore } from "../store/module"; import { useMemoStore } from "../store/module";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import ArchivedMemo from "./ArchivedMemo"; import ArchivedMemo from "./ArchivedMemo";
import "../less/archived-memo-dialog.less"; import "../less/archived-memo-dialog.less";
@ -26,7 +26,7 @@ const ArchivedMemoDialog: React.FC<Props> = (props: Props) => {
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
}) })
.finally(() => { .finally(() => {
loadingState.setFinish(); loadingState.setFinish();

4
web/src/components/AskAIDialog.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { Button, Textarea } from "@mui/joy"; import { Button, Textarea } from "@mui/joy";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import { marked } from "../labs/marked"; import { marked } from "../labs/marked";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import showSettingDialog from "./SettingDialog"; import showSettingDialog from "./SettingDialog";
type Props = DialogProps; type Props = DialogProps;
@ -44,7 +44,7 @@ const AskAIDialog: React.FC<Props> = (props: Props) => {
await askQuestion(question); await askQuestion(question);
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.error); toast.error(error.response.data.error);
} }
setQuestion(""); setQuestion("");
fetchingState.setFinish(); fetchingState.setFinish();

10
web/src/components/ChangeMemberPasswordDialog.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useUserStore } from "../store/module"; import { useUserStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
interface Props extends DialogProps { interface Props extends DialogProps {
user: User; user: User;
@ -36,12 +36,12 @@ const ChangeMemberPasswordDialog: React.FC<Props> = (props: Props) => {
const handleSaveBtnClick = async () => { const handleSaveBtnClick = async () => {
if (newPassword === "" || newPasswordAgain === "") { if (newPassword === "" || newPasswordAgain === "") {
toastHelper.error(t("message.fill-all")); toast.error(t("message.fill-all"));
return; return;
} }
if (newPassword !== newPasswordAgain) { if (newPassword !== newPasswordAgain) {
toastHelper.error(t("message.new-password-not-match")); toast.error(t("message.new-password-not-match"));
setNewPasswordAgain(""); setNewPasswordAgain("");
return; return;
} }
@ -51,11 +51,11 @@ const ChangeMemberPasswordDialog: React.FC<Props> = (props: Props) => {
id: propsUser.id, id: propsUser.id,
password: newPassword, password: newPassword,
}); });
toastHelper.info(t("message.password-changed")); toast(t("message.password-changed"));
handleCloseBtnClick(); handleCloseBtnClick();
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

10
web/src/components/ChangeMemoCreatedTsDialog.tsx
Unescape Escape View File

@ -1,10 +1,10 @@
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useMemoStore } from "../store/module"; import { useMemoStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
interface Props extends DialogProps { interface Props extends DialogProps {
memoId: MemoId; memoId: MemoId;
@ -23,7 +23,7 @@ const ChangeMemoCreatedTsDialog: React.FC<Props> = (props: Props) => {
const datetime = dayjs(memo.createdTs).format("YYYY-MM-DDTHH:mm"); const datetime = dayjs(memo.createdTs).format("YYYY-MM-DDTHH:mm");
setCreatedAt(datetime); setCreatedAt(datetime);
} else { } else {
toastHelper.error(t("message.memo-not-found")); toast.error(t("message.memo-not-found"));
destroy(); destroy();
} }
}); });
@ -43,7 +43,7 @@ const ChangeMemoCreatedTsDialog: React.FC<Props> = (props: Props) => {
const createdTs = dayjs(createdAt).unix(); const createdTs = dayjs(createdAt).unix();
if (createdTs > nowTs) { if (createdTs > nowTs) {
toastHelper.error(t("message.invalid-created-datetime")); toast.error(t("message.invalid-created-datetime"));
return; return;
} }
@ -52,11 +52,11 @@ const ChangeMemoCreatedTsDialog: React.FC<Props> = (props: Props) => {
id: memoId, id: memoId,
createdTs, createdTs,
}); });
toastHelper.info(t("message.memo-updated-datetime")); toast.success(t("message.memo-updated-datetime"));
handleCloseBtnClick(); handleCloseBtnClick();
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

10
web/src/components/ChangePasswordDialog.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useUserStore } from "../store/module"; import { useUserStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
type Props = DialogProps; type Props = DialogProps;
@ -33,12 +33,12 @@ const ChangePasswordDialog: React.FC<Props> = ({ destroy }: Props) => {
const handleSaveBtnClick = async () => { const handleSaveBtnClick = async () => {
if (newPassword === "" || newPasswordAgain === "") { if (newPassword === "" || newPasswordAgain === "") {
toastHelper.error(t("message.fill-all")); toast.error(t("message.fill-all"));
return; return;
} }
if (newPassword !== newPasswordAgain) { if (newPassword !== newPasswordAgain) {
toastHelper.error(t("message.new-password-not-match")); toast.error(t("message.new-password-not-match"));
setNewPasswordAgain(""); setNewPasswordAgain("");
return; return;
} }
@ -49,11 +49,11 @@ const ChangePasswordDialog: React.FC<Props> = ({ destroy }: Props) => {
id: user.id, id: user.id,
password: newPassword, password: newPassword,
}); });
toastHelper.info(t("message.password-changed")); toast.success(t("message.password-changed"));
handleCloseBtnClick(); handleCloseBtnClick();
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

8
web/src/components/ChangeResourceFilenameDialog.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { useState } from "react"; import { useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useResourceStore } from "../store/module"; import { useResourceStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import "../less/change-resource-filename-dialog.less"; import "../less/change-resource-filename-dialog.less";
interface Props extends DialogProps { interface Props extends DialogProps {
@ -44,7 +44,7 @@ const ChangeResourceFilenameDialog: React.FC<Props> = (props: Props) => {
return; return;
} }
if (!validateFilename(filename)) { if (!validateFilename(filename)) {
toastHelper.error(t("message.invalid-resource-filename")); toast.error(t("message.invalid-resource-filename"));
return; return;
} }
try { try {
@ -52,11 +52,11 @@ const ChangeResourceFilenameDialog: React.FC<Props> = (props: Props) => {
id: resourceId, id: resourceId,
filename: filename, filename: filename,
}); });
toastHelper.info(t("message.resource-filename-updated")); toast.success(t("message.resource-filename-updated"));
handleCloseBtnClick(); handleCloseBtnClick();
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

8
web/src/components/CreateIdentityProviderDialog.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { Button, Divider, Input, Radio, RadioGroup, Typography } from "@mui/joy"; import { Button, Divider, Input, Radio, RadioGroup, Typography } from "@mui/joy";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import { UNKNOWN_ID } from "../helpers/consts"; import { UNKNOWN_ID } from "../helpers/consts";
import { absolutifyLink } from "../helpers/utils"; import { absolutifyLink } from "../helpers/utils";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
interface Props extends DialogProps { interface Props extends DialogProps {
identityProvider?: IdentityProvider; identityProvider?: IdentityProvider;
@ -193,7 +193,7 @@ const CreateIdentityProviderDialog: React.FC<Props> = (props: Props) => {
}, },
}, },
}); });
toastHelper.info(`SSO ${basicInfo.name} created`); toast.success(`SSO ${basicInfo.name} created`);
} else { } else {
await api.patchIdentityProvider({ await api.patchIdentityProvider({
id: identityProvider?.id, id: identityProvider?.id,
@ -206,11 +206,11 @@ const CreateIdentityProviderDialog: React.FC<Props> = (props: Props) => {
}, },
}, },
}); });
toastHelper.info(`SSO ${basicInfo.name} updated`); toast.success(`SSO ${basicInfo.name} updated`);
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
if (confirmCallback) { if (confirmCallback) {
confirmCallback(); confirmCallback();

4
web/src/components/CreateResourceDialog.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import { Button, Input, Select, Option, Typography, List, ListItem, Autocomplete, Tooltip } from "@mui/joy"; import { Button, Input, Select, Option, Typography, List, ListItem, Autocomplete, Tooltip } from "@mui/joy";
import React, { useRef, useState } from "react"; import React, { useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { useResourceStore } from "../store/module"; import { useResourceStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
const fileTypeAutocompleteOptions = ["image/*", "text/*", "audio/*", "video/*", "application/*"]; const fileTypeAutocompleteOptions = ["image/*", "text/*", "audio/*", "video/*", "application/*"];
@ -132,7 +132,7 @@ const CreateResourceDialog: React.FC<Props> = (props: Props) => {
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
if (onConfirm) { if (onConfirm) {

10
web/src/components/CreateShortcutDialog.tsx
Unescape Escape View File

@ -1,12 +1,12 @@
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useShortcutStore, useTagStore } from "../store/module"; import { useShortcutStore, useTagStore } from "../store/module";
import { filterConsts, getDefaultFilter, relationConsts } from "../helpers/filter"; import { filterConsts, getDefaultFilter, relationConsts } from "../helpers/filter";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import Selector from "./base/Selector"; import Selector from "./base/Selector";
import "../less/create-shortcut-dialog.less"; import "../less/create-shortcut-dialog.less";
@ -42,12 +42,12 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
const handleSaveBtnClick = async () => { const handleSaveBtnClick = async () => {
if (!title) { if (!title) {
toastHelper.error(t("shortcut-list.title-required")); toast.error(t("shortcut-list.title-required"));
return; return;
} }
for (const filter of filters) { for (const filter of filters) {
if (!filter.value.value) { if (!filter.value.value) {
toastHelper.error(t("shortcut-list.value-required")); toast.error(t("shortcut-list.value-required"));
return; return;
} }
} }
@ -66,7 +66,7 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
destroy(); destroy();
}; };
@ -75,7 +75,7 @@ const CreateShortcutDialog: React.FC<Props> = (props: Props) => {
if (filters.length > 0) { if (filters.length > 0) {
const lastFilter = filters[filters.length - 1]; const lastFilter = filters[filters.length - 1];
if (lastFilter.value.value === "") { if (lastFilter.value.value === "") {
toastHelper.info(t("shortcut-list.fill-previous")); toast(t("shortcut-list.fill-previous"));
return; return;
} }
} }

4
web/src/components/CreateStorageServiceDialog.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { Button, Input, Typography } from "@mui/joy"; import { Button, Input, Typography } from "@mui/joy";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
interface Props extends DialogProps { interface Props extends DialogProps {
storage?: ObjectStorage; storage?: ObjectStorage;
@ -77,7 +77,7 @@ const CreateStorageServiceDialog: React.FC<Props> = (props: Props) => {
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
if (confirmCallback) { if (confirmCallback) {
confirmCallback(); confirmCallback();

6
web/src/components/CreateTagDialog.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { Input } from "@mui/joy"; import { Input } from "@mui/joy";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTagStore } from "../store/module"; import { useTagStore } from "../store/module";
import { getTagSuggestionList } from "../helpers/api"; import { getTagSuggestionList } from "../helpers/api";
import { matcher } from "../labs/marked/matcher"; import { matcher } from "../labs/marked/matcher";
import Tag from "../labs/marked/parser/Tag"; import Tag from "../labs/marked/parser/Tag";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
type Props = DialogProps; type Props = DialogProps;
@ -54,7 +54,7 @@ const CreateTagDialog: React.FC<Props> = (props: Props) => {
const handleSaveBtnClick = async () => { const handleSaveBtnClick = async () => {
if (!validateTagName(tagName)) { if (!validateTagName(tagName)) {
toastHelper.error("Invalid tag name"); toast.error("Invalid tag name");
return; return;
} }
@ -63,7 +63,7 @@ const CreateTagDialog: React.FC<Props> = (props: Props) => {
setTagName(""); setTagName("");
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

6
web/src/components/EmbedMemoDialog.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import React from "react"; import React from "react";
import { toast } from "react-hot-toast";
import copy from "copy-to-clipboard";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import copy from "copy-to-clipboard";
import toastHelper from "./Toast";
interface Props extends DialogProps { interface Props extends DialogProps {
memoId: MemoId; memoId: MemoId;
@ -17,7 +17,7 @@ const EmbedMemoDialog: React.FC<Props> = (props: Props) => {
const handleCopyCode = () => { const handleCopyCode = () => {
copy(memoEmbeddedCode()); copy(memoEmbeddedCode());
toastHelper.success("Succeed to copy code to clipboard."); toast.success("Succeed to copy code to clipboard.");
}; };
return ( return (

6
web/src/components/Memo.tsx
Unescape Escape View File

@ -2,11 +2,11 @@ import { Tooltip } from "@mui/joy";
import copy from "copy-to-clipboard"; import copy from "copy-to-clipboard";
import dayjs from "dayjs"; import dayjs from "dayjs";
import { memo, useEffect, useRef, useState } from "react"; import { memo, useEffect, useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import { useEditorStore, useLocationStore, useMemoStore, useUserStore } from "../store/module"; import { useEditorStore, useLocationStore, useMemoStore, useUserStore } from "../store/module";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import MemoContent from "./MemoContent"; import MemoContent from "./MemoContent";
import MemoResources from "./MemoResources"; import MemoResources from "./MemoResources";
import showShareMemo from "./ShareMemoDialog"; import showShareMemo from "./ShareMemoDialog";
@ -64,7 +64,7 @@ const Memo: React.FC<Props> = (props: Props) => {
const handleCopyContent = () => { const handleCopyContent = () => {
copy(memo.content); copy(memo.content);
toastHelper.success(t("message.succeed-copy-content")); toast.success(t("message.succeed-copy-content"));
}; };
const handleTogglePinMemoBtnClick = async () => { const handleTogglePinMemoBtnClick = async () => {
@ -103,7 +103,7 @@ const Memo: React.FC<Props> = (props: Props) => {
}); });
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
if (editorStore.getState().editMemoId === memo.id) { if (editorStore.getState().editMemoId === memo.id) {

6
web/src/components/MemoEditor.tsx
Unescape Escape View File

@ -1,5 +1,6 @@
import { isNumber, last, toLower, uniq } from "lodash-es"; import { isNumber, last, toLower, uniq } from "lodash-es";
import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { getMatchedNodes } from "../labs/marked"; import { getMatchedNodes } from "../labs/marked";
import { deleteMemoResource, upsertMemoResource } from "../helpers/api"; import { deleteMemoResource, upsertMemoResource } from "../helpers/api";
@ -15,7 +16,6 @@ import {
} from "../store/module"; } from "../store/module";
import * as storage from "../helpers/storage"; import * as storage from "../helpers/storage";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import Selector from "./base/Selector"; import Selector from "./base/Selector";
import Editor, { EditorRefActions } from "./Editor/Editor"; import Editor, { EditorRefActions } from "./Editor/Editor";
import ResourceIcon from "./ResourceIcon"; import ResourceIcon from "./ResourceIcon";
@ -214,7 +214,7 @@ const MemoEditor = () => {
resource = await resourceStore.createResourceWithBlob(file); resource = await resourceStore.createResourceWithBlob(file);
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
setState((state) => { setState((state) => {
@ -293,7 +293,7 @@ const MemoEditor = () => {
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
setState((state) => { setState((state) => {
return { return {

6
web/src/components/MemoList.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useLocationStore, useMemoStore, useShortcutStore } from "../store/module"; import { useLocationStore, useMemoStore, useShortcutStore } from "../store/module";
import { TAG_REG, LINK_REG } from "../labs/marked/parser"; import { TAG_REG, LINK_REG } from "../labs/marked/parser";
import * as utils from "../helpers/utils"; import * as utils from "../helpers/utils";
import { DEFAULT_MEMO_LIMIT } from "../helpers/consts"; import { DEFAULT_MEMO_LIMIT } from "../helpers/consts";
import { checkShouldShowMemoWithFilters } from "../helpers/filter"; import { checkShouldShowMemoWithFilters } from "../helpers/filter";
import toastHelper from "./Toast";
import Memo from "./Memo"; import Memo from "./Memo";
import "../less/memo-list.less"; import "../less/memo-list.less";
@ -95,7 +95,7 @@ const MemoList = () => {
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
}); });
}, []); }, []);
@ -125,7 +125,7 @@ const MemoList = () => {
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

8
web/src/components/ResourcesDialog.tsx
Unescape Escape View File

@ -1,12 +1,12 @@
import { Button } from "@mui/joy"; import { Button } from "@mui/joy";
import copy from "copy-to-clipboard"; import copy from "copy-to-clipboard";
import { useEffect } from "react"; import { useEffect } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import { useResourceStore } from "../store/module"; import { useResourceStore } from "../store/module";
import { getResourceUrl } from "../utils/resource"; import { getResourceUrl } from "../utils/resource";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import Dropdown from "./base/Dropdown"; import Dropdown from "./base/Dropdown";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import { showCommonDialog } from "./Dialog/CommonDialog"; import { showCommonDialog } from "./Dialog/CommonDialog";
@ -29,7 +29,7 @@ const ResourcesDialog: React.FC<Props> = (props: Props) => {
.fetchResourceList() .fetchResourceList()
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
}) })
.finally(() => { .finally(() => {
loadingState.setFinish(); loadingState.setFinish();
@ -55,7 +55,7 @@ const ResourcesDialog: React.FC<Props> = (props: Props) => {
const handleCopyResourceLinkBtnClick = (resource: Resource) => { const handleCopyResourceLinkBtnClick = (resource: Resource) => {
const url = getResourceUrl(resource); const url = getResourceUrl(resource);
copy(url); copy(url);
toastHelper.success(t("message.succeed-copy-resource-link")); toast.success(t("message.succeed-copy-resource-link"));
}; };
const handleDeleteUnusedResourcesBtnClick = () => { const handleDeleteUnusedResourcesBtnClick = () => {
@ -68,7 +68,7 @@ const ResourcesDialog: React.FC<Props> = (props: Props) => {
return false; return false;
}); });
if (unusedResources.length === 0) { if (unusedResources.length === 0) {
toastHelper.success(t("resources.no-unused-resources")); toast.success(t("resources.no-unused-resources"));
return; return;
} }
showCommonDialog({ showCommonDialog({

4
web/src/components/ResourcesSelectorDialog.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { Button, Checkbox } from "@mui/joy"; import { Button, Checkbox } from "@mui/joy";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import { useEditorStore, useResourceStore } from "../store/module"; import { useEditorStore, useResourceStore } from "../store/module";
import { getResourceUrl } from "../utils/resource"; import { getResourceUrl } from "../utils/resource";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import showPreviewImageDialog from "./PreviewImageDialog"; import showPreviewImageDialog from "./PreviewImageDialog";
import "../less/resources-selector-dialog.less"; import "../less/resources-selector-dialog.less";
@ -32,7 +32,7 @@ const ResourcesSelectorDialog: React.FC<Props> = (props: Props) => {
.fetchResourceList() .fetchResourceList()
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
}) })
.finally(() => { .finally(() => {
loadingState.setFinish(); loadingState.setFinish();

6
web/src/components/Settings/MemberSection.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useUserStore } from "../../store/module"; import { useUserStore } from "../../store/module";
import * as api from "../../helpers/api"; import * as api from "../../helpers/api";
import toastHelper from "../Toast";
import Dropdown from "../base/Dropdown"; import Dropdown from "../base/Dropdown";
import { showCommonDialog } from "../Dialog/CommonDialog"; import { showCommonDialog } from "../Dialog/CommonDialog";
import showChangeMemberPasswordDialog from "../ChangeMemberPasswordDialog"; import showChangeMemberPasswordDialog from "../ChangeMemberPasswordDialog";
@ -48,7 +48,7 @@ const PreferencesSection = () => {
const handleCreateUserBtnClick = async () => { const handleCreateUserBtnClick = async () => {
if (state.createUserUsername === "" || state.createUserPassword === "") { if (state.createUserUsername === "" || state.createUserPassword === "") {
toastHelper.error(t("message.fill-form")); toast.error(t("message.fill-form"));
return; return;
} }
@ -61,7 +61,7 @@ const PreferencesSection = () => {
try { try {
await api.createUser(userCreate); await api.createUser(userCreate);
} catch (error: any) { } catch (error: any) {
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
await fetchUserList(); await fetchUserList();
setState({ setState({

4
web/src/components/Settings/SSOSection.tsx
Unescape Escape View File

@ -1,10 +1,10 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import * as api from "../../helpers/api"; import * as api from "../../helpers/api";
import showCreateIdentityProviderDialog from "../CreateIdentityProviderDialog"; import showCreateIdentityProviderDialog from "../CreateIdentityProviderDialog";
import Dropdown from "../base/Dropdown"; import Dropdown from "../base/Dropdown";
import { showCommonDialog } from "../Dialog/CommonDialog"; import { showCommonDialog } from "../Dialog/CommonDialog";
import toastHelper from "../Toast";
const SSOSection = () => { const SSOSection = () => {
const { t } = useTranslation(); const { t } = useTranslation();
@ -32,7 +32,7 @@ const SSOSection = () => {
await api.deleteIdentityProvider(identityProvider.id); await api.deleteIdentityProvider(identityProvider.id);
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
await fetchIdentityProviderList(); await fetchIdentityProviderList();
}, },

4
web/src/components/Settings/StorageSection.tsx
Unescape Escape View File

@ -1,12 +1,12 @@
import { Divider, Select, Option } from "@mui/joy"; import { Divider, Select, Option } from "@mui/joy";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useGlobalStore } from "../../store/module"; import { useGlobalStore } from "../../store/module";
import * as api from "../../helpers/api"; import * as api from "../../helpers/api";
import showCreateStorageServiceDialog from "../CreateStorageServiceDialog"; import showCreateStorageServiceDialog from "../CreateStorageServiceDialog";
import Dropdown from "../base/Dropdown"; import Dropdown from "../base/Dropdown";
import { showCommonDialog } from "../Dialog/CommonDialog"; import { showCommonDialog } from "../Dialog/CommonDialog";
import toastHelper from "../Toast";
const StorageSection = () => { const StorageSection = () => {
const { t } = useTranslation(); const { t } = useTranslation();
@ -50,7 +50,7 @@ const StorageSection = () => {
await api.deleteStorage(storage.id); await api.deleteStorage(storage.id);
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
await fetchStorageList(); await fetchStorageList();
}, },

12
web/src/components/Settings/SystemSection.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Button, Divider, Input, Switch, Textarea } from "@mui/joy"; import { Button, Divider, Input, Switch, Textarea } from "@mui/joy";
import { useGlobalStore } from "../../store/module"; import { useGlobalStore } from "../../store/module";
import * as api from "../../helpers/api"; import * as api from "../../helpers/api";
import toastHelper from "../Toast";
import showUpdateCustomizedProfileDialog from "../UpdateCustomizedProfileDialog"; import showUpdateCustomizedProfileDialog from "../UpdateCustomizedProfileDialog";
import { useAppDispatch } from "../../store"; import { useAppDispatch } from "../../store";
import { setGlobalState } from "../../store/reducer/global"; import { setGlobalState } from "../../store/reducer/global";
@ -83,7 +83,7 @@ const SystemSection = () => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success(t("message.succeed-vacuum-database")); toast.success(t("message.succeed-vacuum-database"));
}; };
const handleOpenAIApiKeyChanged = (value: string) => { const handleOpenAIApiKeyChanged = (value: string) => {
@ -103,7 +103,7 @@ const SystemSection = () => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success("OpenAI Api Key updated"); toast.success("OpenAI Api Key updated");
}; };
const handleOpenAIApiHostChanged = (value: string) => { const handleOpenAIApiHostChanged = (value: string) => {
@ -123,7 +123,7 @@ const SystemSection = () => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success("OpenAI Api Host updated"); toast.success("OpenAI Api Host updated");
}; };
const handleAdditionalStyleChanged = (value: string) => { const handleAdditionalStyleChanged = (value: string) => {
@ -143,7 +143,7 @@ const SystemSection = () => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success(t("message.succeed-update-additional-style")); toast.success(t("message.succeed-update-additional-style"));
}; };
const handleAdditionalScriptChanged = (value: string) => { const handleAdditionalScriptChanged = (value: string) => {
@ -163,7 +163,7 @@ const SystemSection = () => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success(t("message.succeed-update-additional-script")); toast.success(t("message.succeed-update-additional-script"));
}; };
const handleDisablePublicMemosChanged = async (value: boolean) => { const handleDisablePublicMemosChanged = async (value: boolean) => {

4
web/src/components/ShareMemoDialog.tsx
Unescape Escape View File

@ -1,6 +1,7 @@
import { Select, Option } from "@mui/joy"; import { Select, Option } from "@mui/joy";
import { QRCodeSVG } from "qrcode.react"; import { QRCodeSVG } from "qrcode.react";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import copy from "copy-to-clipboard"; import copy from "copy-to-clipboard";
import { toLower } from "lodash-es"; import { toLower } from "lodash-es";
@ -12,7 +13,6 @@ import { getMemoStats } from "../helpers/api";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import MemoContent from "./MemoContent"; import MemoContent from "./MemoContent";
import MemoResources from "./MemoResources"; import MemoResources from "./MemoResources";
import "../less/share-memo-dialog.less"; import "../less/share-memo-dialog.less";
@ -92,7 +92,7 @@ const ShareMemoDialog: React.FC<Props> = (props: Props) => {
const handleCopyLinkBtnClick = () => { const handleCopyLinkBtnClick = () => {
copy(`${window.location.origin}/m/${memo.id}`); copy(`${window.location.origin}/m/${memo.id}`);
toastHelper.success(t("message.succeed-copy-link")); toast.success(t("message.succeed-copy-link"));
}; };
const memoVisibilityOptionSelectorItems = VISIBILITY_SELECTOR_ITEMS.map((item) => { const memoVisibilityOptionSelectorItems = VISIBILITY_SELECTOR_ITEMS.map((item) => {

4
web/src/components/ShortcutList.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { useEffect } from "react"; import { useEffect } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useLocationStore, useShortcutStore } from "../store/module"; import { useLocationStore, useShortcutStore } from "../store/module";
import * as utils from "../helpers/utils"; import * as utils from "../helpers/utils";
import useToggle from "../hooks/useToggle"; import useToggle from "../hooks/useToggle";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import Icon from "./Icon"; import Icon from "./Icon";
import toastHelper from "./Toast";
import showCreateShortcutDialog from "./CreateShortcutDialog"; import showCreateShortcutDialog from "./CreateShortcutDialog";
const ShortcutList = () => { const ShortcutList = () => {
@ -87,7 +87,7 @@ const ShortcutContainer: React.FC<ShortcutContainerProps> = (props: ShortcutCont
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
} else { } else {
toggleConfirmDeleteBtn(); toggleConfirmDeleteBtn();

110
web/src/components/Toast.tsx
Unescape Escape View File

@ -1,110 +0,0 @@
import { useEffect } from "react";
import { createRoot, Root } from "react-dom/client";
import "../less/toast.less";
type ToastType = "normal" | "success" | "info" | "error";
type ToastConfig = {
type: ToastType;
content: string;
duration: number;
};
type ToastItemProps = {
type: ToastType;
content: string;
duration: number;
destroy: FunctionType;
};
const Toast: React.FC<ToastItemProps> = (props: ToastItemProps) => {
const { destroy, duration } = props;
useEffect(() => {
if (duration > 0) {
setTimeout(() => {
destroy();
}, duration);
}
}, []);
return (
<div className="toast-container" onClick={destroy}>
<p className="content-text">{props.content}</p>
</div>
);
};
// toast animation duration.
const TOAST_ANIMATION_DURATION = 400;
const initialToastHelper = () => {
const shownToastContainers: [Root, HTMLDivElement][] = [];
let shownToastAmount = 0;
const wrapperClassName = "toast-list-container";
const tempDiv = document.createElement("div");
tempDiv.className = wrapperClassName;
document.body.appendChild(tempDiv);
const toastWrapper = tempDiv;
const showToast = (config: ToastConfig) => {
const tempDiv = document.createElement("div");
const toast = createRoot(tempDiv);
tempDiv.className = `toast-wrapper ${config.type}`;
toastWrapper.appendChild(tempDiv);
shownToastAmount++;
shownToastContainers.push([toast, tempDiv]);
const cbs = {
destroy: () => {
tempDiv.classList.add("destroy");
setTimeout(() => {
if (!tempDiv.parentElement) {
return;
}
shownToastAmount--;
if (shownToastAmount === 0) {
for (const [root, tempDiv] of shownToastContainers) {
root.unmount();
tempDiv.remove();
}
shownToastContainers.splice(0, shownToastContainers.length);
}
}, TOAST_ANIMATION_DURATION);
},
};
toast.render(<Toast {...config} destroy={cbs.destroy} />);
setTimeout(() => {
tempDiv.classList.add("showup");
}, 10);
return cbs;
};
const info = (content: string, duration = 3000) => {
return showToast({ type: "normal", content, duration });
};
const success = (content: string, duration = 3000) => {
return showToast({ type: "success", content, duration });
};
const error = (content: string, duration = 5000) => {
return showToast({ type: "error", content, duration });
};
return {
info,
success,
error,
};
};
const toastHelper = initialToastHelper();
export default toastHelper;

12
web/src/components/UpdateAccountDialog.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { isEqual } from "lodash-es"; import { isEqual } from "lodash-es";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useUserStore } from "../store/module"; import { useUserStore } from "../store/module";
import { convertFileToBase64 } from "../helpers/utils"; import { convertFileToBase64 } from "../helpers/utils";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import UserAvatar from "./UserAvatar"; import UserAvatar from "./UserAvatar";
type Props = DialogProps; type Props = DialogProps;
@ -41,7 +41,7 @@ const UpdateAccountDialog: React.FC<Props> = ({ destroy }: Props) => {
if (files && files.length > 0) { if (files && files.length > 0) {
const image = files[0]; const image = files[0];
if (image.size > 2 * 1024 * 1024) { if (image.size > 2 * 1024 * 1024) {
toastHelper.error("Max file size is 2MB"); toast.error("Max file size is 2MB");
return; return;
} }
try { try {
@ -54,7 +54,7 @@ const UpdateAccountDialog: React.FC<Props> = ({ destroy }: Props) => {
}); });
} catch (error) { } catch (error) {
console.error(error); console.error(error);
toastHelper.error(`Failed to convert image to base64`); toast.error(`Failed to convert image to base64`);
} }
} }
}; };
@ -88,7 +88,7 @@ const UpdateAccountDialog: React.FC<Props> = ({ destroy }: Props) => {
const handleSaveBtnClick = async () => { const handleSaveBtnClick = async () => {
if (state.username === "") { if (state.username === "") {
toastHelper.error(t("message.fill-all")); toast.error(t("message.fill-all"));
return; return;
} }
@ -110,11 +110,11 @@ const UpdateAccountDialog: React.FC<Props> = ({ destroy }: Props) => {
userPatch.email = state.email; userPatch.email = state.email;
} }
await userStore.patchUser(userPatch); await userStore.patchUser(userPatch);
toastHelper.info(t("message.update-succeed")); toast.success(t("message.update-succeed"));
handleCloseBtnClick(); handleCloseBtnClick();
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.error); toast.error(error.response.data.error);
} }
}; };

6
web/src/components/UpdateCustomizedProfileDialog.tsx
Unescape Escape View File

@ -1,10 +1,10 @@
import { useState } from "react"; import { useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { toast } from "react-hot-toast";
import { useGlobalStore } from "../store/module"; import { useGlobalStore } from "../store/module";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import Icon from "./Icon"; import Icon from "./Icon";
import { generateDialog } from "./Dialog"; import { generateDialog } from "./Dialog";
import toastHelper from "./Toast";
import LocaleSelect from "./LocaleSelect"; import LocaleSelect from "./LocaleSelect";
import AppearanceSelect from "./AppearanceSelect"; import AppearanceSelect from "./AppearanceSelect";
@ -77,7 +77,7 @@ const UpdateCustomizedProfileDialog: React.FC<Props> = ({ destroy }: Props) => {
const handleSaveButtonClick = async () => { const handleSaveButtonClick = async () => {
if (state.name === "") { if (state.name === "") {
toastHelper.error("Please fill server name"); toast.error("Please fill server name");
return; return;
} }
@ -91,7 +91,7 @@ const UpdateCustomizedProfileDialog: React.FC<Props> = ({ destroy }: Props) => {
console.error(error); console.error(error);
return; return;
} }
toastHelper.success(t("message.succeed-update-customized-profile")); toast.success(t("message.succeed-update-customized-profile"));
destroy(); destroy();
}; };

4
web/src/labs/marked/parser/CodeBlock.tsx
Unescape Escape View File

@ -1,7 +1,7 @@
import copy from "copy-to-clipboard"; import copy from "copy-to-clipboard";
import hljs from "highlight.js"; import hljs from "highlight.js";
import { toast } from "react-hot-toast";
import { matcher } from "../matcher"; import { matcher } from "../matcher";
import toastHelper from "../../../components/Toast";
export const CODE_BLOCK_REG = /^```(\S*?)\s([\s\S]*?)```/; export const CODE_BLOCK_REG = /^```(\S*?)\s([\s\S]*?)```/;
@ -25,7 +25,7 @@ const renderer = (rawStr: string) => {
const handleCopyButtonClick = () => { const handleCopyButtonClick = () => {
copy(matchResult[2]); copy(matchResult[2]);
toastHelper.success("Copy succeed"); toast.success("Copy succeed");
}; };
return ( return (

26
web/src/less/toast.less
Unescape Escape View File

@ -1,26 +0,0 @@
.toast-list-container {
@apply flex flex-col justify-start items-end fixed top-2 right-4 max-h-full;
z-index: 9999;
> .toast-wrapper {
@apply flex flex-col justify-start items-start relative left-full invisible text-base cursor-pointer shadow-lg rounded bg-white mt-6 py-2 px-4;
min-width: 6em;
left: calc(100% + 32px);
transition: all 0.4s ease;
&.showup {
@apply left-0 visible;
}
&.destory {
@apply invisible;
left: calc(100% + 32px);
}
> .toast-container {
> .content-text {
@apply text-sm whitespace-pre-wrap word-break leading-6 max-w-xs;
}
}
}
}

10
web/src/pages/Auth.tsx
Unescape Escape View File

@ -1,12 +1,12 @@
import { Button, Divider } from "@mui/joy"; import { Button, Divider } from "@mui/joy";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useGlobalStore, useUserStore } from "../store/module"; import { useGlobalStore, useUserStore } from "../store/module";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import { absolutifyLink } from "../helpers/utils"; import { absolutifyLink } from "../helpers/utils";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import Icon from "../components/Icon"; import Icon from "../components/Icon";
import toastHelper from "../components/Toast";
import AppearanceSelect from "../components/AppearanceSelect"; import AppearanceSelect from "../components/AppearanceSelect";
import LocaleSelect from "../components/LocaleSelect"; import LocaleSelect from "../components/LocaleSelect";
import "../less/auth.less"; import "../less/auth.less";
@ -63,11 +63,11 @@ const Auth = () => {
if (user) { if (user) {
window.location.href = "/"; window.location.href = "/";
} else { } else {
toastHelper.error(t("message.login-failed")); toast.error(t("message.login-failed"));
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.error); toast.error(error.response.data.error);
} }
actionBtnLoadingState.setFinish(); actionBtnLoadingState.setFinish();
}; };
@ -84,11 +84,11 @@ const Auth = () => {
if (user) { if (user) {
window.location.href = "/"; window.location.href = "/";
} else { } else {
toastHelper.error(t("common.singup-failed")); toast.error(t("common.singup-failed"));
} }
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.error); toast.error(error.response.data.error);
} }
actionBtnLoadingState.setFinish(); actionBtnLoadingState.setFinish();
}; };

4
web/src/pages/AuthCallback.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
import { last } from "lodash-es"; import { last } from "lodash-es";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useSearchParams } from "react-router-dom"; import { useSearchParams } from "react-router-dom";
import * as api from "../helpers/api"; import * as api from "../helpers/api";
import toastHelper from "../components/Toast";
import { absolutifyLink } from "../helpers/utils"; import { absolutifyLink } from "../helpers/utils";
import { useUserStore } from "../store/module"; import { useUserStore } from "../store/module";
import Icon from "../components/Icon"; import Icon from "../components/Icon";
@ -41,7 +41,7 @@ const AuthCallback = () => {
if (user) { if (user) {
window.location.href = "/"; window.location.href = "/";
} else { } else {
toastHelper.error(t("message.login-failed")); toast.error(t("message.login-failed"));
} }
}) })
.catch((error: any) => { .catch((error: any) => {

5
web/src/pages/EmbedMemo.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { UNKNOWN_ID } from "../helpers/consts"; import { UNKNOWN_ID } from "../helpers/consts";
import { useMemoStore } from "../store/module"; import { useMemoStore } from "../store/module";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import toastHelper from "../components/Toast";
import MemoContent from "../components/MemoContent"; import MemoContent from "../components/MemoContent";
import MemoResources from "../components/MemoResources"; import MemoResources from "../components/MemoResources";
@ -36,8 +36,7 @@ const EmbedMemo = () => {
loadingState.setFinish(); loadingState.setFinish();
}) })
.catch((error) => { .catch((error) => {
console.error(error); toast.error(error.response.data.message);
toastHelper.error(error.response.data.message);
}); });
} }
}, []); }, []);

4
web/src/pages/Explore.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import { useGlobalStore, useLocationStore, useMemoStore, useUserStore } from "../store/module"; import { useGlobalStore, useLocationStore, useMemoStore, useUserStore } from "../store/module";
import { TAG_REG } from "../labs/marked/parser"; import { TAG_REG } from "../labs/marked/parser";
import { DEFAULT_MEMO_LIMIT } from "../helpers/consts"; import { DEFAULT_MEMO_LIMIT } from "../helpers/consts";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import toastHelper from "../components/Toast";
import Icon from "../components/Icon"; import Icon from "../components/Icon";
import MemoFilter from "../components/MemoFilter"; import MemoFilter from "../components/MemoFilter";
import Memo from "../components/Memo"; import Memo from "../components/Memo";
@ -84,7 +84,7 @@ const Explore = () => {
}); });
} catch (error: any) { } catch (error: any) {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
} }
}; };

4
web/src/pages/Home.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import { useEffect } from "react"; import { useEffect } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useLocation } from "react-router-dom"; import { useLocation } from "react-router-dom";
import { toast } from "react-hot-toast";
import { useGlobalStore, useUserStore } from "../store/module"; import { useGlobalStore, useUserStore } from "../store/module";
import toastHelper from "../components/Toast";
import MemoEditor from "../components/MemoEditor"; import MemoEditor from "../components/MemoEditor";
import MemoFilter from "../components/MemoFilter"; import MemoFilter from "../components/MemoFilter";
import MemoList from "../components/MemoList"; import MemoList from "../components/MemoList";
@ -21,7 +21,7 @@ function Home() {
if (userStore.isVisitorMode()) { if (userStore.isVisitorMode()) {
if (!owner) { if (!owner) {
toastHelper.error(t("message.user-not-found")); toast.error(t("message.user-not-found"));
} }
} }
}, [location]); }, [location]);

4
web/src/pages/MemoDetail.tsx
Unescape Escape View File

@ -1,11 +1,11 @@
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Link, useParams } from "react-router-dom"; import { Link, useParams } from "react-router-dom";
import { UNKNOWN_ID } from "../helpers/consts"; import { UNKNOWN_ID } from "../helpers/consts";
import { useGlobalStore, useLocationStore, useMemoStore, useUserStore } from "../store/module"; import { useGlobalStore, useLocationStore, useMemoStore, useUserStore } from "../store/module";
import useLoading from "../hooks/useLoading"; import useLoading from "../hooks/useLoading";
import toastHelper from "../components/Toast";
import MemoContent from "../components/MemoContent"; import MemoContent from "../components/MemoContent";
import MemoResources from "../components/MemoResources"; import MemoResources from "../components/MemoResources";
import "../less/memo-detail.less"; import "../less/memo-detail.less";
@ -44,7 +44,7 @@ const MemoDetail = () => {
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
toastHelper.error(error.response.data.message); toast.error(error.response.data.message);
}); });
} }
}, [location]); }, [location]);

12
web/yarn.lock
Unescape Escape View File

@ -1675,6 +1675,11 @@ globby@^11.1.0:
merge2 "^1.4.1" merge2 "^1.4.1"
slash "^3.0.0" slash "^3.0.0"
goober@^2.1.10:
version "2.1.12"
resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.12.tgz#6c1645314ac9a68fe76408e1f502c63df8a39042"
integrity sha512-yXHAvO08FU1JgTXX6Zn6sYCUFfB/OJSX8HHjDSgerZHZmFKAb08cykp5LBw5QnmyMcZyPRMqkdyHUSSzge788Q==
gopd@^1.0.1: gopd@^1.0.1:
version "1.0.1" version "1.0.1"
resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c" resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
@ -2505,6 +2510,13 @@ react-dom@^18.2.0:
loose-envify "^1.1.0" loose-envify "^1.1.0"
scheduler "^0.23.0" scheduler "^0.23.0"
react-hot-toast@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.0.tgz#b91e7a4c1b6e3068fc599d3d83b4fb48668ae51d"
integrity sha512-qnnVbXropKuwUpriVVosgo8QrB+IaPJCpL8oBI6Ov84uvHZ5QQcTp2qg6ku2wNfgJl6rlQXJIQU5q+5lmPOutA==
dependencies:
goober "^2.1.10"
react-i18next@^11.18.6: react-i18next@^11.18.6:
version "11.18.6" version "11.18.6"
resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.18.6.tgz#e159c2960c718c1314f1e8fcaa282d1c8b167887" resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.18.6.tgz#e159c2960c718c1314f1e8fcaa282d1c8b167887"

Write Preview
Loading…
Cancel
Save