From e0b4cda82d09860d971982f1340e1cdc625d6d04 Mon Sep 17 00:00:00 2001
From: automated-signal <37887102+automated-signal@users.noreply.github.com>
Date: Fri, 3 May 2024 17:09:33 -0500
Subject: [PATCH] Consolidate fileSize formatting logic

Co-authored-by: trevor-signal <131492920+trevor-signal@users.noreply.github.com>
---
 ts/components/DialogUpdate.tsx                             | 4 ++--
 ts/components/StoryDetailsModal.tsx                        | 2 +-
 .../conversation/media-gallery/DocumentListItem.tsx        | 6 ++----
 ts/components/installScreen/InstallScreenUpdateDialog.tsx  | 4 ++--
 ts/state/selectors/message.ts                              | 4 ++--
 ts/util/formatFileSize.ts                                  | 7 +++++++
 6 files changed, 16 insertions(+), 11 deletions(-)
 create mode 100644 ts/util/formatFileSize.ts

diff --git a/ts/components/DialogUpdate.tsx b/ts/components/DialogUpdate.tsx
index 7923669a3e..e3af3b1ecf 100644
--- a/ts/components/DialogUpdate.tsx
+++ b/ts/components/DialogUpdate.tsx
@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
-import formatFileSize from 'filesize';
 
 import { isBeta } from '../util/version';
 import { DialogType } from '../types/Dialogs';
@@ -11,6 +10,7 @@ import { PRODUCTION_DOWNLOAD_URL, BETA_DOWNLOAD_URL } from '../types/support';
 import { Intl } from './Intl';
 import { LeftPaneDialog } from './LeftPaneDialog';
 import type { WidthBreakpoint } from './_util';
+import { formatFileSize } from '../util/formatFileSize';
 
 export type PropsType = {
   containerWidthBreakpoint: WidthBreakpoint;
@@ -195,7 +195,7 @@ export function DialogUpdate({
     (dialogType === DialogType.DownloadReady ||
       dialogType === DialogType.FullDownloadReady)
   ) {
-    title += ` (${formatFileSize(downloadSize, { round: 0 })})`;
+    title += ` (${formatFileSize(downloadSize)})`;
   }
 
   let clickLabel = i18n('icu:autoUpdateNewVersionMessage');
diff --git a/ts/components/StoryDetailsModal.tsx b/ts/components/StoryDetailsModal.tsx
index 6e255fc9de..ba499f91e4 100644
--- a/ts/components/StoryDetailsModal.tsx
+++ b/ts/components/StoryDetailsModal.tsx
@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
-import formatFileSize from 'filesize';
 import type { LocalizerType } from '../types/Util';
 import type { PreferredBadgeSelectorType } from '../state/selectors/badges';
 import type { StorySendStateType, StoryViewType } from '../types/Stories';
@@ -21,6 +20,7 @@ import { ThemeType } from '../types/Util';
 import { Time } from './Time';
 import { groupBy } from '../util/mapUtil';
 import { format as formatRelativeTime } from '../util/expirationTimer';
+import { formatFileSize } from '../util/formatFileSize';
 
 export type PropsType = {
   getPreferredBadge: PreferredBadgeSelectorType;
diff --git a/ts/components/conversation/media-gallery/DocumentListItem.tsx b/ts/components/conversation/media-gallery/DocumentListItem.tsx
index 8975aebae9..1cce4bef9b 100644
--- a/ts/components/conversation/media-gallery/DocumentListItem.tsx
+++ b/ts/components/conversation/media-gallery/DocumentListItem.tsx
@@ -5,7 +5,7 @@ import React from 'react';
 import classNames from 'classnames';
 
 import moment from 'moment';
-import formatFileSize from 'filesize';
+import { formatFileSize } from '../../../util/formatFileSize';
 
 export type Props = {
   // Required
@@ -43,9 +43,7 @@ export function DocumentListItem({
             {fileName}
           </span>
           <span className="module-document-list-item__file-size">
-            {typeof fileSize === 'number'
-              ? formatFileSize(fileSize, { round: 0 })
-              : ''}
+            {typeof fileSize === 'number' ? formatFileSize(fileSize) : ''}
           </span>
         </div>
         <div className="module-document-list-item__date">
diff --git a/ts/components/installScreen/InstallScreenUpdateDialog.tsx b/ts/components/installScreen/InstallScreenUpdateDialog.tsx
index 7abe583316..b5e505105a 100644
--- a/ts/components/installScreen/InstallScreenUpdateDialog.tsx
+++ b/ts/components/installScreen/InstallScreenUpdateDialog.tsx
@@ -3,7 +3,6 @@
 
 import React from 'react';
 import { noop } from 'lodash';
-import formatFileSize from 'filesize';
 
 import { DialogType } from '../../types/Dialogs';
 import type { LocalizerType } from '../../types/Util';
@@ -17,6 +16,7 @@ import { isBeta } from '../../util/version';
 import { ConfirmationDialog } from '../ConfirmationDialog';
 import { Modal } from '../Modal';
 import { Intl } from '../Intl';
+import { formatFileSize } from '../../util/formatFileSize';
 
 export type PropsType = UpdatesStateType &
   Readonly<{
@@ -91,7 +91,7 @@ export function InstallScreenUpdateDialog({
           components={{
             downloadSize: (
               <span className="InstallScreenUpdateDialog__download-size">
-                ({formatFileSize(downloadSize ?? 0, { round: 0 })})
+                ({formatFileSize(downloadSize ?? 0)})
               </span>
             ),
           }}
diff --git a/ts/state/selectors/message.ts b/ts/state/selectors/message.ts
index a1dd58177f..352502514a 100644
--- a/ts/state/selectors/message.ts
+++ b/ts/state/selectors/message.ts
@@ -3,7 +3,6 @@
 
 import { groupBy, isEmpty, isNumber, isObject, map } from 'lodash';
 import { createSelector } from 'reselect';
-import filesize from 'filesize';
 import getDirection from 'direction';
 import emojiRegex from 'emoji-regex';
 import LinkifyIt from 'linkify-it';
@@ -141,6 +140,7 @@ import { CallDirection } from '../../types/CallDisposition';
 import { getCallIdFromEra } from '../../util/callDisposition';
 import { LONG_MESSAGE } from '../../types/MIME';
 import type { MessageRequestResponseNotificationData } from '../../components/conversation/MessageRequestResponseNotification';
+import { formatFileSize } from '../../util/formatFileSize';
 
 export { isIncoming, isOutgoing, isStory };
 
@@ -1806,7 +1806,7 @@ export function getPropsForAttachment(
 
   return {
     ...attachment,
-    fileSize: size ? filesize(size) : undefined,
+    fileSize: size ? formatFileSize(size) : undefined,
     isVoiceMessage: isVoiceMessage(attachment),
     pending,
     url: path ? getAttachmentUrlForPath(path) : undefined,
diff --git a/ts/util/formatFileSize.ts b/ts/util/formatFileSize.ts
new file mode 100644
index 0000000000..a83b42b69f
--- /dev/null
+++ b/ts/util/formatFileSize.ts
@@ -0,0 +1,7 @@
+// Copyright 2024 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+import filesize from 'filesize';
+
+export function formatFileSize(size: number): string {
+  return filesize(size, { round: 0 });
+}