From 2183318644f0e24dcebe7a07306bb64cd15a2c9a Mon Sep 17 00:00:00 2001 From: Bradley Shellnut Date: Thu, 18 Jan 2024 14:25:43 -0800 Subject: [PATCH] Adding more translations but will have a hard time with server rendered meta tags. --- languages/en.json | 18 +++++ languages/es.json | 18 +++++ src/hooks.server.ts | 2 +- src/lib/I18NHeader.svelte | 11 +++ src/lib/components/Articles.svelte | 16 ++-- src/lib/components/bandcamp/index.svelte | 9 +-- src/lib/components/nav/index.svelte | 2 +- src/lib/{i18n.ts => i18n-routing.ts} | 2 +- src/routes/+layout.svelte | 11 +-- src/routes/[[lang=lang]]/+page.svelte | 81 ++++++++++--------- .../articles/[page]/+page.svelte | 30 +------ 11 files changed, 114 insertions(+), 86 deletions(-) create mode 100644 src/lib/I18NHeader.svelte rename src/lib/{i18n.ts => i18n-routing.ts} (93%) diff --git a/languages/en.json b/languages/en.json index a993d19..ebf9016 100644 --- a/languages/en.json +++ b/languages/en.json @@ -3,6 +3,24 @@ "home_title": "Hello! I'm Bradley Shellnut.", "home_about": "I'm a full stack software engineer currently working on Java Spring, PostgreSQL, and React / Angular JS.", "home_learning": "At home you can usually find me learning new things and working with SvelteKit, Next.js, and Gatsby.", + "home_other_about_me": "Or you may find me jamming out to music 🎶, hiking ⛰️, making ", + "cocktails": "cocktails", + "home_fun_with_cats": " 🍸, or having fun with my cats. 🐈", + "home_check_me_out": "Check me out on", + "contact_through": "Contact through", + "read_more": "or read more", + "about_me": "about me", + "music_currently_listening": "Currently listening to", + "music_link_to": "Link to", + "music_by": "by", + "music_album_art_alt": "Album art for", + "articles_favorite_articles": "Favorite Articles", + "articles_favorite_tech_articles": "Favorite Tech Articles", + "articles_reading_time": "Reading time", + "articles_minute": "minute", + "articles_minutes": "minutes", + "articles_tags": "Tags", + "articles_more_articles": "more articles", "nav_home": "Home", "nav_about": "About", "nav_about_link": "about", diff --git a/languages/es.json b/languages/es.json index 8a93ecf..0161d2c 100644 --- a/languages/es.json +++ b/languages/es.json @@ -3,6 +3,24 @@ "home_title": "!Hola! Me llamo Bradley Shellnut.", "home_about": "Soy un ingeniero de software de pila completa que actualmente trabaja en Java Spring, PostgreSQL y React / Angular JS.", "home_learning": "En casa por lo general me puedes encontrar aprendiendo cosas nuevas y trabajando con SvelteKit, Next.js, y Gatsby.", + "home_other_about_me": "O puede que me encuentres improvisando música 🎶, haciendo senderismo ⛰️, haciendo ", + "cocktails": "cócteles", + "home_fun_with_cats": "🍸, o divertirme con mis gatos. 🐈", + "home_check_me_out": "Visítame en LinkedIn , Github , o lee más sobre mí", + "contact_through": "Contacto a través de", + "read_more": "o leer más", + "about_me": "sobre mí", + "music_currently_listening": "Actualmente escuchando", + "music_link_to": "Enlace", + "music_by": "por", + "music_album_art_alt": "Carátula del álbum de", + "articles_favorite_articles": "Artículos favoritos", + "articles_favorite_tech_articles": "Artículos tecnológicos favoritos", + "articles_reading_time": "Tiempo de lectura", + "articles_minute": "minuto", + "articles_minutes": "minutos", + "articles_tags": "Etiquetas", + "articles_more_articles": "más artículos", "nav_home": "Inicio", "nav_about": "Acerca de", "nav_about_link": "acerca-de", diff --git a/src/hooks.server.ts b/src/hooks.server.ts index b683fdb..6216011 100644 --- a/src/hooks.server.ts +++ b/src/hooks.server.ts @@ -1,4 +1,4 @@ -import { getTextDirection } from "$lib/i18n" +import { getTextDirection } from "$root/lib/i18n-routing" import { sourceLanguageTag, type AvailableLanguageTag } from "$paraglide/runtime" /* diff --git a/src/lib/I18NHeader.svelte b/src/lib/I18NHeader.svelte new file mode 100644 index 0000000..37de940 --- /dev/null +++ b/src/lib/I18NHeader.svelte @@ -0,0 +1,11 @@ + + + + {#each availableLanguageTags as lang} + + {/each} + diff --git a/src/lib/components/Articles.svelte b/src/lib/components/Articles.svelte index ddd7a4d..7bf69e4 100644 --- a/src/lib/components/Articles.svelte +++ b/src/lib/components/Articles.svelte @@ -1,15 +1,19 @@
-

Favorite Articles

+

{m.articles_favorite_articles()}

{#each articles as article (article.hashed_url)}
@@ -29,9 +33,9 @@
-

Reading time: {article.reading_time} minutes

+

{m.articles_reading_time()}: {article.reading_time} {article.reading_time === 1 ? m.articles_minute() : m.articles_minutes()}

-

Tags:

+

{m.articles_tags()}:

{#each article.tags as tag}

{tag}

{/each} @@ -41,8 +45,10 @@ {/each}
diff --git a/src/lib/components/bandcamp/index.svelte b/src/lib/components/bandcamp/index.svelte index a2db4bd..faa7ba2 100644 --- a/src/lib/components/bandcamp/index.svelte +++ b/src/lib/components/bandcamp/index.svelte @@ -1,9 +1,8 @@
-

Currently listening to:

+

{m.music_currently_listening()}:

{#each displayAlbums as album}
- +
import { page } from '$app/stores'; import { goto } from '$app/navigation'; - import { translatePath } from '$lib/i18n'; + import { translatePath } from '$root/lib/i18n-routing'; import { availableLanguageTags, languageTag } from '$paraglide/runtime'; import * as m from "$paraglide/messages"; diff --git a/src/lib/i18n.ts b/src/lib/i18n-routing.ts similarity index 93% rename from src/lib/i18n.ts rename to src/lib/i18n-routing.ts index 4ae7f71..2d50e73 100644 --- a/src/lib/i18n.ts +++ b/src/lib/i18n-routing.ts @@ -22,7 +22,7 @@ export function translatePath(path: string, lang: AvailableLanguageTag) { */ function getPathWithoutLang(path: string) { const [_, maybeLang, ...rest] = path.split("/") - if (availableLanguageTags.includes(maybeLang as any)) { + if (availableLanguageTags.includes(maybeLang as AvailableLanguageTag)) { return `/${rest.join("/")}`; } else { return path; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 6573245..5d4466e 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -7,11 +7,12 @@ import { PUBLIC_SITE_URL } from '$env/static/public'; import "nprogress/nprogress.css"; import '$root/styles/styles.pcss'; - import { setLanguageTag, sourceLanguageTag, type AvailableLanguageTag, availableLanguageTags } from "$paraglide/runtime"; + import { setLanguageTag, sourceLanguageTag, type AvailableLanguageTag } from "$paraglide/runtime"; import Header from '$lib/components/header/index.svelte'; import Footer from '$lib/components/footer/index.svelte'; import Analytics from '$lib/components/analytics/index.svelte'; - import { getTextDirection, translatePath } from '$lib/i18n'; + import { getTextDirection } from '$root/lib/i18n-routing'; + import I18NHeader from '$root/lib/I18NHeader.svelte'; NProgress.configure({ // Full list: https://github.com/rstacruz/nprogress#configuration @@ -67,11 +68,7 @@ - - {#each availableLanguageTags as lang} - - {/each} - +
{#key lang} diff --git a/src/routes/[[lang=lang]]/+page.svelte b/src/routes/[[lang=lang]]/+page.svelte index a740455..165c043 100644 --- a/src/routes/[[lang=lang]]/+page.svelte +++ b/src/routes/[[lang=lang]]/+page.svelte @@ -5,6 +5,7 @@ import Articles from '$lib/components/Articles.svelte'; import type { Album } from '$lib/types/album'; import type { Article, ArticlePageLoad } from '$lib/types/article'; + import { languageTag } from '$paraglide/runtime'; export let data: PageData; let albums: Album[]; @@ -13,6 +14,7 @@ let totalArticles: number; $: ({ albums, articlesData } = data); $: ({ articles, totalArticles } = articlesData); + $: lang = languageTag(); const userNames = { github: 'BradNut', @@ -25,44 +27,47 @@

{m.home_title()}

-

- {m.home_about()} -

-

- {m.home_learning()} -

-

- Or you may find me jamming out to music 🎶, hiking ⛰️, making{' '} - - cocktails - - 🍸, or having fun with my cats. 🐈 -

-

- Check me out on - - LinkedIn - - , - - Github - - , or read more about me. -

+

+ {m.home_about()} +

+

+ {m.home_learning()} +

+

+ {m.home_other_about_me()}{' '} + + {m.cocktails()} + + {m.home_fun_with_cats()} +

+

+ {m.home_check_me_out()} + + LinkedIn + + , + + Github + + , {m.read_more()} + + {m.about_me()} + . +