chore: update memo content key

web/src/components/MemoContent/EmbeddedContent/EmbeddedMemo.tsx

@@ -42,7 +42,7 @@ const EmbeddedMemo = ({ resourceId, params: paramsStr }: Props) => {
   if (inlineMode) {
     return (
       <div className="w-full">
-        <MemoContent memoId={memo.id} content={memo.content} embeddedMemos={context.embeddedMemos} />
+        <MemoContent key={`${memo.id}-${memo.updateTime}`} memoId={memo.id} content={memo.content} embeddedMemos={context.embeddedMemos} />
         <MemoResourceListView resources={memo.resources} />
       </div>
     );
@@ -56,7 +56,7 @@ const EmbeddedMemo = ({ resourceId, params: paramsStr }: Props) => {
           <Icon.ArrowUpRight className="w-5 h-auto opacity-80 text-gray-400" />
         </Link>
       </div>
-      <MemoContent memoId={memo.id} content={memo.content} embeddedMemos={context.embeddedMemos} />
+      <MemoContent key={`${memo.id}-${memo.updateTime}`} memoId={memo.id} content={memo.content} embeddedMemos={context.embeddedMemos} />
       <MemoResourceListView resources={memo.resources} />
     </div>
   );

web/src/components/MemoContent/OrderedList.tsx

@@ -13,9 +13,11 @@ const OrderedList: React.FC<Props> = ({ number, indent, children }: Props) => {
   return (
     <ol>
       <li className="w-full flex flex-row">
+        {indent > 0 && (
           <div className="block font-mono shrink-0">
             <span>{repeat(" ", indent)}</span>
           </div>
+        )}
         <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
           <div className="w-7 h-6 flex justify-center items-center">
             <span className="opacity-80">{number}.</span>

web/src/components/MemoContent/TaskList.tsx

 import { Checkbox } from "@mui/joy";
 import classNames from "classnames";
 import { repeat } from "lodash-es";
-import { useContext } from "react";
+import { useContext, useState } from "react";
 import { useMemoStore } from "@/store/v1";
 import { Node, NodeType } from "@/types/node";
 import Renderer from "./Renderer";
@@ -18,6 +18,7 @@ interface Props {
 const TaskList: React.FC<Props> = ({ index, indent, complete, children }: Props) => {
   const context = useContext(RendererContext);
   const memoStore = useMemoStore();
+  const [checked] = useState(complete);
 
   const handleCheckboxChange = async (on: boolean) => {
     if (context.readonly || !context.memoId) {
@@ -48,12 +49,14 @@ const TaskList: React.FC<Props> = ({ index, indent, complete, children }: Props)
   return (
     <ul>
       <li className="w-full flex flex-row">
+        {indent > 0 && (
           <div className="block font-mono shrink-0">
             <span>{repeat(" ", indent)}</span>
           </div>
+        )}
         <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
           <div className="w-7 h-6 flex justify-center items-center">
-            <Checkbox size="sm" checked={complete} disabled={context.readonly} onChange={(e) => handleCheckboxChange(e.target.checked)} />
+            <Checkbox size="sm" checked={checked} disabled={context.readonly} onChange={(e) => handleCheckboxChange(e.target.checked)} />
           </div>
           <div className={classNames(complete && "line-through opacity-80")}>
             {children.map((child, index) => (

web/src/components/MemoContent/UnorderedList.tsx

@@ -12,9 +12,11 @@ const UnorderedList: React.FC<Props> = ({ indent, children }: Props) => {
   return (
     <ul>
       <li className="w-full flex flex-row">
+        {indent > 0 && (
           <div className="block font-mono shrink-0">
             <span>{repeat(" ", indent)}</span>
           </div>
+        )}
         <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
           <div className="w-7 h-6 flex justify-center items-center">
             <span className="opacity-80">•</span>

web/src/components/MemoView.tsx

@@ -257,7 +257,13 @@ const MemoView: React.FC<Props> = (props: Props) => {
           )}
         </div>
       </div>
-      <MemoContent memoId={memo.id} content={memo.content} readonly={readonly} onClick={handleMemoContentClick} />
+      <MemoContent
+        key={`${memo.id}-${memo.updateTime}`}
+        memoId={memo.id}
+        content={memo.content}
+        readonly={readonly}
+        onClick={handleMemoContentClick}
+      />
       <MemoResourceListView resources={memo.resources} />
       <MemoRelationListView memo={memo} relationList={referenceRelations} />
     </div>

web/src/pages/Archived.tsx

@@ -125,7 +125,7 @@ const Archived = () => {
                     </Tooltip>
                   </div>
                 </div>
-                <MemoContent memoId={memo.id} content={memo.content} readonly={true} />
+                <MemoContent key={`${memo.id}-${memo.updateTime}`} memoId={memo.id} content={memo.content} readonly={true} />
               </div>
             ))
           )}

web/src/pages/Home.tsx

@@ -73,7 +73,7 @@ const Home = () => {
           <div className="flex flex-col justify-start items-start w-full max-w-full pb-28">
             <MemoFilter className="px-2 pb-2" />
             {sortedMemos.map((memo) => (
-              <MemoView key={`${memo.id}-${memo.displayTime}`} memo={memo} showVisibility showPinned />
+              <MemoView key={`${memo.id}-${memo.updateTime}`} memo={memo} showVisibility showPinned />
             ))}
             {isRequesting ? (
               <div className="flex flex-row justify-center items-center w-full my-4 text-gray-400">

web/src/pages/MemoDetail.tsx

@@ -137,7 +137,7 @@ const MemoDetail = () => {
               </Link>
             </div>
           )}
-          <MemoContent memoId={memo.id} content={memo.content} readonly={readonly} />
+          <MemoContent key={`${memo.id}-${memo.updateTime}`} memoId={memo.id} content={memo.content} readonly={readonly} />
           <MemoResourceListView resources={memo.resources} />
           <MemoRelationListView memo={memo} relationList={referenceRelations} />
           <div className="w-full mt-3 flex flex-row justify-between items-center gap-2">