diff --git a/ui/src/progress_table_cell_type.test.tsx b/ui/src/progress_table_cell_type.test.tsx
index 956ac016cd..9f7fb96a6c 100644
--- a/ui/src/progress_table_cell_type.test.tsx
+++ b/ui/src/progress_table_cell_type.test.tsx
@@ -32,4 +32,17 @@ describe('ProgressTableCellType.tsx', () => {
     const { queryByTestId } = render(<XProgressTableCellType model={progressCellProps} progress={progress} />)
     expect(queryByTestId(name)).toBeInTheDocument()
   })
+
+  it('Renders decimal values with correct precision ', () => {
+    const {getByText} = render(<XProgressTableCellType model={progressCellProps} progress={progress} decimals={true}/>)
+    const expectedTextDecimalTrue = `${Math.round(progress * 10000) / 100}%`
+    expect(getByText(expectedTextDecimalTrue)).toBeInTheDocument()
+  })
+  
+  it('Renders decimal values with correct precision ', () => {
+    const {getByText} = render(<XProgressTableCellType model={progressCellProps} progress={progress} decimals={false}/>)
+    const expectedTextDecimalFalse = `${Math.round(progress * 100)}%`
+    expect(getByText(expectedTextDecimalFalse)).toBeInTheDocument()
+  })
+  
 })
\ No newline at end of file
diff --git a/ui/src/progress_table_cell_type.tsx b/ui/src/progress_table_cell_type.tsx
index 0052337642..0732e94fe5 100644
--- a/ui/src/progress_table_cell_type.tsx
+++ b/ui/src/progress_table_cell_type.tsx
@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import * as Fluent from '@fluentui/react'
-import { F, S } from './core'
+import { F, S, B } from './core'
 import React from 'react'
 import { stylesheet } from 'typestyle'
 import { ProgressArc } from './parts/progress_arc'
@@ -46,11 +46,17 @@ export interface ProgressTableCellType {
   name?: S
 }
 
-export const XProgressTableCellType = ({ model: m, progress }: { model: ProgressTableCellType, progress: F }) => (
+export const XProgressTableCellType = ({ model: m, progress, decimals }: { model: ProgressTableCellType, progress: F, decimals?: B }) => (
   <div data-test={m.name} className={css.container}>
     <ProgressArc thickness={2} color={cssVar(m.color || '$red')} value={progress} />
     <Fluent.Stack horizontalAlign='center' verticalAlign='center' className={clas(css.percentContainer, 'wave-s12')}>
-      <div className={css.percent}>{`${Math.round(progress * 100)}%`}</div>
+      <div className={css.percent}>
+        {decimals ? (
+          `${Math.round(progress *10000)/ 100}%`
+        ) : (
+          `${Math.round(progress * 100)}%`
+        )}
+      </div>
     </Fluent.Stack>
   </div >
 )
\ No newline at end of file