From 50d41c456b418593acc0daddd78443082a13a6e8 Mon Sep 17 00:00:00 2001
From: boojack <stevenlgtm@gmail.com>
Date: Thu, 24 Nov 2022 19:55:52 +0800
Subject: [PATCH] chore: change memo created time (#556)

---
 web/src/components/ChangeMemoCreatedTsDialog.tsx | 3 +++
 web/src/components/Memo.tsx                      | 9 ++++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/web/src/components/ChangeMemoCreatedTsDialog.tsx b/web/src/components/ChangeMemoCreatedTsDialog.tsx
index b3fc7baf..8cf30039 100644
--- a/web/src/components/ChangeMemoCreatedTsDialog.tsx
+++ b/web/src/components/ChangeMemoCreatedTsDialog.tsx
@@ -69,6 +69,9 @@ const ChangeMemoCreatedTsDialog: React.FC<Props> = (props: Props) => {
         </button>
       </div>
       <div className="dialog-content-container">
+        <p className="w-full bg-yellow-100 border border-yellow-400 rounded p-2 text-xs leading-4">
+          THIS IS NOT A NORMAL BEHAVIOR. PLEASE MAKE SURE YOU REALLY NEED IT.
+        </p>
         <label className="form-label input-form-label">
           <input type="datetime-local" value={createdAt} max={maxDatetimeValue} onChange={handleDatetimeInputChange} />
         </label>
diff --git a/web/src/components/Memo.tsx b/web/src/components/Memo.tsx
index 25f05bc1..3ab5e69d 100644
--- a/web/src/components/Memo.tsx
+++ b/web/src/components/Memo.tsx
@@ -12,6 +12,7 @@ import MemoContent from "./MemoContent";
 import MemoResources from "./MemoResources";
 import showShareMemoImageDialog from "./ShareMemoImageDialog";
 import showPreviewImageDialog from "./PreviewImageDialog";
+import showChangeMemoCreatedTsDialog from "./ChangeMemoCreatedTsDialog";
 import "../less/memo.less";
 
 dayjs.extend(relativeTime);
@@ -171,6 +172,10 @@ const Memo: React.FC<Props> = (props: Props) => {
     editorStateService.setEditMemoWithId(memo.id);
   };
 
+  const handleMemoDisplayTimeClick = () => {
+    showChangeMemoCreatedTsDialog(memo.id);
+  };
+
   const handleMemoVisibilityClick = (visibility: Visibility) => {
     const currVisibilityQuery = locationService.getState().query?.visibility;
     if (currVisibilityQuery === visibility) {
@@ -185,7 +190,9 @@ const Memo: React.FC<Props> = (props: Props) => {
       {memo.pinned && <div className="corner-container"></div>}
       <div className="memo-top-wrapper">
         <div className="status-text-container">
-          <span className="time-text">{displayTimeStr}</span>
+          <span className="time-text" onDoubleClick={handleMemoDisplayTimeClick}>
+            {displayTimeStr}
+          </span>
           {memo.visibility !== "PRIVATE" && !isVisitorMode && (
             <span
               className={`status-text ${memo.visibility.toLocaleLowerCase()}`}