From edfb3f575be10f2021350ed4d84e98c606785eb3 Mon Sep 17 00:00:00 2001
From: ShareVB <sharevb@gmail.com>
Date: Thu, 2 Jan 2025 00:18:38 +0100
Subject: [PATCH] fix: allow all units for bitrate

ie, in case of download speed in MB/s
---
 .eslintrc-auto-import.json                    |  5 +-
 auto-imports.d.ts                             |  9 +++
 ...ta-transfer-rate-converter.service.test.ts | 16 ++++--
 .../data-transfer-rate-converter.service.ts   | 10 ++--
 .../data-transfer-rate-converter.vue          | 56 ++++++++++---------
 5 files changed, 59 insertions(+), 37 deletions(-)

diff --git a/.eslintrc-auto-import.json b/.eslintrc-auto-import.json
index 4084d922..d4fd5aac 100644
--- a/.eslintrc-auto-import.json
+++ b/.eslintrc-auto-import.json
@@ -286,6 +286,9 @@
     "watchTriggerable": true,
     "watchWithFilter": true,
     "whenever": true,
-    "toValue": true
+    "toValue": true,
+    "injectLocal": true,
+    "provideLocal": true,
+    "useClipboardItems": true
   }
 }
diff --git a/auto-imports.d.ts b/auto-imports.d.ts
index 186963f1..35bda113 100644
--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@@ -36,6 +36,7 @@ declare global {
   const h: typeof import('vue')['h']
   const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
   const inject: typeof import('vue')['inject']
+  const injectLocal: typeof import('@vueuse/core')['injectLocal']
   const isDefined: typeof import('@vueuse/core')['isDefined']
   const isProxy: typeof import('vue')['isProxy']
   const isReactive: typeof import('vue')['isReactive']
@@ -65,6 +66,7 @@ declare global {
   const onUpdated: typeof import('vue')['onUpdated']
   const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
   const provide: typeof import('vue')['provide']
+  const provideLocal: typeof import('@vueuse/core')['provideLocal']
   const reactify: typeof import('@vueuse/core')['reactify']
   const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
   const reactive: typeof import('vue')['reactive']
@@ -128,6 +130,7 @@ declare global {
   const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
   const useCached: typeof import('@vueuse/core')['useCached']
   const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  const useClipboardItems: typeof import('@vueuse/core')['useClipboardItems']
   const useCloned: typeof import('@vueuse/core')['useCloned']
   const useColorMode: typeof import('@vueuse/core')['useColorMode']
   const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
@@ -326,6 +329,7 @@ declare module 'vue' {
     readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
     readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
     readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
     readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
     readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
@@ -355,6 +359,7 @@ declare module 'vue' {
     readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
     readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
     readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
     readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
     readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
     readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
@@ -418,6 +423,7 @@ declare module 'vue' {
     readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
     readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
     readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
+    readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
     readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
     readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
     readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
@@ -610,6 +616,7 @@ declare module '@vue/runtime-core' {
     readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
     readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
     readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
     readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
     readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
@@ -639,6 +646,7 @@ declare module '@vue/runtime-core' {
     readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
     readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
     readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
     readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
     readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
     readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
@@ -702,6 +710,7 @@ declare module '@vue/runtime-core' {
     readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
     readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
     readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
+    readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
     readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
     readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
     readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
diff --git a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.test.ts b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.test.ts
index 9e6b9e86..860ed096 100644
--- a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.test.ts
+++ b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.test.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
+import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
 
 describe('data-transfer-converter', () => {
   describe('transferTimeSeconds', () => {
@@ -12,9 +12,9 @@ describe('data-transfer-converter', () => {
       })).toBe(80);
     });
   });
-  describe('neededRate', () => {
-    it('compute neededRate', () => {
-      expect(neededRate({
+  describe('transferSpeedRate', () => {
+    it('compute transferSpeedRate', () => {
+      expect(transferSpeedRate({
         dataSize: 100,
         dataSizeUnit: 'MB',
         hours: 0,
@@ -22,6 +22,14 @@ describe('data-transfer-converter', () => {
         seconds: 20,
         bitRateUnit: 'Mb',
       })).toBe(10);
+      expect(transferSpeedRate({
+        dataSize: 100,
+        dataSizeUnit: 'MB',
+        hours: 0,
+        minutes: 1,
+        seconds: 20,
+        bitRateUnit: 'MB',
+      })).toBe(1.25);
     });
   });
   describe('amountTransferable', () => {
diff --git a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.ts b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.ts
index 3ef1b7bd..0ececcc1 100644
--- a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.ts
+++ b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.service.ts
@@ -1,4 +1,4 @@
-import { type AllSupportedUnits, type BitsUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
+import { type AllSupportedUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
 
 export function transferTimeSeconds({
   dataSize,
@@ -9,14 +9,14 @@ export function transferTimeSeconds({
   dataSize: number
   dataSizeUnit: AllSupportedUnits
   bitRate: number
-  bitRateUnit: BitsUnits
+  bitRateUnit: AllSupportedUnits
 }): number {
   const dataSizeInBytes = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'B' });
   const bitRateInBytes = convertStorageAndRateUnits({ value: bitRate, fromUnit: bitRateUnit, toUnit: 'B' });
   return bitRateInBytes > 0 ? dataSizeInBytes / bitRateInBytes : 0;
 }
 
-export function neededRate({
+export function transferSpeedRate({
   dataSize,
   dataSizeUnit,
   hours,
@@ -29,7 +29,7 @@ export function neededRate({
   hours: number
   minutes: number
   seconds: number
-  bitRateUnit: BitsUnits
+  bitRateUnit: AllSupportedUnits
 }): number {
   const dataSizeInBits = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'b' });
   const timeInSeconds = hours * 3600 + minutes * 60 + seconds;
@@ -45,7 +45,7 @@ export function amountTransferable({
   dataSizeUnit,
 }: {
   bitRate: number
-  bitRateUnit: BitsUnits
+  bitRateUnit: AllSupportedUnits
   hours: number
   minutes: number
   seconds: number
diff --git a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.vue b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.vue
index 2be19cbb..a8128dcb 100644
--- a/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.vue
+++ b/src/tools/data-transfer-rate-converter/data-transfer-rate-converter.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { formatDuration, intervalToDuration } from 'date-fns';
-import { type AllSupportedUnits, type BitsUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
-import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
+import { type AllSupportedUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
+import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
 
 const allStorateUnits = [
   { value: 'B', label: 'Bytes (B)' },
@@ -35,6 +35,8 @@ const allBitsUnits = [
   { value: 'Yb', label: 'Yottabits (Ybit)' },
 ];
 
+const allRateUnits = [...allBitsUnits, ...allStorateUnits];
+
 function convertToTimeDisplay(seconds: number) {
   if (seconds === 0) {
     return '0';
@@ -59,7 +61,7 @@ const transferTimeOutput = computed(() => {
       dataSize: Number(transferTimeInput.value.dataSize),
       dataSizeUnit: transferTimeInput.value.dataSizeUnit as AllSupportedUnits,
       bitRate: Number(transferTimeInput.value.bitRate),
-      bitRateUnit: transferTimeInput.value.bitRateUnit as BitsUnits,
+      bitRateUnit: transferTimeInput.value.bitRateUnit as AllSupportedUnits,
     }));
   }
   catch (e: any) {
@@ -67,7 +69,7 @@ const transferTimeOutput = computed(() => {
   }
 });
 
-const neededRateInput = ref<{
+const transferSpeedRateInput = ref<{
   dataSize: string
   dataSizeUnit: string
   hours: number
@@ -82,18 +84,18 @@ const neededRateInput = ref<{
   seconds: 0,
   bitRateUnit: 'Mb',
 });
-const neededRateOutput = computed(() => {
+const transferSpeedRateOutput = computed(() => {
   try {
     return displayStorageAndRateUnits({
-      unit: neededRateInput.value.bitRateUnit as BitsUnits,
+      unit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
       appendUnit: true,
-      value: neededRate({
-        dataSize: Number(neededRateInput.value.dataSize),
-        dataSizeUnit: neededRateInput.value.dataSizeUnit as AllSupportedUnits,
-        hours: neededRateInput.value.hours,
-        minutes: neededRateInput.value.minutes,
-        seconds: neededRateInput.value.seconds,
-        bitRateUnit: neededRateInput.value.bitRateUnit as BitsUnits,
+      value: transferSpeedRate({
+        dataSize: Number(transferSpeedRateInput.value.dataSize),
+        dataSizeUnit: transferSpeedRateInput.value.dataSizeUnit as AllSupportedUnits,
+        hours: transferSpeedRateInput.value.hours,
+        minutes: transferSpeedRateInput.value.minutes,
+        seconds: transferSpeedRateInput.value.seconds,
+        bitRateUnit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
       }),
     });
   }
@@ -124,7 +126,7 @@ const amountTransferableOutput = computed(() => {
       appendUnit: true,
       value: amountTransferable({
         bitRate: Number(amountTransferableInput.value.bitRate),
-        bitRateUnit: amountTransferableInput.value.bitRateUnit as BitsUnits,
+        bitRateUnit: amountTransferableInput.value.bitRateUnit as AllSupportedUnits,
         hours: amountTransferableInput.value.hours,
         minutes: amountTransferableInput.value.minutes,
         seconds: amountTransferableInput.value.seconds,
@@ -157,7 +159,7 @@ const amountTransferableOutput = computed(() => {
         <c-select
           v-model:value="transferTimeInput.bitRateUnit"
           searchable
-          :options="allBitsUnits"
+          :options="allRateUnits"
           placeholder="Select a bit rate unit"
           ml-1
         />
@@ -171,11 +173,11 @@ const amountTransferableOutput = computed(() => {
         placeholder="Transfer time will be here..."
       />
     </c-card>
-    <c-card title="Needed Bit Rate" mb-2>
+    <c-card title="Transfer Bit Rate/Speed" mb-2>
       <n-form-item label="Data Size:" label-placement="left">
-        <n-input v-model:value="neededRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
+        <n-input v-model:value="transferSpeedRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
         <c-select
-          v-model:value="neededRateInput.dataSizeUnit"
+          v-model:value="transferSpeedRateInput.dataSizeUnit"
           :options="allStorateUnits"
           placeholder="Select a storage unit"
           ml-1
@@ -183,23 +185,23 @@ const amountTransferableOutput = computed(() => {
       </n-form-item>
 
       <n-form-item label="Duration (h/m/s):" label-placement="left">
-        <n-input-number v-model:value="neededRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
-        <n-input-number v-model:value="neededRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
-        <n-input-number v-model:value="neededRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
+        <n-input-number v-model:value="transferSpeedRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
+        <n-input-number v-model:value="transferSpeedRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
+        <n-input-number v-model:value="transferSpeedRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
       </n-form-item>
 
       <n-divider />
 
       <div flex items-baseline gap-2>
         <InputCopyable
-          label="Needed Bit Rate:"
+          label="Transfer Bit Rate/Speed:"
           label-position="left"
-          :value="neededRateOutput"
-          placeholder="Needed Bit Rate will be here..."
+          :value="transferSpeedRateOutput"
+          placeholder="Bit Rate will be here..."
         />
         <c-select
-          v-model:value="transferTimeInput.bitRateUnit"
-          :options="allBitsUnits"
+          v-model:value="transferSpeedRateInput.bitRateUnit"
+          :options="allRateUnits"
           placeholder="Select a bit rate unit"
           ml-1
         />
@@ -210,7 +212,7 @@ const amountTransferableOutput = computed(() => {
         <n-input v-model:value="amountTransferableInput.bitRate" placeholder="Bit Rate..." :min="0" w-full />
         <c-select
           v-model:value="amountTransferableInput.bitRateUnit"
-          :options="allBitsUnits"
+          :options="allRateUnits"
           placeholder="Select a bit rate unit"
           ml-1
         />