cinny/src/app/hooks/useTypingStatusUpdater.ts

import { MatrixClient } from 'matrix-js-sdk';
import { useMemo, useRef } from 'react';
import { TYPING_TIMEOUT_MS } from '../state/typingMembers';

type TypingStatusUpdater = (typing: boolean) => void;

export const useTypingStatusUpdater = (mx: MatrixClient, roomId: string): TypingStatusUpdater => {
  const statusSentTsRef = useRef<number>(0);
  const typingTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);

  const sendTypingStatus: TypingStatusUpdater = useMemo(() => {
    statusSentTsRef.current = 0;
    return (typing) => {
      if (typing) {
        if (Date.now() - statusSentTsRef.current < TYPING_TIMEOUT_MS) {
          return;
        }

        mx.sendTyping(roomId, true, TYPING_TIMEOUT_MS);
        const sentTs = Date.now();
        statusSentTsRef.current = sentTs;

        // Cancel any previous pending timeout before scheduling a new one
        if (typingTimerRef.current !== undefined) clearTimeout(typingTimerRef.current);
        typingTimerRef.current = setTimeout(() => {
          typingTimerRef.current = undefined;
          if (statusSentTsRef.current === sentTs) {
            mx.sendTyping(roomId, false, TYPING_TIMEOUT_MS);
            statusSentTsRef.current = 0;
          }
        }, TYPING_TIMEOUT_MS);
        return;
      }

      if (Date.now() - statusSentTsRef.current < TYPING_TIMEOUT_MS) {
        mx.sendTyping(roomId, false, TYPING_TIMEOUT_MS);
      }
      statusSentTsRef.current = 0;
    };
  }, [mx, roomId]);

  return sendTypingStatus;
};