feat(web): Localize dates and numbers (#1056)

This commit is contained in:
Kiel Hurley 2022-12-05 04:35:20 +13:00 committed by GitHub
parent 426ce77f1c
commit 5f2b75997f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 86 additions and 48 deletions

View file

@ -4,6 +4,7 @@
import PlayCircle from 'svelte-material-icons/PlayCircle.svelte';
import Memory from 'svelte-material-icons/Memory.svelte';
import StatsCard from './stats-card.svelte';
import { getBytesWithUnit, asByteUnitString } from '../../../utils/byte-units';
export let stats: ServerStatsResponseDto;
export let allUsers: Array<UserResponseDto>;
@ -15,8 +16,9 @@
return name;
};
$: spaceUnit = stats.usage.split(' ')[1];
$: spaceUsage = stats.usage.split(' ')[0];
$: [spaceUsage, spaceUnit] = getBytesWithUnit(stats.usageRaw);
const locale = navigator.languages;
</script>
<div class="flex flex-col gap-5">
@ -55,9 +57,9 @@
}`}
>
<td class="text-sm px-2 w-1/4 text-ellipsis">{getFullName(user.userId)}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{user.photos}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{user.videos}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{user.usage}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{user.photos.toLocaleString(locale)}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{user.videos.toLocaleString(locale)}</td>
<td class="text-sm px-2 w-1/4 text-ellipsis">{asByteUnitString(user.usageRaw)}</td>
</tr>
{/each}
</tbody>

View file

@ -5,7 +5,6 @@
import PencilOutline from 'svelte-material-icons/PencilOutline.svelte';
import TrashCanOutline from 'svelte-material-icons/TrashCanOutline.svelte';
import DeleteRestore from 'svelte-material-icons/DeleteRestore.svelte';
import moment from 'moment';
export let allUsers: Array<UserResponseDto>;
@ -15,8 +14,15 @@
return user.deletedAt != null;
};
const locale = navigator.languages;
const deleteDateFormat: Intl.DateTimeFormatOptions = {
month: 'long', day: 'numeric', year: 'numeric'
};
const getDeleteDate = (user: UserResponseDto): string => {
return moment(user.deletedAt).add(7, 'days').format('LL');
let deletedAt = new Date(user.deletedAt ? user.deletedAt : Date.now());
deletedAt.setDate(deletedAt.getDate() + 7);
return deletedAt.toLocaleString(locale, deleteDateFormat);
};
</script>