1import {FC} from 'react';
 2
 3type UserStatusProps = {
 4    lastOnline?: string | null;
 5};
 6
 7const convertDateFormat = (lastOnline: string | null | undefined): number | null => {
 8  if (!lastOnline) {
 9    return null;
10  }
11
12  const date = new Date(lastOnline + 'Z');
13  return Math.floor(date.getTime() / 1000);
14};
15
16export const OnlineBadge: FC<UserStatusProps> = ({lastOnline}) => {
17  const currentTimeInSeconds = Math.floor(Date.now() / 1000);
18  const unixTime = convertDateFormat(lastOnline);
19
20  if (typeof lastOnline === 'undefined' || lastOnline === null) {
21    return <div className="circle pulse orange"></div>;
22  }
23
24  const timeDifferenceInSeconds = unixTime ? currentTimeInSeconds - unixTime : Infinity;
25
26  if (timeDifferenceInSeconds > 0 && timeDifferenceInSeconds <= 60) {
27    return <div className="circle pulse green"></div>;
28  }
29
30  return <div className="circle pulse red"></div>;
31};