Move dajys import to opensource

## Summary
Adding `dayjs` to `opensource`, as it's needed by the translation framework.

## Test plan
Place `experimental.PagePresence` on the testbed, hover on avatar of users who haven't been present in a long time, check the tooltip has the right subtitle


## Old summary, before Josh moved us to ESM
This is the second attempt at this. The first one was reverted (#7592) because it crashed at runtime.
The original PR (#7473) had some `@ts-ignore` and was using `require`, which is why the build succeeded even though it should have not.

`import * as dayjs from 'dayjs';` is a valid import according to `tsc`. But then `dayjs(date)` errors
```
Type originates at this import. A namespace-style import cannot be called or constructed, and will cause a failure at runtime. Consider using a default import or import require here instead
```
It also **crashes at runtime**. Changing it to `dayjs.default(date)` doesn't crash at runtime, but `tsc` now complains about it
```
Property 'default' does not exist on type 'typeof import("/Users/albert/monorepo/opensource/sdk-js/node_modules/dayjs/index.d.ts")'
```

`import dayjs from 'dayjs';` is **not** a valid import according to `tsc`
```
This module is declared with 'export =', and can only be used with a default import when using the 'esModuleInterop' flag.
```
But **actually works** (i.e. no runtime crash).

Peeking into `dayjs` codebase, I see an [export default dayjs](https://github.com/iamkun/dayjs/blob/f0c9a41c6ec91528f3790e442b0c5dff15a4e640/src/index.js#L467C21-L467C21), which is ESM syntax, which I would expect to just be able to import (`import dayjs from 'dayjs';`).
My IDE is not complaining, the code is not crashing at runtime, but `npm run tsc-once` is yelling at me.

[There is a long-standing issue in DayJS regarding Node.js ESM](iamkun/dayjs#1765)) which might be related. But I'm still confused 😬

Test Plan:
Use the experimental.PresenceFacepile in the testbed, hover on an avatar, check the tooltip's subtitle is correct.


Reviewers: Netceer, lazybean

Reviewed By: lazybean

Pull Request: getcord/monorepo#7750

monorepo-commit: 9ea55f11df0954eff1e344bcf12c1f9c2a474541

packages/react/common/util.ts

@@ -1,3 +1,9 @@
+import dayjs from 'dayjs';
+import Calendar from 'dayjs/plugin/calendar.js';
+dayjs.extend(Calendar);
+// eslint-disable-next-line no-restricted-imports
+import type { TFunction } from 'i18next';
+
 /**
  * Prepend "cord-" to a classname. Useful mostly to grep all places
  * where we've added a stable classname.
@@ -69,3 +75,73 @@ export function getFileSizeString(size: number) {
   }
   return fileSizeString;
 }
+
+export function relativeTimestampString(
+  date: Date,
+  now: number,
+  t: TFunction<'presence' | 'message' | 'notifications', 'timestamp'>,
+) {
+  const deltaSeconds = (now - date.getTime()) / 1000;
+  const absoluteDeltaSeconds = Math.abs(deltaSeconds);
+  const dateNow = new Date(now);
+  const isFuture = deltaSeconds < 0;
+
+  if (absoluteDeltaSeconds < 60) {
+    // new messages can have a delta second of -0.X which we still want to show as just now
+    if (deltaSeconds < -5) {
+      return t(`in_less_than_a_minute`);
+    }
+    // during the last minute
+    // For the MESSAGE location, "just now" appears as the end of a full sentence, so we don't want to capitalize it; for the NOTIFICATION location it appears standalone and so we do.
+    return t('just_now');
+  } else if (absoluteDeltaSeconds < 60 * 60) {
+    const minutes = Math.floor(absoluteDeltaSeconds / 60);
+
+    if (isFuture) {
+      // in the next hour
+      return t('in_minutes', { count: minutes });
+    }
+
+    // during the last hour
+    return t('minutes_ago', { count: minutes });
+  } else if (absoluteDeltaSeconds < 60 * 60 * 24) {
+    const hours = Math.floor(absoluteDeltaSeconds / (60 * 60));
+
+    if (isFuture) {
+      // in the next 24 hours
+      return t('in_hours', { count: hours });
+    }
+    // during the last 24 hours
+    return t('hours_ago', { count: hours });
+  } else {
+    return dayjs(date).calendar(now, {
+      lastDay: t('yesterday_format'),
+      lastWeek: t('last_week_format'),
+      nextDay: t('tomorrow_format'),
+      nextWeek: t('next_week_format'),
+      sameElse:
+        date.getFullYear() === dateNow.getFullYear()
+          ? t('this_year_format')
+          : t('other_format'),
+    });
+  }
+}
+
+export function absoluteTimestampString(
+  date: Date,
+  now: number,
+  t: TFunction<'message', 'absolute_timestamp'>,
+) {
+  const dateNow = new Date(now);
+  return dayjs(date).calendar(now, {
+    sameDay: t('today_format'),
+    lastDay: t('yesterday_format'),
+    lastWeek: t('last_week_format'),
+    nextDay: t('tomorrow_format'),
+    nextWeek: t('next_week_format'),
+    sameElse:
+      date.getFullYear() === dateNow.getFullYear()
+        ? t('this_year_format')
+        : t('other_format'),
+  });
+}

packages/react/experimental/components/PresenceFacepile.tsx

@@ -8,6 +8,7 @@ import type { PresenceReducerOptions } from '../../types.ts';
 import { useLocationData } from '../../hooks/presence.ts';
 import { getUsersAtLocation } from '../../common/lib/presence.ts';
 import { useTime } from '../../common/effects/useTime.tsx';
+import { relativeTimestampString } from '../../common/util.ts';
 import { DefaultTooltip, WithTooltip } from './WithTooltip.tsx';
 import { Avatar } from './Avatar.tsx';
 import withCord from './hoc/withCord.tsx';
@@ -218,12 +219,3 @@ function useFacepileUsers({
     viewerID,
   ]);
 }
-
-// TODO: Implement this
-function relativeTimestampString(
-  _lastPresent: Date,
-  _time: number,
-  _relativeT: unknown,
-): string | undefined {
-  return undefined;
-}

packages/react/package.json

@@ -27,6 +27,7 @@
     "jotai": "^2.6.0",
     "jotai-scope": "^0.4.1",
     "jwt-decode": "^4.0.0",
+    "dayjs": "^1.11.9",
     "phosphor-react": "^1.4.0",
     "react-i18next": "^13.2.2",
     "slate": "^0.100.0",