feat(new tool): unicode to java entities

Author: TuanNA1

components.d.ts

@@ -88,24 +88,16 @@ declare module 'vue' {
     IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default']
     'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default']
     'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default']
-    IconMdiArrowRightBottom: typeof import('~icons/mdi/arrow-right-bottom')['default']
-    IconMdiCamera: typeof import('~icons/mdi/camera')['default']
     IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
     IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default']
     IconMdiClose: typeof import('~icons/mdi/close')['default']
     IconMdiContentCopy: typeof import('~icons/mdi/content-copy')['default']
-    IconMdiDeleteOutline: typeof import('~icons/mdi/delete-outline')['default']
-    IconMdiDownload: typeof import('~icons/mdi/download')['default']
     IconMdiEye: typeof import('~icons/mdi/eye')['default']
     IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default']
     IconMdiHeart: typeof import('~icons/mdi/heart')['default']
-    IconMdiPause: typeof import('~icons/mdi/pause')['default']
-    IconMdiPlay: typeof import('~icons/mdi/play')['default']
-    IconMdiRecord: typeof import('~icons/mdi/record')['default']
     IconMdiSearch: typeof import('~icons/mdi/search')['default']
     IconMdiTranslate: typeof import('~icons/mdi/translate')['default']
     IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default']
-    IconMdiVideo: typeof import('~icons/mdi/video')['default']
     InputCopyable: typeof import('./src/components/InputCopyable.vue')['default']
     IntegerBaseConverter: typeof import('./src/tools/integer-base-converter/integer-base-converter.vue')['default']
     Ipv4AddressConverter: typeof import('./src/tools/ipv4-address-converter/ipv4-address-converter.vue')['default']
