chore: fix memo content click handler

This commit is contained in:
Steven 2022-09-19 23:01:14 +08:00
parent 366afdd1e4
commit c60c58ed69
6 changed files with 7 additions and 14 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -22,7 +22,7 @@
} }
.tag-span { .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 { .memo-link-text {