implement meeting end timer

Author: Regaddi

src/DailyParticipants.tsx

@@ -47,6 +47,11 @@ export const localIdState = atom<string>({
   default: '',
 });
 
+export const localJoinDateState = atom<Date | null>({
+  key: RECOIL_PREFIX + 'local-joined-date',
+  default: null,
+});
+
 export const participantIdsState = atom<string[]>({
   key: RECOIL_PREFIX + 'participant-ids',
   default: [],
@@ -167,7 +172,17 @@ export const DailyParticipants: React.FC<React.PropsWithChildren<{}>> = ({
   }, [daily, initParticipants]);
   useDailyEvent('started-camera', handleInitEvent);
   useDailyEvent('access-state-updated', handleInitEvent);
-  useDailyEvent('joining-meeting', handleInitEvent);
+  useDailyEvent(
+    'joining-meeting',
+    useRecoilCallback(
+      ({ set }) =>
+        () => {
+          set(localJoinDateState, new Date());
+          handleInitEvent();
+        },
+      [handleInitEvent]
+    )
+  );
   useDailyEvent(
     'joined-meeting',
     useCallback(

src/hooks/useRoomExp.ts

@@ -0,0 +1,93 @@
+import { useEffect, useState } from 'react';
+import { useRecoilValue } from 'recoil';
+
+import { localJoinDateState } from '../DailyParticipants';
+import { useRoom } from './useRoom';
+
+interface Countdown {
+  hours: number;
+  minutes: number;
+  seconds: number;
+}
+
+interface Props {
+  onCountdown?(countdown: Countdown): void;
+}
+
+export const useRoomExp = ({ onCountdown }: Props = {}) => {
+  const localJoinDate = useRecoilValue(localJoinDateState);
+  const room = useRoom();
+
+  const [ejectDate, setEjectDate] = useState<Date | null>(null);
+
+  useEffect(() => {
+    const ejectAfterElapsed =
+      room?.tokenConfig?.eject_after_elapsed ??
+      room?.config?.eject_after_elapsed ??
+      0;
+    const expUTCTimeStamp = room?.tokenConfig?.exp ?? room?.config?.exp ?? 0;
+    const ejectAtExp =
+      room?.tokenConfig?.eject_at_token_exp ??
+      room?.config?.eject_at_room_exp ??
+      false;
+
+    let newEjectDate: Date = new Date(0);
+
+    if (ejectAfterElapsed && localJoinDate) {
+      newEjectDate = new Date(
+        localJoinDate.getTime() + 1000 * ejectAfterElapsed
+      );
+    }
+
+    if (ejectAtExp && expUTCTimeStamp) {
+      const expDate = new Date(expUTCTimeStamp * 1000);
+      if (
+        (newEjectDate.getTime() > 0 && expDate < newEjectDate) ||
+        !newEjectDate.getTime()
+      )
+        newEjectDate = expDate;
+    }
+
+    if (newEjectDate.getTime() === 0) return;
+
+    setEjectDate((oldEjectDate) =>
+      oldEjectDate?.getTime() !== newEjectDate.getTime()
+        ? newEjectDate
+        : oldEjectDate
+    );
+  }, [
+    localJoinDate,
+    room?.config?.eject_after_elapsed,
+    room?.config?.eject_at_room_exp,
+    room?.config?.exp,
+    room?.tokenConfig?.eject_after_elapsed,
+    room?.tokenConfig?.eject_at_token_exp,
+    room?.tokenConfig?.exp,
+  ]);
+
+  useEffect(() => {
+    if (!ejectDate || ejectDate.getTime() === 0) return;
+
+    const interval = setInterval(() => {
+      const eject = (ejectDate?.getTime() ?? 0) / 1000;
+      const now = Date.now() / 1000;
+      const diff = eject - now;
+      if (diff < 0) return;
+      const hours = Math.max(0, Math.floor(diff / 3600));
+      const minutes = Math.max(0, Math.floor((diff % 3600) / 60));
+      const seconds = Math.max(0, Math.floor(diff % 60));
+      onCountdown?.({
+        hours,
+        minutes,
+        seconds,
+      });
+    }, 1000);
+    return () => {
+      clearInterval(interval);
+    };
+  }, [ejectDate, onCountdown]);
+
+  return {
+    ejectDate,
+  };
+};

src/index.ts

@@ -28,6 +28,7 @@ export { usePermissions } from './hooks/usePermissions';
 export { useReceiveSettings } from './hooks/useReceiveSettings';
 export { useRecording } from './hooks/useRecording';
 export { useRoom } from './hooks/useRoom';
+export { useRoomExp } from './hooks/useRoomExp';
 export { useScreenAudioTrack } from './hooks/useScreenAudioTrack';
 export { ScreenShare, useScreenShare } from './hooks/useScreenShare';
 export { useScreenVideoTrack } from './hooks/useScreenVideoTrack';