Allow timer to be configurable.

src/reactions/RaisedHandIndicator.test.tsx

@@ -22,21 +22,21 @@ describe("RaisedHandIndicator", () => {
   test("renders an indicator when a hand has been raised", () => {
     const dateTime = new Date();
     const { container } = render(
-      <RaisedHandIndicator raisedHandTime={dateTime} />,
+      <RaisedHandIndicator raisedHandTime={dateTime} showTimer />,
     );
     expect(container.firstChild).toMatchSnapshot();
   });
   test("renders an indicator when a hand has been raised with the expected time", () => {
     const dateTime = new Date(new Date().getTime() - 60000);
     const { container } = render(
-      <RaisedHandIndicator raisedHandTime={dateTime} />,
+      <RaisedHandIndicator raisedHandTime={dateTime} showTimer />,
     );
     expect(container.firstChild).toMatchSnapshot();
   });
   test("renders a smaller indicator when minature is specified", () => {
     const dateTime = new Date();
     const { container } = render(
-      <RaisedHandIndicator raisedHandTime={dateTime} minature />,
+      <RaisedHandIndicator raisedHandTime={dateTime} minature showTimer />,
     );
     expect(container.firstChild).toMatchSnapshot();
   });

src/reactions/RaisedHandIndicator.tsx

@@ -13,14 +13,16 @@ import styles from "./RaisedHandIndicator.module.css";
 export function RaisedHandIndicator({
   raisedHandTime,
   minature,
+  showTimer,
 }: {
   raisedHandTime?: Date;
   minature?: boolean;
+  showTimer?: boolean;
 }): ReactNode {
   const [raisedHandDuration, setRaisedHandDuration] = useState("");
 
   useEffect(() => {
-    if (!raisedHandTime) {
+    if (!raisedHandTime || !showTimer) {
       return;
     }
     const calculateTime = (): void => {
@@ -36,7 +38,7 @@ export function RaisedHandIndicator({
     calculateTime();
     const to = setInterval(calculateTime, 1000);
     return (): void => clearInterval(to);
-  }, [setRaisedHandDuration, raisedHandTime]);
+  }, [setRaisedHandDuration, raisedHandTime, showTimer]);
 
   if (raisedHandTime) {
     return (
@@ -54,7 +56,7 @@ export function RaisedHandIndicator({
             ✋
           </span>
         </div>
-        <p>{raisedHandDuration}</p>
+        {showTimer && <p>{raisedHandDuration}</p>}
       </div>
     );
   }