fixed prettier issues for MemoActionMenu.tsx

This commit is contained in:
Anthony Cooper 2025-08-31 22:12:53 -04:00
parent a0d7b7c75b
commit 8d50cc0f1b
1 changed files with 26 additions and 45 deletions

View File

@ -90,16 +90,10 @@ const MemoActionMenu = observer((props: Props) => {
} }
}; };
//async () => {} = () => Promise.resolve({})
//await promiseFunc, this just waits for the promise to be fulfilled
//use async just so we can use await inside, dont care about returned Promise
const handleToggleMemoStatusClick = async () => { const handleToggleMemoStatusClick = async () => {
//changing the state
const state = memo.state === State.ARCHIVED ? State.NORMAL : State.ARCHIVED; const state = memo.state === State.ARCHIVED ? State.NORMAL : State.ARCHIVED;
//showing message depending on state
const message = memo.state === State.ARCHIVED ? t("message.restored-successfully") : t("message.archived-successfully"); const message = memo.state === State.ARCHIVED ? t("message.restored-successfully") : t("message.archived-successfully");
try { try {
//must wait for this promise returned by updateMemo to be fulfileld before continuing
await memoStore.updateMemo( await memoStore.updateMemo(
{ {
name: memo.name, name: memo.name,
@ -108,44 +102,32 @@ const MemoActionMenu = observer((props: Props) => {
["state"], ["state"],
); );
//Show toast with Undo button toast.custom((tToast) => (
//input is function that takes in the toast object we will work with and it will be used in the output of the higher order function <div className="flex items-center gap-3 ml-auto bg-primary dark:bg-primary p-3 rounded-xl shadow">
toast.custom( <span className="text-background">{message}</span>
( <button
tToast, className="ml-auto text-background italic hover:underline"
) => ( onClick={async () => {
//div container await memoStore.updateMemo(
<div className="flex items-center gap-3 ml-auto bg-primary dark:bg-primary p-3 rounded-xl shadow"> {
<span className="text-background">{message}</span> name: memo.name,
<button state: memo.state,
//attributes },
className="ml-auto text-background italic hover:underline" ["state"],
//onClick attribute is using async only so we can use await );
onClick={async () => { toast.dismiss(tToast.id);
//must wait for this promise returned by updateMemo to be fulfileld before continuing toast.custom((tToast) => (
await memoStore.updateMemo( <div className="flex items-center gap-3 ml-auto bg-primary dark:bg-primary p-3 rounded-xl shadow">
{ <span className="text-background">{t("message.undo-successful")}</span>
name: memo.name, </div>
state: memo.state, // revert to old state ));
}, memoUpdatedCallback();
["state"], }}
); >
toast.dismiss(tToast.id); // close the toast ({t("common.undo")})
toast.custom( </button>
(tToast) => ( </div>
<div className="flex items-center gap-3 ml-auto bg-primary dark:bg-primary p-3 rounded-xl shadow"> ));
<span className="text-background">{t("message.undo-successful")}</span>
</div>
)
); // optional success toast
memoUpdatedCallback();
}}
>
({t("common.undo")})
</button>
</div>
),
);
} catch (error: any) { } catch (error: any) {
toast.error(error.details); toast.error(error.details);
console.error(error); console.error(error);
@ -188,7 +170,6 @@ const MemoActionMenu = observer((props: Props) => {
const children = node.listNode.children; const children = node.listNode.children;
for (let i = 0; i < children.length; i++) { for (let i = 0; i < children.length; i++) {
if (children[i].type === NodeType.TASK_LIST_ITEM && children[i].taskListItemNode?.complete) { if (children[i].type === NodeType.TASK_LIST_ITEM && children[i].taskListItemNode?.complete) {
// Remove completed taskList item and next line breaks
children.splice(i, 1); children.splice(i, 1);
if (children[i]?.type === NodeType.LINE_BREAK) { if (children[i]?.type === NodeType.LINE_BREAK) {
children.splice(i, 1); children.splice(i, 1);