Merge e97d97896a into 07eea0f484

components.d.ts

@@ -83,6 +83,7 @@ declare module '@vue/runtime-core' {
     GitMemo: typeof import('./src/tools/git-memo/git-memo.vue')['default']
     'GitMemo.content': typeof import('./src/tools/git-memo/git-memo.content.md')['default']
     HashText: typeof import('./src/tools/hash-text/hash-text.vue')['default']
+    HddCalculator: typeof import('./src/tools/hdd-calculator/hdd-calculator.vue')['default']
     HmacGenerator: typeof import('./src/tools/hmac-generator/hmac-generator.vue')['default']
     'Home.page': typeof import('./src/pages/Home.page.vue')['default']
     HtmlEntities: typeof import('./src/tools/html-entities/html-entities.vue')['default']
@@ -130,19 +131,18 @@ declare module '@vue/runtime-core' {
     MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
     MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
     NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
-    NCheckbox: typeof import('naive-ui')['NCheckbox']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
     NDivider: typeof import('naive-ui')['NDivider']
     NEllipsis: typeof import('naive-ui')['NEllipsis']
+    NFormItem: typeof import('naive-ui')['NFormItem']
     NH1: typeof import('naive-ui')['NH1']
     NH3: typeof import('naive-ui')['NH3']
     NIcon: typeof import('naive-ui')['NIcon']
+    NInputNumber: typeof import('naive-ui')['NInputNumber']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
     NMenu: typeof import('naive-ui')['NMenu']
-    NSpace: typeof import('naive-ui')['NSpace']
-    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']
@@ -161,6 +161,7 @@ declare module '@vue/runtime-core' {
     RouterView: typeof import('vue-router')['RouterView']
     RsaKeyPairGenerator: typeof import('./src/tools/rsa-key-pair-generator/rsa-key-pair-generator.vue')['default']
     SafelinkDecoder: typeof import('./src/tools/safelink-decoder/safelink-decoder.vue')['default']
+    SafelinkDecoder: typeof import('./src/tools/safelink-decoder/safelink-decoder.vue')['default']
     SlugifyString: typeof import('./src/tools/slugify-string/slugify-string.vue')['default']
     SpanCopyable: typeof import('./src/components/SpanCopyable.vue')['default']
     SqlPrettify: typeof import('./src/tools/sql-prettify/sql-prettify.vue')['default']

src/tools/hdd-calculator/hdd-calculator.service.test.ts

@@ -0,0 +1,12 @@
+import { describe, expect, it } from 'vitest';
+import { getRealSize } from './hdd-calculator.service';
+
+describe('hdd-calculator', () => {
+  it('Convert Claimed Size to Real Size', async () => {
+    expect(getRealSize(10, 'gb', 'tb')).to.equal(0.009094947017729282);
+    expect(getRealSize(10, 'pb', 'mb')).to.equal(9536743164.0625);
+    expect(getRealSize(100, 'tb', 'gb')).to.equal(93132.25746154785);
+    expect(getRealSize(1, 'pb', 'gb')).to.equal(931322.5746154785);
+    expect(getRealSize(1000, 'tb', 'gb')).to.equal(931322.5746154785);
+  });
+});

src/tools/hdd-calculator/hdd-calculator.service.ts

@@ -0,0 +1,14 @@
+const unitsConversion = {
+  kb: { dec: 1_000, bin: 1024 },
+  mb: { dec: 1_000_000, bin: 1024 * 1024 },
+  gb: { dec: 1_000_000_000, bin: 1024 * 1024 * 1024 },
+  tb: { dec: 1_000_000_000_000, bin: 1024 * 1024 * 1024 * 1024 },
+  pb: { dec: 1_000_000_000_000_000, bin: 1024 * 1024 * 1024 * 1024 * 1024 },
+};
+
+export type Units = 'kb' | 'mb' | 'gb' | 'tb' | 'pb';
+export function getRealSize(claimedCapacity: number, claimedUnit: Units, toUnit: Units) {
+  const fromUnit = unitsConversion[claimedUnit];
+  const toUnitBin = unitsConversion[toUnit].bin;
+  return claimedCapacity * fromUnit.dec / toUnitBin;
+};

src/tools/hdd-calculator/hdd-calculator.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import InputCopyable from '../../components/InputCopyable.vue';
+import type { Units } from './hdd-calculator.service';
+import { getRealSize } from './hdd-calculator.service';
+
+const dec_units = [
+  { value: 'kb', label: 'kB' },
+  { value: 'mb', label: 'MB' },
+  { value: 'gb', label: 'GB' },
+  { value: 'tb', label: 'TB' },
+  { value: 'pb', label: 'PB' },
+];
+const bin_units = [
+  { value: 'kb', label: 'KiB' },
+  { value: 'mb', label: 'MiB' },
+  { value: 'gb', label: 'GiB' },
+  { value: 'tb', label: 'TiB' },
+  { value: 'pb', label: 'PiB' },
+];
+
+const claimedCapacity = ref(1);
+const claimedUnit = ref('tb');
+</script>
+
+<template>
+  <div>
+    <n-form-item label="Claimed Capacity:">
+      <n-input-number v-model:value="claimedCapacity" :min="1" />
+    </n-form-item>
+    <c-select
+      v-model:value="claimedUnit"
+      label="Unit:"
+      :options="dec_units"
+    />
+
+    <n-divider />
+
+    <InputCopyable
+      v-for="({ value, label }) in bin_units"
+      :key="value"
+      :label="`Capacity in ${label}:`"
+      :value="getRealSize(claimedCapacity, claimedUnit as Units, value as Units).toFixed(5)"
+    />
+  </div>
+</template>

src/tools/hdd-calculator/index.ts

@@ -0,0 +1,14 @@
+import { DeviceDesktop } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'HDD calculator',
+  path: '/hdd-calculator',
+  description: 'Storage device manufacturers report capacities in decimal form (like GB), while operating systems and other software uses binary form (GiB), although still incorrectly using the decimal unit (GiB). This tool converts decimal form capacity into various binary forms.',
+  keywords: ['hdd', 'calculator', 'size', 'conversion', 'binary', 'decimal',
+    'gb', 'mb', 'tb',
+    'gigabyte', 'gibibyte', 'megabyte', 'mebibyte', 'terabyte', 'tebibyte'],
+  component: () => import('./hdd-calculator.vue'),
+  icon: DeviceDesktop,
+  createdAt: new Date('2024-04-07'),
+});

src/tools/index.ts

@@ -7,6 +7,7 @@ import { tool as asciiTextDrawer } from './ascii-text-drawer';
 
 import { tool as textToUnicode } from './text-to-unicode';
 import { tool as safelinkDecoder } from './safelink-decoder';
+import { tool as hddCalculator } from './hdd-calculator';
 import { tool as xmlToJson } from './xml-to-json';
 import { tool as jsonToXml } from './json-to-xml';
 import { tool as regexTester } from './regex-tester';
@@ -113,6 +114,7 @@ export const toolsByCategory: ToolCategory[] = [
       listConverter,
       tomlToJson,
       tomlToYaml,
+      hddCalculator,
       xmlToJson,
       jsonToXml,
       markdownToHtml,