Add internationalization support for profile and shared collections; update translations in multiple languages

This commit is contained in:
Sean Morley
2024-11-05 14:40:32 -05:00
parent bcba4f4425
commit c7207ccf52
11 changed files with 93 additions and 18 deletions

View File

@@ -1,5 +1,6 @@
<script lang="ts">
export let data;
import { t } from 'svelte-i18n';
let stats: {
country_count: number;
@@ -36,7 +37,7 @@
<p class="text-center text-lg mt-2">{data.user.username}</p>
{#if data.user && data.user.date_joined}
<p class="ml-1 text-lg text-center mt-4">Member Since</p>
<p class="ml-1 text-lg text-center mt-4">{$t('profile.member_since')}</p>
<div class="flex items-center justify-center text-center">
<iconify-icon icon="mdi:calendar" class="text-2xl"></iconify-icon>
<p class="ml-1 text-xl">
@@ -49,23 +50,23 @@
<!-- divider -->
<div class="divider pr-8 pl-8"></div>
<h1 class="text-center text-2xl font-bold mt-8 mb-2">User Stats</h1>
<h1 class="text-center text-2xl font-bold mt-8 mb-2">{$t('profile.user_stats')}</h1>
<div class="flex justify-center items-center">
<div class="stats stats-vertical lg:stats-horizontal shadow bg-base-200">
<div class="stat">
<div class="stat-title">Adventures</div>
<div class="stat-title">{$t('navbar.adventures')}</div>
<div class="stat-value text-center">{stats.adventure_count}</div>
<!-- <div class="stat-desc">Jan 1st - Feb 1st</div> -->
</div>
<div class="stat">
<div class="stat-title">Collections</div>
<div class="stat-title">{$t('navbar.collections')}</div>
<div class="stat-value text-center">{stats.trips_count}</div>
<!-- <div class="stat-desc">↘︎ 90 (14%)</div> -->
</div>
<div class="stat">
<div class="stat-title">Visited Countries</div>
<div class="stat-title">{$t('profile.visited_countries')}</div>
<div class="stat-value text-center">
{Math.round((stats.country_count / stats.total_countries) * 100)}%
</div>
@@ -75,7 +76,7 @@
</div>
<div class="stat">
<div class="stat-title">Visited Regions</div>
<div class="stat-title">{$t('profile.visited_regions')}</div>
<div class="stat-value text-center">
{Math.round((stats.visited_region_count / stats.total_regions) * 100)}%
</div>

View File

@@ -3,6 +3,7 @@
import CollectionCard from '$lib/components/CollectionCard.svelte';
import type { Collection } from '$lib/types';
import type { PageData } from './$types';
import { t } from 'svelte-i18n';
export let data: PageData;
console.log(data);
@@ -17,10 +18,11 @@
</div>
{:else}
<p class="text-center font-semibold text-xl mt-6">
No collections found that are shared with you.
{$t('share.no_shared_found')}
{#if data.user && !data.user?.public_profile}
<p>In order to allow users to share with you, you need your profile set to public.</p>
<button class="btn btn-neutral mt-4" on:click={() => goto('/settings')}>Go to Settings</button
<p>{$t('share.set_public')}</p>
<button class="btn btn-neutral mt-4" on:click={() => goto('/settings')}
>{$t('share.go_to_settings')}</button
>
{/if}
</p>