refactor: extract useActivityKeysOfSendStatus hook to eliminate duplication

Both SendFailed and LongSend shared the same useMemo pattern for
filtering activities by send status and isPresentational. Extracted
into a shared hook useActivityKeysOfSendStatus(status).

Author: isherstneva

packages/component/src/Transcript/LiveRegion/LongSend.tsx

@@ -1,11 +1,11 @@
 import { hooks } from 'botframework-webchat-api';
-import { memo, useEffect, useMemo, useRef, useState } from 'react';
+import { memo, useEffect, useRef, useState } from 'react';
 
 import { useLiveRegion } from '../../providers/LiveRegionTwin';
 import { SENDING } from '../../types/internal/SendStatus';
-import isPresentational from './isPresentational';
+import useActivityKeysOfSendStatus from './useActivityKeysOfSendStatus';
 
-const { useGetActivityByKey, useLocalizer, usePonyfill, useSendStatusByActivityKey } = hooks;
+const { useLocalizer, usePonyfill } = hooks;
 
 const SENDING_ANNOUNCEMENT_DELAY = 3000;
 
@@ -19,8 +19,6 @@ const SENDING_ANNOUNCEMENT_DELAY = 3000;
  * Presentational activities (e.g. `event` or `typing`) are excluded to reduce noise.
  */
 const LiveRegionLongSend = () => {
-  const [sendStatusByActivityKey] = useSendStatusByActivityKey();
-  const getActivityByKey = useGetActivityByKey();
   const localize = useLocalizer();
   const [{ clearTimeout, setTimeout }] = usePonyfill();
 
@@ -33,21 +31,7 @@ const LiveRegionLongSend = () => {
   const [tick, setTick] = useState(0);
 
   /** Keys of outgoing non-presentational activities that are currently in the sending state. */
-  const sendingKeys = useMemo<Set<string>>(() => {
-    const keys = new Set<string>();
-
-    for (const [key, sendStatus] of sendStatusByActivityKey) {
-      if (sendStatus !== SENDING) {
-        continue;
-      }
-
-      if (!isPresentational(getActivityByKey(key))) {
-        keys.add(key);
-      }
-    }
-
-    return keys;
-  }, [getActivityByKey, sendStatusByActivityKey]);
+  const sendingKeys = useActivityKeysOfSendStatus(SENDING);
 
   /**
    * Arm a per-key timer when a key newly enters `sendingKeys`.

packages/component/src/Transcript/LiveRegion/SendFailed.tsx

@@ -4,9 +4,9 @@ import { memo, useMemo } from 'react';
 import usePrevious from '../../hooks/internal/usePrevious';
 import { useLiveRegion } from '../../providers/LiveRegionTwin';
 import { SEND_FAILED } from '../../types/internal/SendStatus';
-import isPresentational from './isPresentational';
+import useActivityKeysOfSendStatus from './useActivityKeysOfSendStatus';
 
-const { useGetActivityByKey, useLocalizer, useSendStatusByActivityKey } = hooks;
+const { useLocalizer } = hooks;
 
 /**
  * React component to on-demand narrate "Failed to send message" at the end of the live region.
@@ -19,8 +19,6 @@ const { useGetActivityByKey, useLocalizer, useSendStatusByActivityKey } = hooks;
  * Thus, we need to use a live region "footnote" to indicate the message was failed to send.
  */
 const LiveRegionSendFailed = () => {
-  const [sendStatusByActivityKey] = useSendStatusByActivityKey();
-  const getActivityByKey = useGetActivityByKey();
   const localize = useLocalizer();
 
   /**
@@ -29,17 +27,7 @@ const LiveRegionSendFailed = () => {
    * Activities which are presentational, such as `event` or `typing`, are ignored to reduce confusions.
    * "Failed to send message" should not be narrated for presentational activities.
    */
-  const activityKeysOfSendFailed = useMemo<Set<string>>(
-    () =>
-      Array.from(sendStatusByActivityKey).reduce(
-        (activityKeysOfSendFailed, [key, sendStatus]) =>
-          sendStatus === SEND_FAILED && !isPresentational(getActivityByKey(key))
-            ? activityKeysOfSendFailed.add(key)
-            : activityKeysOfSendFailed,
-        new Set<string>()
-      ),
-    [getActivityByKey, sendStatusByActivityKey]
-  );
+  const activityKeysOfSendFailed = useActivityKeysOfSendStatus(SEND_FAILED);
 
   /** Returns localized "Failed to send message." */
   const liveRegionSendFailedAlt = localize('TRANSCRIPT_LIVE_REGION_SEND_FAILED_ALT');

packages/component/src/Transcript/LiveRegion/useActivityKeysOfSendStatus.ts

@@ -0,0 +1,30 @@
+import { hooks } from 'botframework-webchat-api';
+import { useMemo } from 'react';
+
+import type { SendStatus } from '../../types/internal/SendStatus';
+import isPresentational from './isPresentational';
+
+const { useGetActivityByKey, useSendStatusByActivityKey } = hooks;
+
+/**
+ * Returns the set of keys of outgoing non-presentational activities that currently
+ * have the given send status.
+ *
+ * Presentational activities (e.g. `event` or `typing`) are excluded to reduce noise.
+ */
+export default function useActivityKeysOfSendStatus(status: SendStatus): Set<string> {
+  const [sendStatusByActivityKey] = useSendStatusByActivityKey();
+  const getActivityByKey = useGetActivityByKey();
+
+  return useMemo<Set<string>>(() => {
+    const keys = new Set<string>();
+
+    for (const [key, sendStatus] of sendStatusByActivityKey) {
+      if (sendStatus === status && !isPresentational(getActivityByKey(key))) {
+        keys.add(key);
+      }
+    }
+
+    return keys;
+  }, [getActivityByKey, sendStatusByActivityKey, status]);
+}