Replaced most of the usages of moment with date-fns

src/visits/ShortUrlVisitsHeader.tsx

@@ -1,7 +1,7 @@
 import { UncontrolledTooltip } from 'reactstrap';
-import Moment from 'react-moment';
 import { ExternalLink } from 'react-external-link';
 import { ShortUrlDetail } from '../short-urls/reducers/shortUrlDetail';
+import { Time } from '../utils/Time';
 import { ShortUrlVisits } from './reducers/shortUrlVisits';
 import VisitsHeader from './VisitsHeader';
 import './ShortUrlVisitsHeader.scss';
@@ -22,18 +22,14 @@ const ShortUrlVisitsHeader = ({ shortUrlDetail, shortUrlVisits, goBack }: ShortU
   const renderDate = () => !shortUrl ? <small>Loading...</small> : (
     <span>
       <b id="created" className="short-url-visits-header__created-at">
-        <Moment fromNow>{shortUrl.dateCreated}</Moment>
+        <Time date={shortUrl.dateCreated} relative />
       </b>
       <UncontrolledTooltip placement="bottom" target="created">
-        <Moment format="YYYY-MM-DD HH:mm">{shortUrl.dateCreated}</Moment>
+        <Time date={shortUrl.dateCreated} />
       </UncontrolledTooltip>
     </span>
   );
-  const visitsStatsTitle = (
-    <>
-      Visits for <ExternalLink href={shortLink} />
-    </>
-  );
+  const visitsStatsTitle = <>Visits for <ExternalLink href={shortLink} /></>;
 
   return (
     <VisitsHeader title={visitsStatsTitle} goBack={goBack} visits={visits} shortUrl={shortUrl}>

src/visits/VisitsTable.tsx

@@ -1,5 +1,4 @@
 import { useEffect, useMemo, useState, useRef } from 'react';
-import Moment from 'react-moment';
 import classNames from 'classnames';
 import { min, splitEvery } from 'ramda';
 import {
@@ -16,6 +15,7 @@ import { determineOrderDir, OrderDir } from '../utils/utils';
 import { prettify } from '../utils/helpers/numbers';
 import { supportsBotVisits } from '../utils/helpers/features';
 import { SelectedServer } from '../servers/data';
+import { Time } from '../utils/Time';
 import { NormalizedOrphanVisit, NormalizedVisit } from './types';
 import './VisitsTable.scss';
 
@@ -194,9 +194,7 @@ const VisitsTable = ({
                   )}
                 </td>
               )}
-              <td>
-                <Moment format="YYYY-MM-DD HH:mm">{visit.date}</Moment>
-              </td>
+              <td><Time date={visit.date} /></td>
               <td>{visit.country}</td>
               <td>{visit.city}</td>
               <td>{visit.browser}</td>