Merge branch 'master' into chore-html-linter

add a new language - Ukrainian && fix bug with dayjs locale (#472 )
ref(doc): replaced cs_cz with czech (#474 )
2026-01-12 14:15:47 +07:00 · 2020-05-04 07:43:04 +02:00 · 2020-05-03 17:45:17 +02:00 · 2020-05-03 15:28:38 +02:00 · 2020-05-03 15:17:38 +02:00 · 2020-05-03 08:21:59 +02:00
24 changed files with 529 additions and 77 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,20 @@

 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.

+### [1.7.1](https://github.com/verdaccio/ui/compare/v1.7.0...v1.7.1) (2020-04-27)
+
+
+### Bug Fixes
+
+* **i18n:** fixed current locale ([#462](https://github.com/verdaccio/ui/issues/462)) ([f44abd7](https://github.com/verdaccio/ui/commit/f44abd7dd08a8d68b1bfc2bf0c053f3e80a343d0))
+
+## [1.7.0](https://github.com/verdaccio/ui/compare/v1.6.0...v1.7.0) (2020-04-24)
+
+
+### Features
+
+* add japanese translations ([#460](https://github.com/verdaccio/ui/issues/460)) ([25def6c](https://github.com/verdaccio/ui/commit/25def6ccd5a42d43af1c33e7ace4bd7fdbec0e64))
+
 ## [1.6.0](https://github.com/verdaccio/ui/compare/v1.5.0...v1.6.0) (2020-04-23)


--- a/README.md
+++ b/README.md
@@ -105,6 +105,28 @@ If you have any issue you can try the following options, do no desist to ask or

 Translations are handled locally. I18n files can be found in the folder ```i18n/translations/*``` of this repository. We would love to provide translations from other languages, embracing all our users, but unfortunately we cannot do this without your help. Would you like to help us? Please feel **super welcome** to add a locale by opening a pull request.

+Your PR should contain:
+
+1 - A json file in the folder ```i18n/translations/*``` with the translations. The file must be named according to the new added language
+
+2 - The files ```i18n/config.ts``` and  ```LanguageSwitch.tsx``` updated with the new language. Please see the current structure
+
+3 - The other translations containing the new language in the language of the file. Example: 
+
+New language: ```cs_CZ ```
+
+The file ```pt-BR ``` should contain:
+ ```
+ "lng": {
+     ...,
+     "czech": "Tcheco"
+ }
+ ```
+
+4 - A SVG flag of the new translated language in the the folder ```src/components/Icon/img/*```. You maybe want to compress the svg file using https://jakearchibald.github.io/svgomg/ 
+
+
+
 ### License

 Verdaccio is [MIT licensed](https://github.com/verdaccio/verdaccio/blob/master/LICENSE)
--- a/i18n/config.ts
+++ b/i18n/config.ts
@@ -7,6 +7,8 @@ import translationES from './translations/es-ES.json';
 import translationDE from './translations/de-DE.json';
 import translationFR from './translations/fr-FR.json';
 import translationCN from './translations/zh-CN.json';
+import translationJP from './translations/ja-JP.json';
+import translationUA from './translations/uk-UA.json';

 const languages = {
  'en-US': {
@@ -27,6 +29,12 @@ const languages = {
  'zh-CN': {
    translation: translationCN,
  },
+  'ja-JP': {
+    translation: translationJP,
+  },
+  'uk-UA': {
+    translation: translationUA,
+  },
 };

 type Language = keyof typeof languages;
@@ -40,7 +48,7 @@ i18n
    // in case window.VEDACCIO_LANGUAGE is undefined,it will fall back to 'en-US'
    lng: window?.__VERDACCIO_BASENAME_UI_OPTIONS?.language,
    fallbackLng: 'en-US',
-    whitelist: ['en-US', 'pt-BR', 'es-ES', 'de-DE', 'fr-FR', 'zh-CN'],
+    whitelist: ['en-US', 'pt-BR', 'es-ES', 'de-DE', 'fr-FR', 'zh-CN', 'ja-JP', 'uk-UA'],
    load: 'currentOnly',
    resources: languages,
    debug: false,
--- a/i18n/translations/de-DE.json
+++ b/i18n/translations/de-DE.json
@@ -138,11 +138,13 @@
    },
    "lng": {
        "english": "Englisch",
+        "japanese": "Japanisch",
        "portuguese": "Portugiesisch",
        "spanish": "Spanisch",
        "german": "Deutsch",
        "chinese": "Chinesisch",
-        "french": "Französisch"
+        "french": "Französisch",
+        "ukraine": "Ukrainisch"
    },
    "help-to-translate": "Hilfe beim Übersetzen",
    "change-language": "Sprache ändern"
--- a/i18n/translations/en-US.json
+++ b/i18n/translations/en-US.json
@@ -138,11 +138,13 @@
    },
    "lng": {
        "english": "English",
+        "japanese": "Japanese",
        "portuguese": "Portuguese",
        "spanish": "Spanish",
        "german": "German",
        "chinese": "Chinese",
-        "french":  "French"
+        "french":  "French",
+        "ukraine": "Ukraine"
    },
    "help-to-translate": "Help to translate",
    "change-language": "Change language"
--- a/i18n/translations/es-ES.json
+++ b/i18n/translations/es-ES.json
@@ -138,11 +138,13 @@
    },
    "lng": {
        "english": "Inglés",
+        "japanese": "Japonés",
        "portuguese": "Portugués",
        "spanish": "Español",
        "german": "Alemán",
        "chinese": "Chino",
-        "french": "francés"
+        "french": "Francés",
+        "ukraine": "Ucraniano"
    },
    "help-to-translate": "Ayuda a traducir",
    "change-language": "Cambiar idioma"
--- a/i18n/translations/fr-FR.json
+++ b/i18n/translations/fr-FR.json
@@ -137,13 +137,15 @@
        "package-meta-is-required-at-detail-context": "packageMeta est obligatoire à DetailContext"
    },
    "lng": {
-        "english": "Anglaise",
-        "portuguese": "Portugaise",
+        "english": "Anglais",
+        "japanese": "Japonais",
+        "portuguese": "Portugais",
        "spanish": "Espagnol",
-        "german": "Allemande",
-        "chinese": "Chinoise",
-        "french": "Française"
+        "german": "Allemand",
+        "chinese": "Chinois",
+        "french": "Français",
+        "ukraine": "Ukrainien"
    },
-    "help-to-translate": "Aide à traduire",
+    "help-to-translate": "Aide à la traduction",
    "change-language": "Changer la langue"
 }
--- a/i18n/translations/ja-JP.json
+++ b/i18n/translations/ja-JP.json
@@ -0,0 +1,151 @@
+{
+  "copy-to-clipboard": "クリップボードにコピー",
+  "author-anonymous": "匿名",
+  "action-bar-action": {
+      "visit-home-page": "ホームページへ移動",
+      "open-an-issue": "課題を開く",
+      "download-tarball": "tar形式でダウンロード"
+  },
+  "dialog": {
+      "registry-info": {
+          "title": "レジストリの設定方法"
+      }
+  },
+  "header": {
+      "documentation": "ドキュメント",
+      "registry-info": "レジストリ情報",
+      "greetings": "こんにちは、"
+  },
+  "search": {
+      "packages": "パッケージを検索"
+  },
+  "auto-complete": {
+      "loading": "ロード中...",
+      "no-results-found": "パッケージが見つかりませんでした"
+  },
+  "tab": {
+      "uplinks": "アップリンク",
+      "versions": "バージョン情報",
+      "dependencies": "依存パッケージ",
+      "readme": "Readme"
+  },
+  "uplinks": {
+      "title": "アップリンク",
+      "no-items": "{{name}}にアップリンクはありません"
+  },
+  "versions": {
+      "current-tags": "タグ一覧",
+      "version-history": "バージョン履歴",
+      "not-available": "利用できません"
+  },
+  "package": {
+      "published-on": "{{time}}に更新されました •",
+      "version": "v{{version}}",
+      "visit-home-page": "ホームページへ移動",
+      "homepage": "ホームページ",
+      "open-an-issue": "課題を開く",
+      "bugs": "バグ",
+      "download": "{{what}}ダウンロード",
+      "the-tar-file": "tar形式のファイル",
+      "tarball": "tar形式でダウンロード"
+  },
+  "dependencies": {
+      "has-no-dependencies": "{{package}}に依存パッケージはありません",
+      "dependency-block": "{{package}}@{{version}}"
+  },
+  "form": {
+      "username": "ユーザ名",
+      "password": "パスワード"
+  },
+  "form-placeholder": {
+      "username": "あなたのユーザ名",
+      "password": "あなたのパスワード"
+  },
+  "form-validation": {
+      "required-field": "この項目は必ず入力して下さい",
+      "required-min-length": "この項目は{{length}}文字以上入力して下さい",
+      "unable-to-sign-in": "サインインできません",
+      "username-or-password-cant-be-empty": "ユーザ名とパスワードは空にできません"
+  },
+  "help": {
+      "title": "まだパッケージが登録されていません",
+      "sub-title": "以下の手順で最初のパッケージを登録しましょう",
+      "first-step": "1. ログイン",
+      "first-step-command-line": "npm adduser --registry {{registryUrl}}",
+      "second-step": "2. 登録",
+      "second-step-command-line": "npm publish --registry {{registryUrl}}",
+      "third-step": "3. このページを再読み込みして下さい"
+  },
+  "sidebar": {
+      "detail": {
+          "latest-version": "最新バージョンは{{version}}です",
+          "version": "v{{version}}"
+      },
+      "installation": {
+          "title": "インストール方法",
+          "install-using-yarn": "yarnでインストール",
+          "install-using-yarn-command": "yarn add {{packageName}}",
+          "install-using-npm": "npmでインストール",
+          "install-using-npm-command": "npm install {{packageName}}",
+          "install-using-pnpm": "pnpmでインストール",
+          "install-using-pnpm-command": "pnpm install {{packageName}}"
+      },
+      "repository": {
+          "title": "リポジトリ"
+      },
+      "author": {
+          "title": "作者"
+      },
+      "distribution": {
+          "title": "最新の配信内容",
+          "license": "ライセンス",
+          "size": "サイズ",
+          "file-count": "ファイル数"
+      },
+      "maintainers": {
+          "title": "パッケージメンテナ"
+      },
+      "contributors": {
+          "title": "コントリビューター"
+      },
+      "engines": {
+          "npm-version": "NPM Version",
+          "node-js": "NODE JS"
+      }
+  },
+  "footer": {
+      "powered-by": "Powered by",
+      "made-with-love-on": "Made with <0>♥</0> on"
+  },
+  "button": {
+      "close": "閉じる",
+      "cancel": "キャンセル",
+      "login": "ログイン",
+      "logout": "ログアウト",
+      "go-to-the-home-page": "トップページに戻る",
+      "learn-more": "もっと知る",
+      "fund-this-package": "このパッケージに<0>投資</0>"
+  },
+  "error": {
+      "unspecific": "何か問題が発生したようです。",
+      "404": {
+          "page-not-found": "404 - Page not found",
+          "sorry-we-could-not-find-it": "残念ながら、ご指定のページはありませんでした…。"
+      },
+      "app-context-not-correct-used": "AppContextが正しく使用されませんでした",
+      "theme-context-not-correct-used": "ThemeContextが正しく使用されませんでした",
+      "package-meta-is-required-at-detail-context": "DetailContextではpackageMetaが必要です"
+  },
+  "lng": {
+    "english": "英語",
+    "japanese": "日本語",
+    "portuguese": "ポルトガル語",
+    "spanish": "スペイン語",
+    "german": "ドイツ語",
+    "chinese": "中国語",
+    "french": "フランス語",
+    "ukraine": "ウクライナ"
+   },
+   "help-to-translate": "翻訳を助ける",
+   "change-language": "言語を変更"
+}
--- a/i18n/translations/pt-BR.json
+++ b/i18n/translations/pt-BR.json
@@ -138,11 +138,13 @@
    },
    "lng": {
        "english": "Inglês",
+        "japanese": "Japonês",
        "portuguese": "Português",
        "spanish": "Espanhol",
        "german": "Alemão",
        "chinese": "Chinês",
-        "french": "Francês"
+        "french": "Francês",
+        "ukraine": "Ucraniano"
    },
    "help-to-translate": "Ajude a traduzir",
    "change-language": "Mudar idioma"
--- a/i18n/translations/uk-UA.json
+++ b/i18n/translations/uk-UA.json
@@ -0,0 +1,151 @@
+{
+    "copy-to-clipboard": "Копіювати в буфер обміну",
+    "author-anonymous": "Анонімний",
+    "action-bar-action": {
+        "visit-home-page": "Відвідати домашню сторінку",
+        "open-an-issue": "Відкрити питання, проблему, ...",
+        "download-tarball": "Завантажити архів"
+    },
+    "dialog": {
+        "registry-info": {
+            "title": "Інформація про реєстр"
+        }
+    },
+    "header": {
+        "documentation": "Документація",
+        "registry-info": "Інформація про реєстр",
+        "greetings": "Привіт "
+    },
+    "search": {
+        "packages": "Пошук пакетів"
+    },
+    "auto-complete": {
+        "loading": "Завантаження...",
+        "no-results-found": "Нічого не знайдено"
+    },
+    "tab": {
+        "uplinks": "Публікації",
+        "versions": "Версії",
+        "dependencies": "Залежності",
+        "readme": "Опис"
+    },
+    "uplinks": {
+        "title": "Публікації",
+        "no-items": "{{name}} не опубліковано."
+    },
+    "versions": {
+        "current-tags": "Поточні теги",
+        "version-history": "Історія версій",
+        "not-available": "Недоступний"
+    },
+    "package": {
+        "published-on": "Опубліковано {{time}} •",
+        "version": "v{{version}}",
+        "visit-home-page": "Відвідати домашню сторінку",
+        "homepage": "Домашня сторінка",
+        "open-an-issue": "Відкрити питання, проблему, ...",
+        "bugs": "Помилки",
+        "download": "Завантажити {{what}}",
+        "the-tar-file": "файл tar",
+        "tarball": "Завантажити"
+    },
+    "dependencies": {
+        "has-no-dependencies": "{{package}} не має залежностей.",
+        "dependency-block": "{{package}}@{{version}}"
+    },
+    "form": {
+        "username": "Ім'я користувача",
+        "password": "Пароль"
+    },
+    "form-placeholder": {
+        "username": "Ваше ім'я користувача",
+        "password": "Ваш надійний пароль"
+    },
+    "form-validation": {
+        "required-field": "Це поле є обов'язковим",
+        "required-min-length": "Для цього поля потрібна мінімальна довжина {{length}}",
+        "unable-to-sign-in": "Неможливо ввійти",
+        "username-or-password-cant-be-empty": "Ім'я користувача або пароль не можуть бути порожніми !"
+    },
+    "help": {
+        "title": "Пакети ще не опубліковані",
+        "sub-title": "Опублікувати свій перший пакет просто:",
+        "first-step": "1. Підключіться",
+        "first-step-command-line": "npm adduser --registry {{registryUrl}}",
+        "second-step": "2. Опублікуйте",
+        "second-step-command-line": "npm publish --registry {{registryUrl}}",
+        "third-step": "3. Оновіть цю сторінку."
+    },
+    "sidebar": {
+        "detail": {
+            "latest-version": "Остання версія v{{version}}",
+            "version": "v{{version}}"
+        },
+        "installation": {
+            "title": "Встановлення",
+            "install-using-yarn": "Встановлення за допомогою yarn",
+            "install-using-yarn-command": "yarn add {{packageName}}",
+            "install-using-npm": "Встановлення за допомогою npm",
+            "install-using-npm-command": "npm install {{packageName}}",
+            "install-using-pnpm": "Встановлення за допомогою pnpm",
+            "install-using-pnpm-command": "pnpm install {{packageName}}"
+        },
+        "repository": {
+            "title": "Сховище"
+        },
+        "author": {
+            "title": "Автор"
+        },
+        "distribution": {
+            "title": "Умови поширення",
+            "license": "Ліцензія",
+            "size": "Розмір",
+            "file-count": "кількість файлів"
+        },
+        "maintainers": {
+            "title": "Технічне супроводження"
+        },
+        "contributors": {
+            "title": "Автори"
+        },
+        "engines": {
+            "npm-version": "NPM версія",
+            "node-js": "NODE JS"
+        }
+    },
+    "footer": {
+        "powered-by": "Працює на",
+        "made-with-love-on": "Зроблено з <0> ♥ </0> на"
+    },
+    "button": {
+        "close": "Закрити",
+        "cancel": "Скасувати",
+        "login": "Вхід",
+        "logout": "Вийти",
+        "go-to-the-home-page": "Перейдіть на головну сторінку",
+        "learn-more": "Вивчайте більше",
+        "fund-this-package": "<0>Фінансувати</0> цей пакет"
+    },
+    "error": {
+        "unspecific": "Щось пішло не так.",
+        "404": {
+            "page-not-found": "404 - Сторінку не знайдено",
+            "sorry-we-could-not-find-it": "На жаль, ми не змогли його знайти ..."
+        },
+        "app-context-not-correct-used": "Контекст програми не використовувався правильно",
+        "theme-context-not-correct-used": "Контекст теми використано неправильно",
+        "package-meta-is-required-at-detail-context": "packageMeta is required at DetailContext"
+    },
+    "lng": {
+        "english": "Англійська",
+        "japanese": "Японська",
+        "portuguese": "Португальська",
+        "spanish": "Іспанська",
+        "german": "Німецька",
+        "chinese": "Китайська",
+        "french":  "Французька",
+        "ukraine": "Українська"
+    },
+    "help-to-translate": "Допоможіть перекласти",
+    "change-language": "Змінити мову"
+}
--- a/i18n/translations/zh-CN.json
+++ b/i18n/translations/zh-CN.json
@@ -109,7 +109,7 @@
            "title": "贡献者"
        },
        "engines": {
-            "npm-version": "NPM Version",
+            "npm-version": "NPM版本",
            "node-js": "NODE JS"
        }
    },
@@ -136,13 +136,15 @@
        "package-meta-is-required-at-detail-context": "packageMeta is required at DetailContext"
    },
    "lng": {
-        "english": "英語",
-        "portuguese": "葡萄牙語",
-        "spanish": "西班牙文",
-        "german": "德語",
+        "english": "英语",
+        "japanese": "日语",
+        "portuguese": "葡萄牙语",
+        "spanish": "西班牙语",
+        "german": "德语",
        "chinese": "中文",
-        "french": "法國人"
+        "french": "法语",
+        "ukraine": "烏克蘭"
    },
