fix: adjust cooldown interval calculation for messages coming from future (#2101)

Author: MartinCupela

src/components/MessageInput/CooldownTimer.tsx

@@ -21,7 +21,7 @@ export const CooldownTimer = ({ cooldownInterval, setCooldownRemaining }: Cooldo
 
   return (
     <div className='str-chat__message-input-cooldown' data-testid='cooldown-timer'>
-      {seconds === 0 ? null : seconds}
+      {seconds}
     </div>
   );
 };

src/components/MessageInput/hooks/__tests__/useCooldownTimer.test.js

@@ -20,30 +20,89 @@ async function renderUseCooldownTimerHook({ channel, chatContext }) {
 const cid = 'cid';
 const cooldown = 30;
 describe('useCooldownTimer', () => {
-  it('should set remaining cooldown time to if no channel.cooldown', async () => {
+  it('should set remaining cooldown time to 0 if no channel.cooldown', async () => {
     const channel = { cid };
     const chatContext = { latestMessageDatesByChannels: {} };
     const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
     expect(result.current.cooldownRemaining).toBe(0);
   });
+
+  it('should set remaining cooldown time to 0 if no channel.cooldown and latest message time is in the future', async () => {
+    const channel = { cid };
+    const lastSentSecondsAhead = 5;
+    const chatContext = {
+      latestMessageDatesByChannels: {
+        cid: new Date(new Date().getTime() + lastSentSecondsAhead * 1000),
+      },
+    };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(0);
+  });
+
+  it('should set remaining cooldown time to 0 if no channel.cooldown and latest message time is in the past', async () => {
+    const channel = { cid };
+    const lastSentSecondsAgo = 5;
+    const chatContext = {
+      latestMessageDatesByChannels: {
+        cid: new Date(new Date().getTime() - lastSentSecondsAgo * 1000),
+      },
+    };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(0);
+  });
+
+  it('should set remaining cooldown time to 0 if channel.cooldown is 0', async () => {
+    const channel = { cid, data: { cooldown: 0 } };
+    const chatContext = { latestMessageDatesByChannels: {} };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(0);
+  });
+
+  it('should set remaining cooldown time to 0 if channel.cooldown is 0 and latest message time is in the future', async () => {
+    const channel = { cid, data: { cooldown: 0 } };
+    const lastSentSecondsAhead = 5;
+    const chatContext = {
+      latestMessageDatesByChannels: {
+        cid: new Date(new Date().getTime() + lastSentSecondsAhead * 1000),
+      },
+    };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(0);
+  });
+
+  it('should set remaining cooldown time to 0 if channel.cooldown is 0 and latest message time is in the past', async () => {
+    const channel = { cid, data: { cooldown: 0 } };
+    const lastSentSecondsAgo = 5;
+    const chatContext = {
+      latestMessageDatesByChannels: {
+        cid: new Date(new Date().getTime() - lastSentSecondsAgo * 1000),
+      },
+    };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(0);
+  });
+
   it('should set remaining cooldown time to 0 if skip-slow-mode is among own_capabilities', async () => {
     const channel = { cid, data: { cooldown, own_capabilities: ['skip-slow-mode'] } };
     const chatContext = { latestMessageDatesByChannels: { cid: new Date() } };
     const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
     expect(result.current.cooldownRemaining).toBe(0);
   });
+
   it('should set remaining cooldown time to 0 if no previous messages sent', async () => {
     const channel = { cid, data: { cooldown } };
     const chatContext = { latestMessageDatesByChannels: {} };
     const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
     expect(result.current.cooldownRemaining).toBe(0);
   });
+
   it('should set remaining cooldown time to 0 if previous messages sent earlier than channel.cooldown', async () => {
     const channel = { cid, data: { cooldown } };
     const chatContext = { latestMessageDatesByChannels: { cid: new Date('1970-1-1') } };
     const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
     expect(result.current.cooldownRemaining).toBe(0);
   });
+
   it('should set remaining cooldown time to time left from previous messages sent', async () => {
     const channel = { cid, data: { cooldown } };
     const lastSentSecondsAgo = 5;
@@ -55,4 +114,16 @@ describe('useCooldownTimer', () => {
     const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
     expect(result.current.cooldownRemaining).toBe(cooldown - lastSentSecondsAgo);
   });
+
+  it('should consider last message with timestamp from future as created now', async () => {
+    const channel = { cid, data: { cooldown } };
+    const lastSentSecondsAhead = 5;
+    const chatContext = {
+      latestMessageDatesByChannels: {
+        cid: new Date(new Date().getTime() + lastSentSecondsAhead * 1000),
+      },
+    };
+    const { result } = await renderUseCooldownTimerHook({ channel, chatContext });
+    expect(result.current.cooldownRemaining).toBe(cooldown);
+  });
 });

src/components/MessageInput/hooks/useCooldownTimer.tsx

@@ -36,11 +36,14 @@ export const useCooldownTimer = <
 
   useEffect(() => {
     const timeSinceOwnLastMessage = ownLatestMessageDate
-      ? (new Date().getTime() - ownLatestMessageDate.getTime()) / 1000
+      ? // prevent negative values
+        Math.max(0, (new Date().getTime() - ownLatestMessageDate.getTime()) / 1000)
       : undefined;
 
     setCooldownRemaining(
-      !skipCooldown && timeSinceOwnLastMessage && cooldownInterval > timeSinceOwnLastMessage
+      !skipCooldown &&
+        typeof timeSinceOwnLastMessage !== 'undefined' &&
+        cooldownInterval > timeSinceOwnLastMessage
         ? Math.round(cooldownInterval - timeSinceOwnLastMessage)
         : 0,
     );