@adminforth/i18n 3.0.0 → 3.1.1

package/build.log

@@ -6,7 +6,6 @@ sending incremental file list
 custom/
 custom/BulkActionButton.vue
 custom/LanguageEveryPageLoader.vue
-custom/LanguageFlag.vue
 custom/LanguageInUserMenu.vue
 custom/LanguageUnderLogin.vue
 custom/ListCell.vue
@@ -21,5 +20,5 @@ custom/package.json
 custom/pnpm-lock.yaml
 custom/tsconfig.json
 
-sent 45,404 bytes  received 324 bytes  91,456.00 bytes/sec
-total size is 44,165  speedup is 0.97
+sent 44,008 bytes  received 305 bytes  88,626.00 bytes/sec
+total size is 42,840  speedup is 0.97

package/custom/BulkActionButton.vue

@@ -38,7 +38,7 @@
       <div class="col-span-2 grid grid-cols-3 gap-x-2 gap-y-3 mt-4">
         <Checkbox v-for="(index, lang) in checkedLanguages" :key="lang" v-model="checkedLanguages[lang]">
           <span class="flex items-center gap-2">
-            <LanguageFlag :countryCode="props.meta.countryCodes[lang]" />
+            <CountryFlag size="sm" :countryCode="props.meta.countryCodes[lang]" />
             {{ ISO6391.getName(lang.slice(0,2)) }} ({{ lang }})
           </span>
         </Checkbox>
@@ -51,13 +51,12 @@
 <script setup lang="ts">
   import { IconLanguages } from '@iconify-prerendered/vue-lucide';
   import { useI18n } from 'vue-i18n';
-  import { Dialog, Button, Checkbox, Spinner } from '@/afcl';
+  import { Dialog, Button, Checkbox, CountryFlag, Spinner } from '@/afcl';
   import { computed, onMounted, ref, onUnmounted } from 'vue';
   import { callAdminForthApi } from '@/utils';
   import { useAdminforth } from '@/adminforth';
   import { getName, overwrite } from 'country-list';
   import ISO6391 from 'iso-639-1';
-  import LanguageFlag from './LanguageFlag.vue';
   import websocket from '@/websocket';
   import { useFiltersStore } from '@/stores/filters';
   import { useBackgroundJobApi } from '@/custom/plugins/BackgroundJobsPlugin/useBackgroundJobApi.ts';

package/custom/LanguageInUserMenu.vue

@@ -1,7 +1,7 @@
 <template>
   <DropdownMenuAccordion class="af-language-in-user-menu" :label="selectedOption.label" :triggerClass="USER_MENU_ITEM_CLASSES">
     <template #icon>
-      <LanguageFlag :countryCode="selectedOption.countryCode" />
+      <CountryFlag size="sm" :countryCode="selectedOption.countryCode" />
     </template>
     <DropdownMenuItem
       v-for="option in options.filter((opt) => opt.value !== selectedOption.value)"
@@ -10,7 +10,7 @@
       @click="doChangeLang(option.value)"
     >
       <template #icon>
-        <LanguageFlag :countryCode="option.countryCode" />
+        <CountryFlag size="sm" :countryCode="option.countryCode" />
       </template>
       {{ option.label }}
     </DropdownMenuItem>
@@ -18,9 +18,8 @@
 </template>
 
 <script setup>
-import { DropdownMenuAccordion, DropdownMenuItem } from '@/afcl';
 import { USER_MENU_ITEM_CLASSES } from '@/utils/userMenu';
-import LanguageFlag from './LanguageFlag.vue';
+import { CountryFlag, DropdownMenuAccordion, DropdownMenuItem } from '@/afcl';
 
 import { setLang, getLocalLang, setLocalLang, getLanguageOptions } from './langCommon';
 

package/custom/LanguageUnderLogin.vue

@@ -8,14 +8,14 @@
     >
       <template #item="{ option }">
         <span class="flex items-center gap-2">
