chore: fix memo content click handler

web/src/components/ArchivedMemo.tsx

@@ -72,7 +72,7 @@ const ArchivedMemo: React.FC<Props> = (props: Props) => {
           </span>
         </div>
       </div>
-      <MemoContent className="memo-content-wrapper" content={memo.content} />
+      <MemoContent content={memo.content} />
       <MemoResources memo={memo} />
     </div>
   );

web/src/components/DailyMemo.tsx

@@ -28,7 +28,7 @@ const DailyMemo: React.FC<Props> = (props: Props) => {
       <div className="time-wrapper">
         <span className="normal-text">{memo.timeStr}</span>
       </div>
-      <MemoContent className="memo-content-container" content={memo.content} displayConfig={displayConfig} />
+      <MemoContent content={memo.content} displayConfig={displayConfig} />
       <div className="split-line"></div>
     </div>
   );

web/src/components/Memo.tsx

@@ -35,7 +35,6 @@ const Memo: React.FC<Props> = (props: Props) => {
   const { t, i18n } = useTranslation();
   const [createdAtStr, setCreatedAtStr] = useState<string>(getFormatedMemoCreatedAtStr(memo.createdTs, i18n.language));
   const memoContainerRef = useRef<HTMLDivElement>(null);
-  const memoContentContainerRef = useRef<HTMLDivElement>(null);
   const isVisitorMode = userService.isVisitorMode();
 
   useEffect(() => {
@@ -122,7 +121,7 @@ const Memo: React.FC<Props> = (props: Props) => {
       }
 
       const status = targetEl.dataset?.value;
-      const todoElementList = [...(memoContentContainerRef.current?.querySelectorAll(`span.todo-block[data-value=${status}]`) ?? [])];
+      const todoElementList = [...(memoContainerRef.current?.querySelectorAll(`span.todo-block[data-value=${status}]`) ?? [])];
       for (const element of todoElementList) {
         if (element === targetEl) {
           const index = indexOf(todoElementList, element);
@@ -207,7 +206,6 @@ const Memo: React.FC<Props> = (props: Props) => {
         </div>
       </div>
       <MemoContent
-        className=""
         content={memo.content}
         onMemoContentClick={handleMemoContentClick}
         onMemoContentDoubleClick={handleMemoContentDoubleClick}

web/src/components/MemoCardDialog.tsx

@@ -178,12 +178,7 @@ const MemoCardDialog: React.FC<Props> = (props: Props) => {
           </div>
         </div>
         <div className="memo-container">
-          <MemoContent
-            className=""
-            displayConfig={{ enableExpand: false }}
-            content={memo.content}
-            onMemoContentClick={handleMemoContentClick}
-          />
+          <MemoContent displayConfig={{ enableExpand: false }} content={memo.content} onMemoContentClick={handleMemoContentClick} />
           <MemoResources memo={memo} />
         </div>
         <div className="layer-container"></div>

web/src/components/MemoContent.tsx

@@ -14,8 +14,8 @@ export interface DisplayConfig {
 }
 
 interface Props {
-  className: string;
   content: string;
+  className?: string;
   displayConfig?: Partial<DisplayConfig>;
   onMemoContentClick?: (e: React.MouseEvent) => void;
   onMemoContentDoubleClick?: (e: React.MouseEvent) => void;
@@ -78,7 +78,7 @@ const MemoContent: React.FC<Props> = (props: Props) => {
   };
 
   return (
-    <div className={`memo-content-wrapper ${className}`}>
+    <div className={`memo-content-wrapper ${className || ""}`}>
       <div
         ref={memoContentContainerRef}
         className={`memo-content-text ${state.expandButtonStatus === 0 ? "expanded" : ""}`}

web/src/less/memo-content.less

@@ -22,7 +22,7 @@
     }
 
     .tag-span {
-      @apply inline-block w-auto font-mono text-blue-600;
+      @apply inline-block w-auto font-mono text-blue-600 cursor-pointer;
     }
 
     .memo-link-text {