@@ -132,33 +124,25 @@ declare module 'vue' {
     MenuLayout: typeof import('./src/components/MenuLayout.vue')['default']
     MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
     MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
-    NAlert: typeof import('naive-ui')['NAlert']
     NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
-    NCheckbox: typeof import('naive-ui')['NCheckbox']
     NCode: typeof import('naive-ui')['NCode']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
-    NColorPicker: typeof import('naive-ui')['NColorPicker']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
     NDivider: typeof import('naive-ui')['NDivider']
     NEllipsis: typeof import('naive-ui')['NEllipsis']
-    NForm: typeof import('naive-ui')['NForm']
     NFormItem: typeof import('naive-ui')['NFormItem']
     NGi: typeof import('naive-ui')['NGi']
     NGrid: typeof import('naive-ui')['NGrid']
     NH1: typeof import('naive-ui')['NH1']
     NH3: typeof import('naive-ui')['NH3']
     NIcon: typeof import('naive-ui')['NIcon']
-    NInputGroup: typeof import('naive-ui')['NInputGroup']
-    NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel']
     NInputNumber: typeof import('naive-ui')['NInputNumber']
+    NLabel: typeof import('naive-ui')['NLabel']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
     NMenu: typeof import('naive-ui')['NMenu']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
-    NSlider: typeof import('naive-ui')['NSlider']
     NSpin: typeof import('naive-ui')['NSpin']
-    NSwitch: typeof import('naive-ui')['NSwitch']
-    NTable: typeof import('naive-ui')['NTable']
     NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
     OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
     PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default']

locales/en.yml

@@ -392,6 +392,6 @@ tools:
     title: Text to ASCII binary
     description: Convert text to its ASCII binary representation and vice-versa.
 
-  unicode-to-java-entites:
+  unicode-to-java-entities:
     title: Unicode Characters to Java Entities Converter
     description: Unicode Characters to Java Entities Converter and vice-versa

locales/vi.yml

@@ -381,6 +381,6 @@ tools:
     title: Chuyển đổi văn bản thành nhị phân ASCII
     description: Chuyển đổi văn bản thành biểu diễn nhị phân ASCII của nó và ngược lại.
 
-  unicode-to-java-entites:
+  unicode-to-java-entities:
     title: Chuyển đổi ký tự Unicode sang thực thể Java
     description: Chuyển đổi ký tự Unicode sang thực thể Java và ngược lại

src/tools/unicode-characters-to-java-entities-converter/index.ts

@@ -3,11 +3,11 @@ import { defineTool } from '../tool';
 import { translate } from '@/plugins/i18n.plugin';
 
 export const tool = defineTool({
-  name: translate('tools.unicode-to-java-entites.title'),
-  path: '/unicode-to-java-entites',
-  description: translate('tools.unicode-to-java-entites.description'),
-  keywords: ['text', 'to', 'unicode'],
+  name: translate('tools.unicode-to-java-entities.title'),
+  path: '/unicode-to-java-entities',
+  description: translate('tools.unicode-to-java-entities.description'),
+  keywords: ['java-entities', 'to', 'unicode', 'text'],
   component: () => import('./unicode-characters-to-java-entities.vue'),
   icon: TextWrapDisabled,
-  createdAt: new Date('2024-01-31'),
+  createdAt: new Date('2024-05-16'),
 });

src/tools/unicode-characters-to-java-entities-converter/unicode-characters-to-java-entities.service.ts

@@ -5,59 +5,59 @@ function strlenFix(str: string): string {
   return str;
 }
 
-function parseUnicodeToJavaEntities(source: string, direction: '0' | '-1'): string {
+function parseUnicodeToJavaEntities(source: string): string {
   let result = '';
 
-  if (direction === '0') {
-    // UTF-8 to entities
-    for (let i = 0; i < source.length; i++) {
-      const charCode = source.charCodeAt(i);
-      if (charCode <= 127) {
-        result += source.charAt(i);
-      }
-      else {
-        result += `\\u${strlenFix(charCode.toString(16).toUpperCase())}`;
-      }
+  for (let i = 0; i < source.length; i++) {
+    const charCode = source.charCodeAt(i);
+    if (charCode <= 127) {
+      result += source.charAt(i);
+    }
+    else {
+      result += `\\u${strlenFix(charCode.toString(16).toUpperCase())}`;
     }
   }
-  else {
-    // Entities to UTF-8
-    let state: 0 | 1 | 2 = 0;
-    let chars = 0;
-    let value = '';
-    for (let i = 0; i < source.length; i++) {
-      switch (state) {
-        case 0:
-          if (source.charAt(i) === '\\') {
-            state = 1;
-          }
-          else {
-            result += source.charAt(i);
-          }
-          break;
-        case 1:
-          if (source.charAt(i) === 'u') {
-            state = 2;
-            chars = 0;
-            value = '';
-          }
-          else {
-            result += `\\${source.charAt(i)}`;
-            state = 0;
-          }
-          break;
-        case 2:
-          chars++;
-          value += source.charAt(i);
-          if (chars >= 4) {
-            result += String.fromCharCode(Number.parseInt(value, 16));
-            state = 0;
-          }
-          break;
-      }
+  return result;
+}
+
+function parseJavaEntitiesToUnicode(source: string): string {
+  let result = '';
+  let state: 0 | 1 | 2 = 0;
+  let chars = 0;
+  let value = '';
+  for (let i = 0; i < source.length; i++) {
+    switch (state) {
+      case 0:
+        if (source.charAt(i) === '\\') {
+          state = 1;
+        }
+        else {
+          result += source.charAt(i);
+        }
+        break;
+      case 1:
+        if (source.charAt(i) === 'u') {
+          state = 2;
+          chars = 0;
+          value = '';
+        }
+        else {
+          result += `\\${source.charAt(i)}`;
+          state = 0;
+        }
+        break;
+      case 2:
+        chars++;
+        value += source.charAt(i);
+        if (chars >= 4) {
+          result += String.fromCharCode(Number.parseInt(value, 16));
+          state = 0;
+        }
+        break;
     }
   }
+
   return result;
 }
 
-export { parseUnicodeToJavaEntities };
+export { parseUnicodeToJavaEntities, parseJavaEntitiesToUnicode };

src/tools/unicode-characters-to-java-entities-converter/unicode-characters-to-java-entities.spec.ts

@@ -1,20 +1,20 @@
 import { describe, expect, it } from 'vitest';
-import { parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
+import { parseJavaEntitiesToUnicode, parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
 
 describe('unicode-to-entities', () => {
   describe('convertTextToUnicode', () => {
     it('a unicode string is converted to java entities representation', () => {
-      expect(parseUnicodeToJavaEntities('là', '0')).toBe('l\u00E0');
-      expect(parseUnicodeToJavaEntities('sơn tùng MTP', '0')).toBe('s\u01A1n t\u00F9ng MTP');
-      expect(parseUnicodeToJavaEntities('', '0')).toBe('');
+      expect(parseUnicodeToJavaEntities('là')).toBe('l\\u00E0');
+      expect(parseUnicodeToJavaEntities('sơn tùng MTP')).toBe('s\\u01A1n t\\u00F9ng MTP');
+      expect(parseUnicodeToJavaEntities('')).toBe('');
     });
   });
 
   describe('entities-to-unicode', () => {
     it('java entities string is converted to its unicode representation', () => {
-      expect(parseUnicodeToJavaEntities('l\u00E0', '-1')).toBe('là');
-      expect(parseUnicodeToJavaEntities('s\u01A1n t\u00F9ng MTP', '-1')).toBe('sơn tùng MTP');
-      expect(parseUnicodeToJavaEntities('', '-1')).toBe('');
+      expect(parseJavaEntitiesToUnicode('l\u00E0')).toBe('là');
+      expect(parseJavaEntitiesToUnicode('s\u01A1n t\u00F9ng MTP')).toBe('sơn tùng MTP');
+      expect(parseJavaEntitiesToUnicode('')).toBe('');
     });
   });
 });

src/tools/unicode-characters-to-java-entities-converter/unicode-characters-to-java-entities.test.ts

@@ -1,33 +1,33 @@
 <script setup lang="ts">
-import { parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
+import { parseJavaEntitiesToUnicode, parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
 import { useCopy } from '@/composable/copy';
 
 const inputUnicode = ref('');
-const entitiesFromUnicode = computed(() => inputUnicode.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputUnicode.value, '0'));
-const { copy: copyUnicode } = useCopy({ source: entitiesFromUnicode });
+const entitiesFromUnicode = computed(() => inputUnicode.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputUnicode.value));
+const { copy: copyJavaEntities } = useCopy({ source: entitiesFromUnicode });
 
 const inputJavaEntities = ref('');
-const unicodeFromEntities = computed(() => inputJavaEntities.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputJavaEntities.value, '-1'));
-const { copy: copyText } = useCopy({ source: unicodeFromEntities });
+const unicodeFromEntities = computed(() => inputJavaEntities.value.trim() === '' ? '' : parseJavaEntitiesToUnicode(inputJavaEntities.value));
+const { copy: copyUnicode } = useCopy({ source: unicodeFromEntities });
 </script>
 
 <template>
   <c-card title="Unicode Characters to Java entities">
-    <c-input-text v-model:value="inputUnicode" multiline placeholder="e.g. 'Hello Avengers'" label="Enter Unicode Characters to convert to Java entities" autosize autofocus raw-text test-id="unicode-to-entities-input" />
-    <c-input-text v-model:value="entitiesFromUnicode" label="Java entities from your text" multiline raw-text readonly mt-2 placeholder="The unicode representation of your text will be here" test-id="unicode-to-entities-output" />
+    <c-input-text v-model:value="inputUnicode" placeholder="e.g. 'Hello Avengers'" label="Enter Unicode Characters to convert to Java entities" autosize raw-text multiline autofocus test-id="unicode-to-entities-input" />
+    <c-input-text v-model:value="entitiesFromUnicode" label="Java entities from your text" placeholder="The unicode representation of your text will be here" raw-text multiline readonly mt-2 test-id="unicode-to-entities-output" />
     <div mt-2 flex justify-center>
-      <c-button :disabled="!entitiesFromUnicode" @click="copyUnicode()">
-        Copy unicode to clipboard
+      <c-button :disabled="!entitiesFromUnicode" @click="copyJavaEntities()">
+        Copy Java entities to clipboard
       </c-button>
     </div>
   </c-card>
 
   <c-card title="Java entities to Unicode Characters">
-    <c-input-text v-model:value="inputJavaEntities" multiline placeholder="Input Java entities" label="Enter Java entities to convert to Unicode Characters" autosize raw-text test-id="entities-to-unicode-input" />
-    <c-input-text v-model:value="unicodeFromEntities" label="Text from your Java entities" multiline raw-text readonly mt-2 placeholder="The text representation of your unicode will be here" test-id="entities-to-unicode-output" />
+    <c-input-text v-model:value="inputJavaEntities" placeholder="Input Java entities" label="Enter Java entities to convert to Unicode Characters" autosize raw-text multiline test-id="entities-to-unicode-input" />
+    <c-input-text v-model:value="unicodeFromEntities" label="Text from your Java entities" placeholder="The text representation of your unicode will be here" multiline raw-text readonly mt-2 test-id="entities-to-unicode-output" />
     <div mt-2 flex justify-center>
-      <c-button :disabled="!unicodeFromEntities" @click="copyText()">
-        Copy text to clipboard
+      <c-button :disabled="!unicodeFromEntities" @click="copyUnicode()">
+        Copy Unicode to clipboard
       </c-button>
     </div>
   </c-card>