-          <LanguageFlag :countryCode="option.countryCode" />
+          <CountryFlag size="sm" :countryCode="option.countryCode" />
           {{ option.label }}
         </span>
       </template>
 
       <template #selected-item="{ option }">
         <span class="flex items-center gap-2">
-          <LanguageFlag :countryCode="option.countryCode" />
+          <CountryFlag size="sm" :countryCode="option.countryCode" />
           {{ option.label }}
         </span>
       </template>
@@ -24,8 +24,7 @@
 </template>
 
 <script setup>
-import Select from '@/afcl/Select.vue';
-import LanguageFlag from './LanguageFlag.vue';
+import { CountryFlag, Select } from '@/afcl';
 import { setLang, getLocalLang, getLanguageOptions } from './langCommon';
 import { useCoreStore } from '@/stores/core';
 

package/custom/TranslationJobViewComponent.vue

@@ -21,7 +21,7 @@
           {{  task.state?.taskName }} to
         </span>
         <div class="flex items-center gap-2 shrink-0">
-          <LanguageFlag :countryCode="task.state?.countryCode" />
+          <CountryFlag size="sm" :countryCode="task.state?.countryCode" />
           <component
             :is="getCustomComponent({file: '@@/plugins/BackgroundJobsPlugin/StateToIcon.vue'})"
             :status="task.status"
@@ -62,9 +62,8 @@ import { useI18n } from 'vue-i18n'
 import { computed, onMounted, onUnmounted, ref } from 'vue';
 import websocket from '@/websocket';
 import { getCustomComponent } from '@/utils';
-import { Button, Spinner } from '@/afcl';
+import { Button, CountryFlag, Spinner } from '@/afcl';
 import { IconChevronLeft, IconChevronRight } from '@iconify-prerendered/vue-lucide';
-import LanguageFlag from './LanguageFlag.vue';
 
 const { t } = useI18n();
 

package/custom/package-lock.json

@@ -12,9 +12,7 @@
         "country-list": "^2.4.1",
         "iso-639-1": "^3.1.5"
       },
-      "devDependencies": {
-        "flag-icon-css": "^4.1.7"
-      }
+      "devDependencies": {}
     },
     "node_modules/country-list": {
       "version": "2.4.1",
@@ -22,14 +20,6 @@
       "integrity": "sha512-KhVV/UfUV3dSNpsWIqHTQxLpYDKPKz1UwkRjadt+YbX2PRhyCEihEoS5XgB7J7AMXpkicvl+tRHvkNI5wbji/g==",
       "license": "MIT"
     },
