migrate from moment to date-fns

warpgate-web/package.json

@@ -34,6 +34,7 @@
     "@typescript-eslint/parser": "^5.58.0",
     "bootstrap": "^5.2.0-beta1",
     "copy-text-to-clipboard": "^3.0.1",
+    "date-fns": "^3.6.0",
     "eslint": "^8.38.0",
     "eslint-config-standard": "^16.0.3",
     "eslint-import-resolver-typescript": "^3.5.5",
@@ -42,7 +43,6 @@
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-svelte3": "^4.0.0",
     "format-duration": "^3.0.2",
-    "moment": "^2.29.4",
     "otplib": "^12.0.1",
     "qrcode": "^1.5.1",
     "sass": "^1.61.0",

warpgate-web/src/admin/Home.svelte

@@ -4,7 +4,7 @@
     import { onDestroy } from 'svelte'
     import { link } from 'svelte-spa-router'
     import { api, SessionSnapshot } from 'admin/lib/api'
-    import moment from 'moment'
+    import { formatDistance } from 'date-fns';
     import { timer, Observable, switchMap, from, combineLatest, fromEvent, merge } from 'rxjs'
     import RelativeDate from './RelativeDate.svelte'
     import AsyncButton from 'common/AsyncButton.svelte'
@@ -104,7 +104,7 @@
 
             <div class="meta">
                 {#if session.ended }
-                    {moment.duration(moment(session.ended).diff(session.started)).humanize()}
+                    {formatDistance(new Date(session.started), new Date(session.ended))}
                 {/if}
             </div>
 

warpgate-web/src/admin/Session.svelte

@@ -3,7 +3,7 @@ import { api, SessionSnapshot, Recording, TargetSSHOptions, TargetHTTPOptions, T
 import { timeAgo } from 'admin/lib/time'
 import AsyncButton from 'common/AsyncButton.svelte'
 import DelayedSpinner from 'common/DelayedSpinner.svelte'
-import moment from 'moment'
+import { formatDistance, formatDistanceToNow } from 'date-fns';
 import { onDestroy } from 'svelte'
 import { link } from 'svelte-spa-router'
 import { Alert } from 'sveltestrap'
@@ -79,9 +79,9 @@ onDestroy(() => clearInterval(interval))
                 </strong>
                 <span class="text-muted">
                     {#if session.ended}
-                        {moment.duration(moment(session.ended).diff(session.started)).humanize()} long, <RelativeDate date={session.started} />
+                        {formatDistance(new Date(session.started), new Date(session.ended))} long, <RelativeDate date={session.started} />
                     {:else}
-                        {moment.duration(moment().diff(session.started)).humanize()}
+                        {formatDistanceToNow(new Date(session.started))}
                     {/if}
                 </span>
             </div>

warpgate-web/src/admin/lib/time.ts

@@ -1,5 +1,5 @@
-import moment from 'moment'
+import { formatDistanceToNow } from 'date-fns'
 
-export function timeAgo (t: Date): string {
-    return moment(t).fromNow()
+export function timeAgo(t: Date): string {
+    return formatDistanceToNow(t, { addSuffix: true })
 }