From 516061a553957acb7c63e427f1100b9041943753 Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Sat, 9 Nov 2024 15:40:39 +0400
Subject: [PATCH] Message Context Menu: Display last edit time (#5176)

---
 .../middle/message/LastEditTimeMenuItem.tsx   | 37 +++++++++++++++++++
 .../middle/message/MessageContextMenu.tsx     |  7 ++++
 .../middle/message/ReadTimeMenuItem.tsx       |  2 +-
 ...m.module.scss => TimeMenuItem.module.scss} |  0
 src/config.ts                                 |  2 +-
 5 files changed, 46 insertions(+), 2 deletions(-)
 create mode 100644 src/components/middle/message/LastEditTimeMenuItem.tsx
 rename src/components/middle/message/{ReadTimeMenuItem.module.scss => TimeMenuItem.module.scss} (100%)

diff --git a/src/components/middle/message/LastEditTimeMenuItem.tsx b/src/components/middle/message/LastEditTimeMenuItem.tsx
new file mode 100644
index 000000000..0056be0c1
--- /dev/null
+++ b/src/components/middle/message/LastEditTimeMenuItem.tsx
@@ -0,0 +1,37 @@
+import React, { memo } from '../../../lib/teact/teact';
+
+import type { ApiMessage } from '../../../api/types';
+
+import { formatDateAtTime } from '../../../util/dates/dateFormat';
+
+import useOldLang from '../../../hooks/useOldLang';
+
+import MenuItem from '../../ui/MenuItem';
+import MenuSeparator from '../../ui/MenuSeparator';
+import Skeleton from '../../ui/placeholder/Skeleton';
+
+import styles from './TimeMenuItem.module.scss';
+
+type OwnProps = {
+  message: ApiMessage;
+};
+
+function LastEditTimeMenuItem({
+  message,
+}: OwnProps) {
+  const lang = useOldLang();
+  const { editDate } = message;
+  const shouldRenderSkeleton = !editDate;
+
+  return (
+    <>
+      <MenuSeparator size="thick" />
+      <MenuItem icon="edit" className={styles.item}>
+        {shouldRenderSkeleton ? <Skeleton className={styles.skeleton} /> : Boolean(editDate)
+          && lang('Chat.PrivateMessageEditTimestamp.Date', formatDateAtTime(lang, editDate * 1000))}
+      </MenuItem>
+    </>
+  );
+}
+
+export default memo(LastEditTimeMenuItem);
diff --git a/src/components/middle/message/MessageContextMenu.tsx b/src/components/middle/message/MessageContextMenu.tsx
index 63feafbbe..274b23a64 100644
--- a/src/components/middle/message/MessageContextMenu.tsx
+++ b/src/components/middle/message/MessageContextMenu.tsx
@@ -37,6 +37,7 @@ import Menu from '../../ui/Menu';
 import MenuItem from '../../ui/MenuItem';
 import MenuSeparator from '../../ui/MenuSeparator';
 import Skeleton from '../../ui/placeholder/Skeleton';
+import LastEditTimeMenuItem from './LastEditTimeMenuItem';
 import ReactionSelector from './reactions/ReactionSelector';
 import ReadTimeMenuItem from './ReadTimeMenuItem';
 
@@ -234,6 +235,7 @@ const MessageContextMenu: FC<OwnProps> = ({
   const noReactions = !isPrivate && !enabledReactions;
   const withReactions = canShowReactionList && !noReactions;
   const isSponsoredMessage = !('id' in message);
+  const isEdited = ('isEdited' in message) && message.isEdited;
   const messageId = !isSponsoredMessage ? message.id : '';
   const seenByDates = !isSponsoredMessage ? message.seenByDates : undefined;
 
@@ -481,6 +483,11 @@ const MessageContextMenu: FC<OwnProps> = ({
             <MenuItem icon="close-circle" onClick={onSponsoredHide}>{lang('HideAd')}</MenuItem>
           </>
         )}
+        {isEdited && (
+          <LastEditTimeMenuItem
+            message={message}
+          />
+        )}
         {(canShowSeenBy || canShowReactionsCount) && !isSponsoredMessage && (
           <>
             <MenuSeparator size={hasCustomEmoji ? 'thin' : 'thick'} />
diff --git a/src/components/middle/message/ReadTimeMenuItem.tsx b/src/components/middle/message/ReadTimeMenuItem.tsx
index 49f5c8a75..5901f08f5 100644
--- a/src/components/middle/message/ReadTimeMenuItem.tsx
+++ b/src/components/middle/message/ReadTimeMenuItem.tsx
@@ -12,7 +12,7 @@ import MenuSeparator from '../../ui/MenuSeparator';
 import Skeleton from '../../ui/placeholder/Skeleton';
 import Transition from '../../ui/Transition';
 
-import styles from './ReadTimeMenuItem.module.scss';
+import styles from './TimeMenuItem.module.scss';
 
 type OwnProps = {
   message: ApiMessage;
diff --git a/src/components/middle/message/ReadTimeMenuItem.module.scss b/src/components/middle/message/TimeMenuItem.module.scss
similarity index 100%
rename from src/components/middle/message/ReadTimeMenuItem.module.scss
rename to src/components/middle/message/TimeMenuItem.module.scss
diff --git a/src/config.ts b/src/config.ts
index 1c6e96c1a..89a4aa245 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -51,7 +51,7 @@ export const MEDIA_PROGRESSIVE_CACHE_DISABLED = false;
 export const MEDIA_PROGRESSIVE_CACHE_NAME = 'tt-media-progressive';
 export const MEDIA_CACHE_MAX_BYTES = 512 * 1024; // 512 KB
 export const CUSTOM_BG_CACHE_NAME = 'tt-custom-bg';
-export const LANG_CACHE_NAME = 'tt-lang-packs-v43';
+export const LANG_CACHE_NAME = 'tt-lang-packs-v44';
 export const ASSET_CACHE_NAME = 'tt-assets';
 export const AUTODOWNLOAD_FILESIZE_MB_LIMITS = [1, 5, 10, 50, 100, 500];
 export const DATA_BROADCAST_CHANNEL_NAME = 'tt-global';