-    "node_modules/flag-icon-css": {
-      "version": "4.1.7",
-      "resolved": "https://registry.npmjs.org/flag-icon-css/-/flag-icon-css-4.1.7.tgz",
-      "integrity": "sha512-AFjSU+fv98XbU0vnTQ32vcLj89UEr1MhwDFcooQv14qWJCjg9fGZzfh9BVyDhAhIOZW/pGmJmq38RqpgPaeybQ==",
-      "deprecated": "The project has been renamed to flag-icons",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/iso-639-1": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/iso-639-1/-/iso-639-1-3.1.5.tgz",

package/custom/package.json

@@ -10,7 +10,6 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "flag-icon-css": "^4.1.7"
   },
   "dependencies": {
     "country-list": "^2.4.1",

package/custom/pnpm-lock.yaml

@@ -14,20 +14,12 @@ importers:
       iso-639-1:
         specifier: ^3.1.5
         version: 3.1.5
-    devDependencies:
-      flag-icon-css:
-        specifier: ^4.1.7
-        version: 4.1.7
 
 packages:
 
   country-list@2.4.1:
     resolution: {integrity: sha512-KhVV/UfUV3dSNpsWIqHTQxLpYDKPKz1UwkRjadt+YbX2PRhyCEihEoS5XgB7J7AMXpkicvl+tRHvkNI5wbji/g==}
 
-  flag-icon-css@4.1.7:
-    resolution: {integrity: sha512-AFjSU+fv98XbU0vnTQ32vcLj89UEr1MhwDFcooQv14qWJCjg9fGZzfh9BVyDhAhIOZW/pGmJmq38RqpgPaeybQ==}
-    deprecated: The project has been renamed to flag-icons
-
   iso-639-1@3.1.5:
     resolution: {integrity: sha512-gXkz5+KN7HrG0Q5UGqSMO2qB9AsbEeyLP54kF1YrMsIxmu+g4BdB7rflReZTSTZGpfj8wywu6pfPBCylPIzGQA==}
     engines: {node: '>=6.0'}
@@ -36,6 +28,4 @@ snapshots:
 
   country-list@2.4.1: {}
 
-  flag-icon-css@4.1.7: {}
-
   iso-639-1@3.1.5: {}

package/dist/custom/BulkActionButton.vue

@@ -38,7 +38,7 @@
       <div class="col-span-2 grid grid-cols-3 gap-x-2 gap-y-3 mt-4">
         <Checkbox v-for="(index, lang) in checkedLanguages" :key="lang" v-model="checkedLanguages[lang]">
           <span class="flex items-center gap-2">
-            <LanguageFlag :countryCode="props.meta.countryCodes[lang]" />
+            <CountryFlag size="sm" :countryCode="props.meta.countryCodes[lang]" />
             {{ ISO6391.getName(lang.slice(0,2)) }} ({{ lang }})
           </span>
         </Checkbox>
@@ -51,13 +51,12 @@
 <script setup lang="ts">
   import { IconLanguages } from '@iconify-prerendered/vue-lucide';
   import { useI18n } from 'vue-i18n';
-  import { Dialog, Button, Checkbox, Spinner } from '@/afcl';
+  import { Dialog, Button, Checkbox, CountryFlag, Spinner } from '@/afcl';
   import { computed, onMounted, ref, onUnmounted } from 'vue';
   import { callAdminForthApi } from '@/utils';
   import { useAdminforth } from '@/adminforth';
   import { getName, overwrite } from 'country-list';
   import ISO6391 from 'iso-639-1';
-  import LanguageFlag from './LanguageFlag.vue';
   import websocket from '@/websocket';
   import { useFiltersStore } from '@/stores/filters';
   import { useBackgroundJobApi } from '@/custom/plugins/BackgroundJobsPlugin/useBackgroundJobApi.ts';

package/dist/custom/LanguageInUserMenu.vue

@@ -1,7 +1,7 @@
 <template>
   <DropdownMenuAccordion class="af-language-in-user-menu" :label="selectedOption.label" :triggerClass="USER_MENU_ITEM_CLASSES">
     <template #icon>
-      <LanguageFlag :countryCode="selectedOption.countryCode" />
+      <CountryFlag size="sm" :countryCode="selectedOption.countryCode" />
     </template>
     <DropdownMenuItem
       v-for="option in options.filter((opt) => opt.value !== selectedOption.value)"
@@ -10,7 +10,7 @@
       @click="doChangeLang(option.value)"
     >
       <template #icon>
-        <LanguageFlag :countryCode="option.countryCode" />
+        <CountryFlag size="sm" :countryCode="option.countryCode" />
       </template>
       {{ option.label }}
     </DropdownMenuItem>
@@ -18,9 +18,8 @@
 </template>
 
 <script setup>
-import { DropdownMenuAccordion, DropdownMenuItem } from '@/afcl';
 import { USER_MENU_ITEM_CLASSES } from '@/utils/userMenu';
-import LanguageFlag from './LanguageFlag.vue';
+import { CountryFlag, DropdownMenuAccordion, DropdownMenuItem } from '@/afcl';
 
 import { setLang, getLocalLang, setLocalLang, getLanguageOptions } from './langCommon';
 

package/dist/custom/LanguageUnderLogin.vue

@@ -8,14 +8,14 @@
     >
       <template #item="{ option }">
         <span class="flex items-center gap-2">
-          <LanguageFlag :countryCode="option.countryCode" />
+          <CountryFlag size="sm" :countryCode="option.countryCode" />
           {{ option.label }}
         </span>
       </template>
 
       <template #selected-item="{ option }">
         <span class="flex items-center gap-2">
-          <LanguageFlag :countryCode="option.countryCode" />
+          <CountryFlag size="sm" :countryCode="option.countryCode" />
           {{ option.label }}
         </span>
       </template>
@@ -24,8 +24,7 @@
 </template>
 
 <script setup>
-import Select from '@/afcl/Select.vue';
-import LanguageFlag from './LanguageFlag.vue';
+import { CountryFlag, Select } from '@/afcl';
 import { setLang, getLocalLang, getLanguageOptions } from './langCommon';
 import { useCoreStore } from '@/stores/core';
 

package/dist/custom/TranslationJobViewComponent.vue

@@ -21,7 +21,7 @@
           {{  task.state?.taskName }} to
         </span>
         <div class="flex items-center gap-2 shrink-0">
-          <LanguageFlag :countryCode="task.state?.countryCode" />
+          <CountryFlag size="sm" :countryCode="task.state?.countryCode" />
           <component
             :is="getCustomComponent({file: '@@/plugins/BackgroundJobsPlugin/StateToIcon.vue'})"
             :status="task.status"
@@ -62,9 +62,8 @@ import { useI18n } from 'vue-i18n'
 import { computed, onMounted, onUnmounted, ref } from 'vue';
 import websocket from '@/websocket';
 import { getCustomComponent } from '@/utils';
-import { Button, Spinner } from '@/afcl';
+import { Button, CountryFlag, Spinner } from '@/afcl';
 import { IconChevronLeft, IconChevronRight } from '@iconify-prerendered/vue-lucide';
-import LanguageFlag from './LanguageFlag.vue';
 
 const { t } = useI18n();
 

package/dist/custom/package-lock.json

@@ -12,9 +12,7 @@
         "country-list": "^2.4.1",
         "iso-639-1": "^3.1.5"
       },
