Use pretty-bytes instead of custom function

Change-type: patch
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>

lib/gui/app/components/drive-status-warning-modal/drive-status-warning-modal.tsx

@@ -5,7 +5,7 @@ import { Badge, Flex, Txt, ModalProps } from 'rendition';
 import { Modal, ScrollableFlex } from '../../styled-components';
 import { middleEllipsis } from '../../utils/middle-ellipsis';
 
-import { bytesToClosestUnit } from '../../../../shared/units';
+import * as prettyBytes from 'pretty-bytes';
 import { DriveWithWarnings } from '../../pages/main/Flash';
 
 const DriveStatusWarningModal = ({
@@ -66,7 +66,7 @@ const DriveStatusWarningModal = ({
 						<>
 							<Flex justifyContent="space-between" alignItems="baseline">
 								<strong>{middleEllipsis(drive.description, 28)}</strong>{' '}
-								{bytesToClosestUnit(drive.size || 0)}{' '}
+								{prettyBytes(drive.size || 0)}{' '}
 								<Badge shade={5}>{drive.statuses[0].message}</Badge>
 							</Flex>
 							{i !== array.length - 1 ? <hr style={{ width: '100%' }} /> : null}

lib/gui/app/components/target-selector/target-selector-button.tsx

@@ -23,7 +23,7 @@ import {
 	DriveStatus,
 } from '../../../../shared/drive-constraints';
 import { compatibility, warning } from '../../../../shared/messages';
-import { bytesToClosestUnit } from '../../../../shared/units';
+import * as prettyBytes from 'pretty-bytes';
 import { getSelectedDrives } from '../../models/selection-state';
 import {
 	ChangeButton,
@@ -96,7 +96,7 @@ export function TargetSelectorButton(props: TargetSelectorProps) {
 						Change
 					</ChangeButton>
 				)}
-				<DetailsText>{bytesToClosestUnit(target.size)}</DetailsText>
+				<DetailsText>{prettyBytes(target.size)}</DetailsText>
 			</>
 		);
 	}
@@ -110,16 +110,16 @@ export function TargetSelectorButton(props: TargetSelectorProps) {
 			targetsTemplate.push(
 				<DetailsText
 					key={target.device}
-					tooltip={`${target.description} ${
+					tooltip={`${target.description} ${target.displayName} ${prettyBytes(
-						target.displayName
+						target.size,
-					} ${bytesToClosestUnit(target.size)}`}
+					)}`}
 					px={21}
 				>
 					{warnings.length && (
 						<DriveCompatibilityWarning warnings={warnings} mr={2} />
 					)}
 					<Txt mr={2}>{middleEllipsis(target.description, 14)}</Txt>
-					<Txt>{bytesToClosestUnit(target.size)}</Txt>
+					<Txt>{prettyBytes(target.size)}</Txt>
 				</DetailsText>,
 			);
 		}

lib/gui/app/modules/progress-status.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { bytesToClosestUnit } from '../../../shared/units';
+import * as prettyBytes from 'pretty-bytes';
 
 export interface FlashState {
 	active: number;
@@ -51,7 +51,7 @@ export function fromFlashState({
 		} else {
 			return {
 				status: 'Flashing...',
-				position: `${position ? bytesToClosestUnit(position) : ''}`,
+				position: `${position ? prettyBytes(position) : ''}`,
 			};
 		}
 	} else if (type === 'verifying') {

lib/gui/app/pages/main/MainPage.tsx

@@ -18,6 +18,7 @@ import CogSvg from '@fortawesome/fontawesome-free/svgs/solid/cog.svg';
 import QuestionCircleSvg from '@fortawesome/fontawesome-free/svgs/solid/question-circle.svg';
 
 import * as path from 'path';
+import * as prettyBytes from 'pretty-bytes';
 import * as React from 'react';
 import { Flex } from 'rendition';
 import styled from 'styled-components';
@@ -40,8 +41,6 @@ import {
 	ThemedProvider,
 } from '../../styled-components';
 
-import { bytesToClosestUnit } from '../../../../shared/units';
-
 import {
 	TargetSelector,
 	getDriveListLabel,

lib/shared/units.ts

@@ -14,15 +14,8 @@
  * limitations under the License.
  */
 
-import * as _ from 'lodash';
-import * as prettyBytes from 'pretty-bytes';
-
 const MEGABYTE_TO_BYTE_RATIO = 1000000;
 
 export function bytesToMegabytes(bytes: number): number {
 	return bytes / MEGABYTE_TO_BYTE_RATIO;
 }
-
-export function bytesToClosestUnit(bytes: number): string {
-	return prettyBytes(bytes);
-}

npm-shrinkwrap.json

@@ -16775,4 +16775,4 @@
       "dev": true
     }
   }
-}
+}

tests/shared/units.spec.ts

@@ -15,45 +15,13 @@
  */
 
 import { expect } from 'chai';
-import * as units from '../../lib/shared/units';
+import { bytesToMegabytes } from '../../lib/shared/units';
 
 describe('Shared: Units', function () {
-	describe('.bytesToClosestUnit()', function () {
-		it('should convert bytes to terabytes', function () {
-			expect(units.bytesToClosestUnit(1000000000000)).to.equal('1 TB');
-			expect(units.bytesToClosestUnit(2987801405440)).to.equal('2.99 TB');
-			expect(units.bytesToClosestUnit(999900000000000)).to.equal('1000 TB');
-		});
-
-		it('should convert bytes to gigabytes', function () {
-			expect(units.bytesToClosestUnit(1000000000)).to.equal('1 GB');
-			expect(units.bytesToClosestUnit(7801405440)).to.equal('7.8 GB');
-			expect(units.bytesToClosestUnit(999900000000)).to.equal('1000 GB');
-		});
-
-		it('should convert bytes to megabytes', function () {
-			expect(units.bytesToClosestUnit(1000000)).to.equal('1 MB');
-			expect(units.bytesToClosestUnit(801405440)).to.equal('801 MB');
-			expect(units.bytesToClosestUnit(999900000)).to.equal('1000 MB');
-		});
-
-		it('should convert bytes to kilobytes', function () {
-			expect(units.bytesToClosestUnit(1000)).to.equal('1 kB');
-			expect(units.bytesToClosestUnit(5440)).to.equal('5.44 kB');
-			expect(units.bytesToClosestUnit(999900)).to.equal('1000 kB');
-		});
-
-		it('should keep bytes as bytes', function () {
-			expect(units.bytesToClosestUnit(1)).to.equal('1 B');
-			expect(units.bytesToClosestUnit(8)).to.equal('8 B');
-			expect(units.bytesToClosestUnit(999)).to.equal('999 B');
-		});
-	});
-
 	describe('.bytesToMegabytes()', function () {
 		it('should convert bytes to megabytes', function () {
-			expect(units.bytesToMegabytes(1.2e7)).to.equal(12);
+			expect(bytesToMegabytes(1.2e7)).to.equal(12);
-			expect(units.bytesToMegabytes(332000)).to.equal(0.332);
+			expect(bytesToMegabytes(332000)).to.equal(0.332);
 		});
 	});
 });