VirtWeb/virtweb_frontend/src/widgets/TimeWidget.tsx

import { Tooltip } from "@mui/material";
import date from "date-and-time";
import { time } from "../utils/DateUtils";

export function formatDate(time: number): string {
  const t = new Date();
  t.setTime(1000 * time);
  return date.format(t, "DD/MM/YYYY HH:mm:ss");
}

export function timeDiff(a: number, b: number): string {
  let diff = b - a;

  if (diff === 0) return "now";
  if (diff === 1) return "1 second";

  if (diff < 60) {
    return `${diff} seconds`;
  }

  diff = Math.floor(diff / 60);

  if (diff === 1) return "1 minute";
  if (diff < 24) {
    return `${diff} minutes`;
  }

  diff = Math.floor(diff / 60);

  if (diff === 1) return "1 hour";
  if (diff < 24) {
    return `${diff} hours`;
  }

  const diffDays = Math.floor(diff / 24);

  if (diffDays === 1) return "1 day";
  if (diffDays < 31) {
    return `${diffDays} days`;
  }

  diff = Math.floor(diffDays / 31);

  if (diff < 12) {
    return `${diff} month`;
  }

  const diffYears = Math.floor(diffDays / 365);

  if (diffYears === 1) return "1 year";
  return `${diffYears} years`;
}

export function timeDiffFromNow(t: number): string {
  return timeDiff(t, time());
}

export function TimeWidget(p: { time?: number }): React.ReactElement {
  if (!p.time) return <></>;
  return (
    <Tooltip title={formatDate(p.time)}>
      <span>{timeDiffFromNow(p.time)}</span>
    </Tooltip>
  );
}