-      "devDependencies": {
-        "flag-icon-css": "^4.1.7"
-      }
+      "devDependencies": {}
     },
     "node_modules/country-list": {
       "version": "2.4.1",
@@ -22,14 +20,6 @@
       "integrity": "sha512-KhVV/UfUV3dSNpsWIqHTQxLpYDKPKz1UwkRjadt+YbX2PRhyCEihEoS5XgB7J7AMXpkicvl+tRHvkNI5wbji/g==",
       "license": "MIT"
     },
-    "node_modules/flag-icon-css": {
-      "version": "4.1.7",
-      "resolved": "https://registry.npmjs.org/flag-icon-css/-/flag-icon-css-4.1.7.tgz",
-      "integrity": "sha512-AFjSU+fv98XbU0vnTQ32vcLj89UEr1MhwDFcooQv14qWJCjg9fGZzfh9BVyDhAhIOZW/pGmJmq38RqpgPaeybQ==",
-      "deprecated": "The project has been renamed to flag-icons",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/iso-639-1": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/iso-639-1/-/iso-639-1-3.1.5.tgz",

package/dist/custom/package.json

@@ -10,7 +10,6 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "flag-icon-css": "^4.1.7"
   },
   "dependencies": {
     "country-list": "^2.4.1",

package/dist/custom/pnpm-lock.yaml

@@ -14,20 +14,12 @@ importers:
       iso-639-1:
         specifier: ^3.1.5
         version: 3.1.5
-    devDependencies:
-      flag-icon-css:
-        specifier: ^4.1.7
-        version: 4.1.7
 
 packages:
 
   country-list@2.4.1:
     resolution: {integrity: sha512-KhVV/UfUV3dSNpsWIqHTQxLpYDKPKz1UwkRjadt+YbX2PRhyCEihEoS5XgB7J7AMXpkicvl+tRHvkNI5wbji/g==}
 
-  flag-icon-css@4.1.7:
-    resolution: {integrity: sha512-AFjSU+fv98XbU0vnTQ32vcLj89UEr1MhwDFcooQv14qWJCjg9fGZzfh9BVyDhAhIOZW/pGmJmq38RqpgPaeybQ==}
-    deprecated: The project has been renamed to flag-icons
-
   iso-639-1@3.1.5:
     resolution: {integrity: sha512-gXkz5+KN7HrG0Q5UGqSMO2qB9AsbEeyLP54kF1YrMsIxmu+g4BdB7rflReZTSTZGpfj8wywu6pfPBCylPIzGQA==}
     engines: {node: '>=6.0'}
@@ -36,6 +28,4 @@ snapshots:
 
   country-list@2.4.1: {}
 
-  flag-icon-css@4.1.7: {}
-
   iso-639-1@3.1.5: {}

package/dist/index.js

@@ -715,9 +715,11 @@ export default class I18nPlugin extends I18nBase {
                     bunchResult = yield this.generateAndSaveBunch(initialState.prompt, initialState.strings, initialState.translations, initialState.updateStrings, initialState.lang, initialState.failedToTranslate, initialState.needToTranslateByLang, jobId, initialState.promptCost);
                 }
                 afLogger.debug(`Translation task for language ${initialState.lang} completed.`);
+                // the task details view shows the flag of the language from this state
                 const stateToSave = {
                     taskName: initialState.taskName,
                     lang: initialState.lang,
+                    countryCode: initialState.countryCode,
                     failedToTranslate: initialState.failedToTranslate,
                 };
                 yield setTaskStateField(stateToSave);

package/index.ts

@@ -880,6 +880,7 @@ export default class I18nPlugin extends I18nBase<PluginOptions> {
           translations?: any[],
           updateStrings?: Record<string, { updates: any, category: string, strId: string, enStr: string, translatedStr: string }>,
           lang?: string,
+          countryCode?: string,
           failedToTranslate?: IFailedTranslation[],
           needToTranslateByLang?: Record<string, any>,
           promptCost?: number,
@@ -901,9 +902,11 @@ export default class I18nPlugin extends I18nBase<PluginOptions> {
         }
         afLogger.debug(`Translation task for language ${initialState.lang} completed.`);
 
+        // the task details view shows the flag of the language from this state
         const stateToSave = {
           taskName: initialState.taskName,
           lang: initialState.lang,
+          countryCode: initialState.countryCode,
           failedToTranslate: initialState.failedToTranslate,
         }
         await setTaskStateField(stateToSave);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adminforth/i18n",
-  "version": "3.0.0",
+  "version": "3.1.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "type": "module",
@@ -39,7 +39,7 @@
     "zod": "^4.3.6"
   },
   "peerDependencies": {
-    "adminforth": "^4.0.0"
+    "adminforth": "^4.5.0"
   },
   "devDependencies": {
     "@types/node": "^22.10.7",

package/custom/LanguageFlag.vue

@@ -1,16 +0,0 @@
-<template>
-  <!-- only the flag-icon-<code> image class: the base flag-icon class would fight the size -->
-  <span
-    class="af-language-flag inline-block w-4 h-3 shrink-0 rounded-[2px] bg-cover bg-center ring-1 ring-black/10 dark:ring-white/10"
-    :class="`flag-icon-${countryCode}`"
-    aria-hidden="true"
-  />
-</template>
-
-<script setup lang="ts">
-import 'flag-icon-css/css/flag-icons.min.css';
-
-defineProps<{
-  countryCode: string,
-}>();
-</script>

package/dist/custom/LanguageFlag.vue

@@ -1,16 +0,0 @@
-<template>
-  <!-- only the flag-icon-<code> image class: the base flag-icon class would fight the size -->
-  <span
-    class="af-language-flag inline-block w-4 h-3 shrink-0 rounded-[2px] bg-cover bg-center ring-1 ring-black/10 dark:ring-white/10"
-    :class="`flag-icon-${countryCode}`"
-    aria-hidden="true"
-  />
-</template>
-
-<script setup lang="ts">
-import 'flag-icon-css/css/flag-icons.min.css';
-
-defineProps<{
-  countryCode: string,
-}>();
-</script>