#215 init i18n (#223)

* #215 init i18n

---------

Co-authored-by: neil <neil@neils-MacBook-Pro.local>

.github/workflows/build-sign-notarize.yml

@@ -83,8 +83,7 @@ jobs:
 
       - name: build
         if: startsWith(inputs.platform, 'darwin')
-        # run: tea -ES xc dist # temporary tea installs 19
-        run: tea -ES +nodejs.org@18 xc dist
+        run: tea -SE xc dist
         env:
           PUBLIC_VERSION: ${{ steps.gui-version.outputs.version }}
           USE_HARD_LINKS: false
@@ -193,7 +192,7 @@ jobs:
 
     - name: create x86 dmg
       run: |
-        tea create-dmg \
+        tea +github.com/create-dmg/create-dmg create-dmg \
         --volname "Tea Installer" \
         --window-pos 200 120 \
         --window-size 800 400 \
@@ -210,7 +209,7 @@ jobs:
 
     - name: create arm64 dmg
       run: |
-        tea create-dmg \
+        tea +github.com/create-dmg/create-dmg create-dmg \
         --volname "Tea Installer" \
         --window-pos 200 120 \
         --window-size 800 400 \

.github/workflows/ci.yml

@@ -34,25 +34,15 @@ jobs:
     needs: changes
     runs-on: ubuntu-latest
     steps:
+      - uses: teaxyz/setup@v0
       - uses: actions/checkout@v3
-        with:
-          persist-credentials: false
-      - uses: pnpm/action-setup@v2
-        with:
-          version: 7
-      - name: setup node
-        uses: actions/setup-node@v1
-        with:
-          node-version: 18
-          cache: 'pnpm'
-          cache-dependency-path: pnpm-lock.yaml
       - name: install app dependencies
-        run: pnpm install
+        run: tea -E xc setup
       # TODO: fix
       # - name: unit test
       #   run: pnpm --filter desktop run coverage
       - name: lint
-        run: pnpm -r lint
+        run: tea -E pnpm -r lint
   build_svelte:
     needs: changes
     runs-on: ubuntu-latest
@@ -96,7 +86,7 @@ jobs:
 
       - name: build
         run: |
-          tea -ES +nodejs.org@18 xc setup
+          tea -SE xc setup
           cd modules/desktop && tea -ES pnpm vite build && cp build/app.html build/index.html
         env:
           PUBLIC_VERSION: ${{ steps.gui-version.outputs.version }}
