feat(new tool): HDD Size Calculator

Fix #974

components.d.ts

@@ -82,6 +82,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']
@@ -127,24 +128,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']
-    NCode: typeof import('naive-ui')['NCode']
     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']
-    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']
     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']
-    NSpin: typeof import('naive-ui')['NSpin']
     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']
@@ -159,6 +154,7 @@ declare module '@vue/runtime-core' {
     RouterLink: typeof import('vue-router')['RouterLink']
     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']
     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 as Units];
+  const toUnitBin = unitsConversion[toUnit as Units].bin;
+  return claimedCapacity * fromUnit.dec / toUnitBin;
+};

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

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import InputCopyable from '../../components/InputCopyable.vue';
+import type { Units } from './hdd-calculator.service';
+import { getRealSize } from './hdd-calculator.service';
+
+const units = [
+  { value: 'kb', label: 'KB' },
+  { value: 'mb', label: 'MB' },
+  { value: 'gb', label: 'GB' },
+  { value: 'tb', label: 'TB' },
+  { value: 'pb', label: 'PB' },
+];
+
+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="units"
+    />
+
+    <n-divider />
+
+    <InputCopyable
+      v-for="({ value, label }) in 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: 'Compute real storage space (binary) from HDD Capacity (decimal)',
+  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

@@ -6,6 +6,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 pdfSignatureChecker } from './pdf-signature-checker';
 import { tool as numeronymGenerator } from './numeronym-generator';
 import { tool as macAddressGenerator } from './mac-address-generator';
@@ -107,6 +108,7 @@ export const toolsByCategory: ToolCategory[] = [
       listConverter,
       tomlToJson,
       tomlToYaml,
+      hddCalculator,
     ],
   },
   {