-    "help-to-translate": "幫助翻譯",
-    "change-language": "改變語言"
+    "help-to-translate": "幫助翻译",
+    "change-language": "改变语言"
 }
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@verdaccio/ui-theme",
-  "version": "1.6.0",
+  "version": "1.7.1",
  "description": "Verdaccio User Interface",
  "author": {
    "name": "Verdaccio Core Team",
@@ -19,6 +19,8 @@
    "@commitlint/config-conventional": "8.3.4",
    "@emotion/core": "10.0.22",
    "@emotion/styled": "10.0.23",
+    "@htmllinter/basic-standard": "0.0.2",
+    "@htmllinter/core": "0.0.1",
    "@material-ui/core": "4.8.0",
    "@material-ui/icons": "4.5.1",
    "@octokit/rest": "16.35.2",
@@ -144,7 +146,7 @@
    },
    {
      "path": "./static/main.*.js",
-      "maxSize": "30 kB"
+      "maxSize": "35 kB"
    },
    {
      "path": "./static/[0-9].*.{js,css}",
@@ -177,6 +179,7 @@
    "test:size": "bundlesize",
    "lint": "npm run lint:js && npm run lint:css && npm run lint:lockfile",
    "lint:js": "npm run type-check && eslint . --ext .js,.ts,.tsx",
+    "lint:html": "htmllinter src/template/index.html",
    "lint:css": "stylelint \"src/**/styles.ts\"",
    "lint:lockfile": "lockfile-lint --path yarn.lock --type yarn --validate-https --allowed-hosts verdaccio npm yarn",
    "coverage:publish": "codecov",
--- a/src/App/App.tsx
+++ b/src/App/App.tsx
@@ -13,10 +13,10 @@ import Loading from '../components/Loading';
 import Box from '../muiComponents/Box';
 import StyleBaseline from '../design-tokens/StyleBaseline';
 import { Theme } from '../design-tokens/theme';
+import loadDayJSLocale from '../design-tokens/load-dayjs-locale';

 import AppContextProvider from './AppContextProvider';
 import AppRoute, { history } from './AppRoute';
-import loadDayJSLocale from './load-dayjs-locale';

 const StyledBox = styled(Box)<{ theme?: Theme }>(({ theme }) => ({
  backgroundColor: theme?.palette.background.default,
--- a/src/components/Icon/Icon.tsx
+++ b/src/components/Icon/Icon.tsx
@@ -13,6 +13,8 @@ import austria from './img/austria.svg';
 import spain from './img/spain.svg';
 import usa from './img/usa.svg';
 import france from './img/france.svg';
+import japan from './img/japan.svg';
+import ukraine from './img/ukraine.svg';
 import earth from './img/earth.svg';
 import verdaccio from './img/verdaccio.svg';
 import filebinary from './img/filebinary.svg';
@@ -32,6 +34,8 @@ export interface IconsMap {
  france: string;
  germany: string;
  india: string;
+  japan: string;
+  ukraine: string;
  earth: string;
  verdaccio: string;
  license: string;
@@ -60,6 +64,8 @@ export const Icons: IconsMap = {
  germany,
  usa,
  france,
+  japan,
+  ukraine,
 };

 export interface Props {
--- a/src/components/Icon/img/japan.svg
+++ b/src/components/Icon/img/japan.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="japan"><path d="M473.655 88.275H38.345C17.167 88.275 0 105.442 0 126.62v258.76c0 21.177 17.167 38.345 38.345 38.345h435.31c21.177 0 38.345-17.167 38.345-38.345V126.62c0-21.178-17.167-38.345-38.345-38.345z" fill="#f5f5f5"/><circle cx="256" cy="255.999" r="97.1" fill="#ff4b55"/></svg>
--- a/src/components/Icon/img/ukraine.svg
+++ b/src/components/Icon/img/ukraine.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="ukraine"><path d="M0 248v121.6C0 396.8 21.6 416 48 416h400c26.4 0 48-19.2 48-46.4V248H0z" fill="#fdce0c"/><path d="M248 248l197.6 168c26.4 0 50.4-19.2 50.4-46.4V248H248z" fill="#f4ba00"/><path d="M448 80H48C21.6 80 0 99.2 0 126.4V248h496V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#44c1ef"/><path d="M448 80H48l200 168h248V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#18b4ea"/><path d="M496 368.8c0 29.6-21.6 47.2-48 47.2H48c-26.4 0-48-20.8-48-48" fill="#f2a700"/><path d="M48 80h400c26.4 0 48 19.2 48 46.4V216" fill="#10a2e2"/></svg>
--- a/src/components/LanguageSwitch/LanguageSwitch.tsx
+++ b/src/components/LanguageSwitch/LanguageSwitch.tsx
@@ -9,7 +9,6 @@ import Grow from '@material-ui/core/Grow';
 import Popper from '@material-ui/core/Popper';
 import MenuList from '@material-ui/core/MenuList';
 import styled from '@emotion/styled';
-import { css } from '@emotion/core';

 import { Language } from '../../../i18n/config';
 import ThemeContext from '../../design-tokens/ThemeContext';
@@ -25,34 +24,53 @@ import Icon from '../Icon';

 const VERDACCIO_UI_GITHUB_REPOSITORY = 'https://github.com/verdaccio/ui';

-const getTranslatedCurrentLanguage = (
-  t: TFunction
-): { [key: string]: { translation: string; icon: React.ComponentProps<typeof Icon>['name'] } } => ({
-  'en-us': {
-    translation: t('lng.english'),
-    icon: 'usa',
-  },
-  'fr-fr': {
+const getTranslatedCurrentLanguageDetails = (
+  t: TFunction,
+  currentLanguage: string
+): { translation: string; icon: React.ComponentProps<typeof Icon>['name'] } => {
+  switch (currentLanguage) {
+    case 'fr-FR':
+      return {
        translation: t('lng.french'),
        icon: 'france',
-  },
-  'pt-br': {
+      };
+    case 'pt-BR':
+      return {
        translation: t('lng.portuguese'),
        icon: 'brazil',
-  },
-  'de-de': {
+      };
+    case 'de-DE':
+      return {
        translation: t('lng.german'),
        icon: 'germany',
-  },
-  'es-es': {
+      };
+    case 'es-ES':
+      return {
        translation: t('lng.spanish'),
        icon: 'spain',
-  },
-  'zh-cn': {
+      };
+    case 'zh-CN':
+      return {
        translation: t('lng.chinese'),
        icon: 'china',
-  },
-});
+      };
+    case 'ja-JP':
+      return {
+        translation: t('lng.japanese'),
+        icon: 'japan',
+      };
+    case 'uk-UA':
+      return {
+        translation: t('lng.ukraine'),
+        icon: 'ukraine',
+      };
+    default:
+      return {
+        translation: t('lng.english'),
+        icon: 'usa',
+      };
+  }
+};

 const LanguageSwitch = () => {
  const themeContext = useContext(ThemeContext);
@@ -65,9 +83,9 @@ const LanguageSwitch = () => {
  }

  const languages = (i18next.options.resources ? Object.keys(i18next.options.resources) : []) as Array<Language>;
-  const currentLanguage: Language = i18next.language || i18next.options?.fallbackLng?.[0];
+  const currentLanguage = themeContext.language;

-  const { translation: userLanguage } = getTranslatedCurrentLanguage(t)[currentLanguage.toLowerCase()];
+  const { translation: userLanguage } = getTranslatedCurrentLanguageDetails(t, currentLanguage);

  const handleToggle = useCallback(() => {
    setOpen(prevOpen => !prevOpen);
@@ -124,7 +142,7 @@ const LanguageSwitch = () => {
                  {languages
                    .filter(language => language !== currentLanguage)
                    .map(language => {
-                      const { icon, translation } = getTranslatedCurrentLanguage(t)[language.toLowerCase()];
+                      const { icon, translation } = getTranslatedCurrentLanguageDetails(t, language);
                      return (
                        <StyledMenuItem
                          key={language}
--- a/src/design-tokens/ThemeProvider.tsx
+++ b/src/design-tokens/ThemeProvider.tsx
@@ -3,15 +3,14 @@ import { ThemeProvider as MuiThemeProvider } from '@material-ui/core/styles';
 import { ThemeProvider as EmotionThemeProvider } from 'emotion-theming';
 import i18next from 'i18next';

-import { Language } from '../../i18n/config';
-
+import loadDayJSLocale from './load-dayjs-locale';
 import ThemeContext from './ThemeContext';
 import { getTheme, ThemeMode } from './theme';
 import useLocalStorage from './useLocalStorage';

 const ThemeProvider: React.FC = ({ children }) => {
  const isDarkModeDefault = window?.__VERDACCIO_BASENAME_UI_OPTIONS?.darkMode;
-  const currentLanguage: Language = i18next.language || i18next.options?.fallbackLng?.[0];
+  const currentLanguage = i18next.languages?.[0];

  const [isDarkMode, setIsDarkMode] = useLocalStorage('darkMode', !!isDarkModeDefault);
  const [language, setLanguage] = useLocalStorage('language', currentLanguage);
@@ -24,7 +23,8 @@ const ThemeProvider: React.FC = ({ children }) => {

  useEffect(() => {
    changeLanguage();
-  }, [language, changeLanguage]);
+    loadDayJSLocale();
+  }, [language, changeLanguage, loadDayJSLocale]);

  return (
    <ThemeContext.Provider value={{ isDarkMode, setIsDarkMode, language, setLanguage }}>
--- a/src/design-tokens/load-dayjs-locale.ts
+++ b/src/design-tokens/load-dayjs-locale.ts
@@ -19,12 +19,7 @@ function loadDayJSLocale() {
  const fallbackLanguage = getFallFackLanguage();
  const locale = i18n.language || fallbackLanguage;

-  // dayjs loades en-US by default
-  if (!locale || locale === 'en-US') {
-    return;
-  }
-
-  switch (locale.toLowerCase()) {
+  switch (locale?.toLowerCase()) {
    case 'pt-br':
      {
        require('dayjs/locale/pt-br');
@@ -55,7 +50,23 @@ function loadDayJSLocale() {
        dayjs.locale('zh-cn');
      }
      break;
+    case 'ja-jp':
+      {
+        require('dayjs/locale/ja');
+        dayjs.locale('ja');
+      }
+      break;
+    case 'uk-ua':
+      {
+        require('dayjs/locale/uk');
+        dayjs.locale('uk');
+      }
+      break;
    default:
+      {
+        require('dayjs/locale/en');
+        dayjs.locale('en');
+      }
      break;
  }
 }
--- a/src/utils/package.test.ts
+++ b/src/utils/package.test.ts
@@ -50,7 +50,7 @@ describe('formatRepository', (): void => {
 describe('formatDate', (): void => {
  test('should format the date', (): void => {
    const date = 1532211072138;
-    expect(formatDate(date)).toEqual('21.07.2018, 22:11:12');
+    expect(formatDate(date)).toEqual('07/21/2018 10:11:12 PM');
  });
 });

@@ -78,7 +78,7 @@ describe('formatDateDistance', (): void => {
 describe('getLastUpdatedPackageTime', (): void => {
  test('should get the last update time', (): void => {
    const lastUpdated = packageMeta._uplinks;
-    expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('22.07.2018, 22:11:12');
+    expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('07/22/2018 10:11:12 PM');
  });

  test('should get the last update time for blank uplink', (): void => {
@@ -91,9 +91,9 @@ describe('getRecentReleases', (): void => {
  test('should get the recent releases', (): void => {
    const { time } = packageMeta;
    const result = [
-      { time: '14.12.2017, 15:43:27', version: '2.7.1' },
-      { time: '05.12.2017, 23:25:06', version: '2.7.0' },
-      { time: '08.11.2017, 22:47:16', version: '2.6.6' },
+      { time: '12/14/2017 3:43:27 PM', version: '2.7.1' },
+      { time: '12/05/2017 11:25:06 PM', version: '2.7.0' },
+      { time: '11/08/2017 10:47:16 PM', version: '2.6.6' },
    ];
    expect(getRecentReleases(time)).toEqual(result);
    expect(getRecentReleases()).toEqual([]);
--- a/src/utils/package.ts
+++ b/src/utils/package.ts
@@ -5,12 +5,14 @@ import { UpLinks } from '@verdaccio/types';
 import isString from 'lodash/isString';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
+import localizedFormat from 'dayjs/plugin/localizedFormat';

 import { Time } from '../../types/packageMeta';

-export const TIMEFORMAT = 'DD.MM.YYYY, HH:mm:ss';
+export const TIMEFORMAT = 'L LTS';

 dayjs.extend(relativeTime);
+dayjs.extend(localizedFormat);

 /**
 * Formats license field for webui.
--- a/yarn.lock
+++ b/yarn.lock
@@ -1731,6 +1731,23 @@
  dependencies:
    "@hapi/hoek" "^8.3.0"

+"@htmllinter/basic-standard@0.0.2":
+  version "0.0.2"
+  resolved "https://registry.verdaccio.org/@htmllinter%2fbasic-standard/-/basic-standard-0.0.2.tgz#55ed8653793b5c8cf5ae9f021372438d534d8d0a"
+  integrity sha512-g2wtMFQ6frAatS7g/PKjH7R2lnAJUJR9y9hXVUZlVQiNRINI2uDRGrLm0ejrAUI4za1cgT6VXnAyccn2OxufYw==
+  dependencies:
+    "@htmllinter/core" "^0.1.1"
+
+"@htmllinter/core@0.0.1", "@htmllinter/core@^0.1.1":
+  version "0.0.1"
+  resolved "https://registry.verdaccio.org/@htmllinter%2fcore/-/core-0.0.1.tgz#b519e3260b66576758357d8b4f8f447053a15184"
+  integrity sha512-i5n+LNhkudUi+QqYncA/mIGODY0dsCs8pzqXroNCZD4uOBRJH2dhSxVcmTYD6UJOw1u9koD0VK3nc1L/PjSliA==
+  dependencies:
+    chalk "^3.0.0"
+    cli-table3 "^0.5.1"
+    glob "^7.1.6"
+    posthtml "^0.12.0"
+
 "@istanbuljs/load-nyc-config@^1.0.0":
  version "1.0.0"
  resolved "https://registry.verdaccio.org/@istanbuljs%2fload-nyc-config/-/load-nyc-config-1.0.0.tgz#10602de5570baea82f8afbfa2630b24e7a8cfe5b"
@@ -4381,6 +4398,16 @@ cli-spinners@^2.2.0:
  resolved "https://registry.verdaccio.org/cli-spinners/-/cli-spinners-2.2.0.tgz#e8b988d9206c692302d8ee834e7a85c0144d8f77"
  integrity sha512-tgU3fKwzYjiLEQgPMD9Jt+JjHVL9kW93FiIMX/l7rivvOD4/LL0Mf7gda3+4U2KJBloybwgj5KEoQgGRioMiKQ==

+cli-table3@^0.5.1:
+  version "0.5.1"
+  resolved "https://registry.verdaccio.org/cli-table3/-/cli-table3-0.5.1.tgz#0252372d94dfc40dbd8df06005f48f31f656f202"
+  integrity sha512-7Qg2Jrep1S/+Q3EceiZtQcDPWxhAvBw+ERf1162v4sikJrvojMHFqXt8QIVha8UlH9rgU0BeWPytZ9/TzYqlUw==
+  dependencies:
+    object-assign "^4.1.0"
+    string-width "^2.1.1"
+  optionalDependencies:
+    colors "^1.1.2"
+
 cli-truncate@^0.2.1:
  version "0.2.1"
  resolved "https://registry.verdaccio.org/cli-truncate/-/cli-truncate-0.2.1.tgz#9f15cfbb0705005369216c626ac7d05ab90dd574"
@@ -4561,6 +4588,11 @@ color@^3.0.0:
    color-convert "^1.9.1"
    color-string "^1.5.2"

+colors@^1.1.2:
+  version "1.4.0"
+  resolved "https://registry.verdaccio.org/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
+  integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
+
 combined-stream@^1.0.6, combined-stream@~1.0.5, combined-stream@~1.0.6:
  version "1.0.8"
  resolved "https://registry.verdaccio.org/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
@@ -7845,7 +7877,7 @@ html-webpack-plugin@3.2.0:
    toposort "^1.0.0"
    util.promisify "1.0.0"

-htmlparser2@^3.10.0, htmlparser2@^3.3.0, htmlparser2@^3.9.1:
+htmlparser2@^3.10.0, htmlparser2@^3.3.0, htmlparser2@^3.9.1, htmlparser2@^3.9.2:
  version "3.10.1"
  resolved "https://registry.verdaccio.org/htmlparser2/-/htmlparser2-3.10.1.tgz#bd679dc3f59897b6a34bb10749c855bb53a9392f"
  integrity sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==
@@ -12189,6 +12221,26 @@ postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.16, postcss@^7.0.2
    source-map "^0.6.1"
    supports-color "^6.1.0"

+posthtml-parser@^0.4.1:
+  version "0.4.2"
+  resolved "https://registry.verdaccio.org/posthtml-parser/-/posthtml-parser-0.4.2.tgz#a132bbdf0cd4bc199d34f322f5c1599385d7c6c1"
+  integrity sha512-BUIorsYJTvS9UhXxPTzupIztOMVNPa/HtAm9KHni9z6qEfiJ1bpOBL5DfUOL9XAc3XkLIEzBzpph+Zbm4AdRAg==
+  dependencies:
+    htmlparser2 "^3.9.2"
+
+posthtml-render@^1.1.5:
+  version "1.2.0"
+  resolved "https://registry.verdaccio.org/posthtml-render/-/posthtml-render-1.2.0.tgz#3df0c800a8bbb95af583a94748520469477addf4"
+  integrity sha512-dQB+hoAKDtnI94RZm/wxBUH9My8OJcXd0uhWmGh2c7tVtQ85A+OS3yCN3LNbFtPz3bViwBJXAeoi+CBGMXM0DA==
+
+posthtml@^0.12.0:
+  version "0.12.0"
+  resolved "https://registry.verdaccio.org/posthtml/-/posthtml-0.12.0.tgz#6e2a2fcd774eaed1a419a95c5cc3a92b676a40a6"
+  integrity sha512-aNUEP/SfKUXAt+ghG51LC5MmafChBZeslVe/SSdfKIgLGUVRE68mrMF4V8XbH07ZifM91tCSuxY3eHIFLlecQw==
+  dependencies:
+    posthtml-parser "^0.4.1"
+    posthtml-render "^1.1.5"
+
 prebuild-install@^5.3.0:
  version "5.3.2"
  resolved "https://registry.verdaccio.org/prebuild-install/-/prebuild-install-5.3.2.tgz#6392e9541ac0b879ef0f22b3d65037417eb2035e"
Author	SHA1	Message	Date
Juan Picado	294c9f8126	Merge branch 'master' into chore-html-linter	2020-05-04 07:43:04 +02:00
Mykola	b59840d352	add a new language - Ukrainian && fix bug with dayjs locale (#472 )	2020-05-03 17:45:17 +02:00
Priscila Oliveira	2965973f77	ref(doc): replaced cs_cz with czech (#474 )	2020-05-03 15:28:38 +02:00
hdmr14	c9910c97b0	fix: time format localization (#471 )	2020-05-03 15:17:38 +02:00
Priscila Oliveira	1e060474c7	ref(doc): updated translation section (#473 )	2020-05-03 08:21:59 +02:00
Jean-Francois Thuong	f8101ae90a	fix: update zh-CN.json (#466 ) Improve list of languages in Chinese (Simplified) and other misc improvements Co-authored-by: Juan Picado <juanpicado19@gmail.com>	2020-05-02 09:35:08 +02:00
Jean-Francois Thuong	bf54b4abab	Update fr-FR.json (#467 ) Improve list of languages in French	2020-05-01 20:14:09 +02:00
Juan Picado @jotadeveloper	5e3c006cbd	chore(release): 1.7.1	2020-04-27 21:37:54 +02:00
Priscila Oliveira	f44abd7dd0	fix(i18n): fixed current locale (#462 ) * fix(i18n): fixed current locale * Update i18n/translations/ja-JP.json Co-Authored-By: hdmr14 <58992133+hdmr14@users.noreply.github.com> Co-authored-by: hdmr14 <58992133+hdmr14@users.noreply.github.com>	2020-04-27 21:36:40 +02:00
Juan Picado @jotadeveloper	730c3471c2	chore(release): 1.7.0	2020-04-24 07:40:57 +02:00
hdmr14	25def6ccd5	feat: add japanese translations (#460 ) * feat: add japanese translations * fix: remove redundant words in ja-JP translation Co-authored-by: Juan Picado <juanpicado19@gmail.com>	2020-04-24 07:39:09 +02:00
Juan Picado @jotadeveloper	8d0d39006a	Merge remote-tracking branch 'origin/master' into chore-html-linter	2020-02-28 08:04:49 +01:00
Juan Picado @jotadeveloper	49dd93a971	chore: add html linter	2020-02-28 08:03:22 +01:00
				`@@ -0,0 +1 @@`
				`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="japan"><path d="M473.655 88.275H38.345C17.167 88.275 0 105.442 0 126.62v258.76c0 21.177 17.167 38.345 38.345 38.345h435.31c21.177 0 38.345-17.167 38.345-38.345V126.62c0-21.178-17.167-38.345-38.345-38.345z" fill="#f5f5f5"/><circle cx="256" cy="255.999" r="97.1" fill="#ff4b55"/></svg>`
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="ukraine"><path d="M0 248v121.6C0 396.8 21.6 416 48 416h400c26.4 0 48-19.2 48-46.4V248H0z" fill="#fdce0c"/><path d="M248 248l197.6 168c26.4 0 50.4-19.2 50.4-46.4V248H248z" fill="#f4ba00"/><path d="M448 80H48C21.6 80 0 99.2 0 126.4V248h496V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#44c1ef"/><path d="M448 80H48l200 168h248V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#18b4ea"/><path d="M496 368.8c0 29.6-21.6 47.2-48 47.2H48c-26.4 0-48-20.8-48-48" fill="#f2a700"/><path d="M48 80h400c26.4 0 48 19.2 48 46.4V216" fill="#10a2e2"/></svg>