remove magic numbers

Author: JS00001

src/components/Table/TableRow.tsx

@@ -10,6 +10,7 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {SkeletonSpanReasonAttributes} from '@libs/telemetry/useSkeletonSpan';
 import useSkeletonSpan from '@libs/telemetry/useSkeletonSpan';
+import variables from '@styles/variables';
 import CONST from '@src/CONST';
 import {useTableContext} from './TableContext';
 
@@ -115,10 +116,10 @@ export default function TableRow({
                     !!isLoading && LoadingComponent ? (
                         <View style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]}>
                             <SkeletonViewContentLoader
-                                height={32}
                                 width="100%"
                                 backgroundColor={theme.skeletonLHNIn}
                                 foregroundColor={theme.skeletonLHNOut}
+                                height={variables.tableSkeletonHeight}
                             >
                                 <LoadingComponent />
                             </SkeletonViewContentLoader>

src/components/Table/TableSkeleton.tsx

@@ -6,6 +6,7 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {SkeletonSpanReasonAttributes} from '@libs/telemetry/useSkeletonSpan';
 import useSkeletonSpan from '@libs/telemetry/useSkeletonSpan';
+import variables from '@styles/variables';
 
 type TableSkeletonProps = {
     /** The number of skeleton rows to render */
@@ -44,10 +45,10 @@ export default function TableSkeleton({renderSkeletonItem, reasonAttributes, row
             style={[tableSkeletonRowStyles, index !== rowCount - 1 && styles.borderBottom]}
         >
             <SkeletonViewContentLoader
-                height={32}
                 width="100%"
                 backgroundColor={theme.skeletonLHNIn}
                 foregroundColor={theme.skeletonLHNOut}
+                height={variables.tableSkeletonHeight}
             >
                 {renderSkeletonItem()}
             </SkeletonViewContentLoader>

src/styles/variables.ts

@@ -130,6 +130,7 @@ export default {
     tableRowPaddingHorizontal: 12,
     tableGroupRowPaddingVertical: 4,
     tableGroupRowHeight: 36,
+    tableSkeletonHeight: 32,
     sectionMenuItemHeight: 52,
     sectionMenuItemHeightCompact: 44,
     optionsListSectionHeaderHeight: getValueUsingPixelRatio(32, 38),