fix: add parentheses to fix displayed Storage Browser upload status (#…

…6347)

* fix: add parentheses to fix displayed upload status

* chore: add changeset

* chore: add test for progress indicator

* chore: update statuses within progress test to accurately reflect progress state

* chore: other minor changes to make test data more appropriate

.changeset/violet-cheetahs-yawn.md

@@ -0,0 +1,5 @@
+---
+'@aws-amplify/ui-react-storage': patch
+---
+
+Fixed bug causing incorrect progress to be displayed during uploads

packages/react-storage/src/components/StorageBrowser/views/LocationActionView/__tests__/getActionViewTableData.spec.ts

@@ -167,4 +167,68 @@ describe('getActionViewTableData', () => {
     );
     expect(result.rows).toMatchSnapshot();
   });
+
+  it('should return the right display value for progress', () => {
+    const tasks: Tasks<FileDataItem> = [
+      {
+        data: {
+          id: '1',
+          fileKey: 'file1.txt',
+          key: 'folder/subfolder/file1.txt',
+          lastModified: new Date(),
+          size: 1000,
+          type: 'FILE',
+        },
+        status: 'QUEUED',
+        cancel: jest.fn(),
+        progress: 0,
+        message: '',
+      },
+      {
+        data: {
+          id: '2',
+          fileKey: 'file2.txt',
+          key: 'folder/subfolder/file2.txt',
+          lastModified: new Date(),
+          size: 1000,
+          type: 'FILE',
+        },
+        status: 'PENDING',
+        cancel: jest.fn(),
+        progress: 0.5,
+        message: '',
+      },
+      {
+        data: {
+          id: '3',
+          fileKey: 'file3.txt',
+          key: 'folder/subfolder/file3.txt',
+          lastModified: new Date(),
+          size: 1000,
+          type: 'FILE',
+        },
+        status: 'COMPLETE',
+        cancel: jest.fn(),
+        progress: 1,
+        message: '',
+      },
+    ];
+
+    const result = getActionViewTableData({
+      tasks,
+      locationKey: 'folder/subfolder/',
+      displayText: DEFAULT_UPLOAD_VIEW_DISPLAY_TEXT,
+      isProcessing: false,
+      onTaskRemove: jest.fn(),
+      shouldDisplayProgress: true,
+    });
+
+    const zero = result.rows[0].content[5].content;
+    const half = result.rows[1].content[5].content;
+    const full = result.rows[2].content[5].content;
+
+    expect((zero as { displayValue: string }).displayValue).toBe('0%');
+    expect((half as { displayValue: string }).displayValue).toBe('50%');
+    expect((full as { displayValue: string }).displayValue).toBe('100%');
+  });
 });

packages/react-storage/src/components/StorageBrowser/views/LocationActionView/getActionViewTableData.ts

@@ -171,7 +171,7 @@ export const getActionViewTableData = <T extends TaskData = TaskData>({
                 value: progress,
                 displayValue: `${getPercentValue(
                   // Default progress to 100% if progress value is unavailable but status is recognized as complete
-                  progress ?? status === 'COMPLETE' ? 1 : 0
+                  progress ?? (status === 'COMPLETE' ? 1 : 0)
                 )}%`,
               },
             };