@@ -131,7 +121,7 @@ jobs:
             ```
             copy-paste into a browser to view
   build_desktop:
-    needs: [changes, test, build_svelte]
+    needs: [changes, test]
     # if: needs.changes.outputs.desktop == 'true'
     strategy:
       matrix:

README.md

@@ -95,11 +95,10 @@ pnpm --filter desktop exec pnpm dist
 
 | Project                           |  Version  |
 |-----------------------------------|-----------|
-| nodejs.org                        | >=18.14   |
-| pnpm.io                           | >=7.20    |
+| nodejs.org                        | =18.13.0  |
+| pnpm.io                           | >=7.27    |
 | xcfile.dev                        | >=0.0.110 |
 | python.org                        | >=3.10    |
-| github.com/create-dmg/create-dmg  | >=1.1     |
 
 
 [aws/cli]: https://aws.amazon.com/cli/

modules/desktop/electron/electron.ts

@@ -9,14 +9,7 @@ import type { Session } from "../src/libs/types";
 import { installPackage, openTerminal } from "./libs/cli";
 import { autoUpdater } from "electron-updater";
 import * as log from "electron-log";
-// try {
-// 	//@ts-ignore only used in dev should not be packaged inprod
-// 	/* eslint-disable */
-// 	const er = require('electron-reloader');
-// 	er(module);
-// } catch (e) {
-// 	console.error(e);
-// }
+
 autoUpdater.logger = log;
 log.info("App starting...");
 
@@ -138,10 +131,6 @@ app.on("window-all-closed", () => {
 	if (process.platform !== "darwin") app.quit();
 });
 
-ipcMain.on("to-main", (event, count) => {
-	return mainWindow?.webContents.send("from-main", `next count is ${count + 1}`);
-});
-
 ipcMain.handle("get-installed-packages", async () => {
 	const pkgs = await getInstalledPackages();
 	return pkgs;
@@ -171,3 +160,7 @@ ipcMain.handle("open-terminal", async (_, data) => {
 		console.error("elast:", error);
 	}
 });
+
+ipcMain.handle("get-lang", function () {
+	return app.getLocale();
+});

modules/desktop/package.json

@@ -91,6 +91,7 @@
 		"semver": "^7.3.8",
 		"svelte-markdown": "^0.2.3",
 		"svelte-watch-resize": "^1.0.3",
+		"sveltekit-i18n": "^2.2.2",
 		"upath": "^2.0.1",
 		"yaml": "^2.2.1"
 	},

modules/desktop/src/components/select-lang/select-lang.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+  import { t, locales, locale } from '$libs/translations'; 
+</script>
+
+<select bind:value="{$locale}" class="bg-black text-sm text-gray">
+  {#each $locales as value}
+    <option value="{value}">{$t(`lang.${value}`)}</option>
+  {/each}
+</select>

modules/desktop/src/components/top-bar/top-bar.svelte

@@ -6,6 +6,7 @@
 	import { navStore } from '$libs/stores';
 
 	import ProfileNavButton from './profile-nav-button.svelte';
+	import SelectLang from '$components/select-lang/select-lang.svelte';
 
 	let { nextPath, prevPath } = navStore;
 
@@ -39,6 +40,7 @@
 		<button class="icon-star-empty hover:text-white" />
 	</ul>
 	<ProfileNavButton />
+	<SelectLang />
 </header>
 <menu
 	class="border-gray text-gray flex h-10 gap-4 border border-l-0 border-r-0 border-t-0 pl-4 align-middle leading-10"

modules/desktop/src/libs/translations/index.ts

@@ -0,0 +1,10 @@
+import i18n from "sveltekit-i18n";
+import translations from "./translations";
+
+/** @type {import('sveltekit-i18n').Config} */
+const config = {
+	initLocale: "en",
+	translations
+};
+
+export const { t, l, locales, locale } = new i18n(config);

modules/desktop/src/libs/translations/lang.json

@@ -0,0 +1,4 @@
+{
+	"en": "English",
+	"cs": "Česky"
+}

modules/desktop/src/libs/translations/translations.ts

@@ -0,0 +1,16 @@
+import lang from "./lang.json";
+
+export default {
+	en: {
+		lang,
+		cli: {
+			install: "install tea"
+		}
+	},
+	cs: {
+		lang,
+		cli: {
+			install: "nainstalovat cli"
+		}
+	}
+};

modules/desktop/src/routes/+page.svelte

@@ -20,7 +20,7 @@
 	<section class="mt-8 mb-8 flex gap-4">
 		<div>
 			<HeaderCard
-				title="Browser Packages"
+				title="Browse Packages"
 				imgUrl="/images/bored-ape.png"
 				ctaUrl="/packages"
 				ctaLabel="Browse packages >"

modules/desktop/src/routes/cli/+page.svelte

@@ -1,12 +1,16 @@
 <script>
 	import '$appcss';
+	import { t } from '$libs/translations'; 
+
 	import PageHeader from '$components/page-header/page-header.svelte';
 	import CliBanner from '$components/cli-banner/cli-banner.svelte';
 	import BigBlackSpace from '$components/big-black-space/big-black-space.svelte';
+
+
 </script>
 
 <div>
-	<PageHeader>INSTALL TEA</PageHeader>
+	<PageHeader>{$t('cli.install')}</PageHeader>
 
 	<section>
 		<CliBanner />

pnpm-lock.yaml

@@ -60,6 +60,7 @@ importers:
       svelte-preprocess: ^5.0.1
       svelte-watch-resize: ^1.0.3
       svelte2tsx: ^0.5.20
+      sveltekit-i18n: ^2.2.2
       tailwindcss: ^3.2.4
       tslib: ^2.3.1
       typescript: ^4.7.4
@@ -90,6 +91,7 @@ importers:
       semver: 7.3.8
       svelte-markdown: 0.2.3_svelte@3.55.1
       svelte-watch-resize: 1.0.3
+      sveltekit-i18n: 2.2.2_svelte@3.55.1
       upath: 2.0.1
       yaml: 2.2.1
     devDependencies:
@@ -3947,6 +3949,20 @@ packages:
       - supports-color
     dev: true
 
+  /@sveltekit-i18n/base/1.2.1_svelte@3.55.1:
+    resolution: {integrity: sha512-F8gqG2+KAOeT0o2wYlUrW3TRCX7zaD7rBy/1CEVNw0irfw9TgFf/ODmhubkHHT3+6Zk+SMz8RNgeuffBfAMbJw==}
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      svelte: 3.55.1
+    optionalDependencies:
+      '@sveltekit-i18n/parser-default': 1.0.3
+    dev: false
+
+  /@sveltekit-i18n/parser-default/1.0.3:
+    resolution: {integrity: sha512-HheveklTjp3hxpYQhoHfyA6B4bQaUeSV5MQf2usIv/58UF2jY/YqhCAWj9bDBjufbuZc5pSz4BXvdX3WVT+viA==}
+    dev: false
+
   /@szmarczak/http-timer/4.0.6:
     resolution: {integrity: sha512-4BAffykYOgO+5nzBWYwE3W90sBgLJoUPRWWcL8wlyiM8IB8ipJz3UMJ9KXQd1RKQXpKp8Tutn80HZtWsu2u76w==}
     engines: {node: '>=10'}
@@ -11883,6 +11899,16 @@ packages:
       - supports-color
     dev: true
 
+  /sveltekit-i18n/2.2.2_svelte@3.55.1:
+    resolution: {integrity: sha512-6eygICleGCSL7elY7A3trF8XUhV+mlW56ZSoD0UUKXlw+Y6u0MTTHDq48u1LyY73SfnlbPHXgTarhTjZ0BvUKA==}
+    peerDependencies:
+      svelte: ^3.x
+    dependencies:
+      '@sveltekit-i18n/base': 1.2.1_svelte@3.55.1
+      '@sveltekit-i18n/parser-default': 1.0.3
+      svelte: 3.55.1
+    dev: false
+
   /symbol-tree/3.2.4:
     resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==}