From 6f1e77264bba00a1accd06a47db0254cac1297ce Mon Sep 17 00:00:00 2001
From: dragnoir <mosaixel.org@gmail.com>
Date: Sat, 4 May 2024 17:23:29 +0100
Subject: [PATCH] fix Top and bottom borders of header status

---
 src/components/MoneyReportHeaderStatusBar.tsx  |  2 +-
 src/components/MoneyRequestHeaderStatusBar.tsx | 14 +++++++++++++-
 src/styles/index.ts                            |  4 ++++
 3 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/components/MoneyReportHeaderStatusBar.tsx b/src/components/MoneyReportHeaderStatusBar.tsx
index 82a82e014697..a6267f3fe374 100644
--- a/src/components/MoneyReportHeaderStatusBar.tsx
+++ b/src/components/MoneyReportHeaderStatusBar.tsx
@@ -23,7 +23,7 @@ function MoneyReportHeaderStatusBar({nextStep}: MoneyReportHeaderStatusBarProps)
     }, [nextStep.message]);
 
     return (
-        <View style={[styles.dFlex, styles.flexRow, styles.alignItemsCenter, styles.overflowHidden, styles.w100]}>
+        <View style={[styles.dFlex, styles.flexRow, styles.alignItemsCenter, styles.overflowHidden, styles.w100, styles.headerStatusBarContainer]}>
             <View style={[styles.mr3]}>
                 <Badge
                     text={translate(nextStep.title === CONST.NEXT_STEP.FINISHED ? 'iou.finished' : 'iou.nextStep')}
diff --git a/src/components/MoneyRequestHeaderStatusBar.tsx b/src/components/MoneyRequestHeaderStatusBar.tsx
index 7f26b239dcc8..70d1d7f83f94 100644
--- a/src/components/MoneyRequestHeaderStatusBar.tsx
+++ b/src/components/MoneyRequestHeaderStatusBar.tsx
@@ -22,7 +22,19 @@ function MoneyRequestHeaderStatusBar({title, description, shouldShowBorderBottom
     const styles = useThemeStyles();
     const borderBottomStyle = shouldShowBorderBottom ? styles.borderBottom : {};
     return (
-        <View style={[styles.dFlex, styles.flexRow, styles.alignItemsCenter, styles.flexGrow1, styles.overflowHidden, styles.ph5, styles.pb3, borderBottomStyle]}>
+        <View
+            style={[
+                styles.dFlex,
+                styles.flexRow,
+                styles.alignItemsCenter,
+                styles.flexGrow1,
+                styles.overflowHidden,
+                styles.ph5,
+                styles.pb3,
+                borderBottomStyle,
+                styles.headerStatusBarContainer,
+            ]}
+        >
             <View style={[styles.mr3]}>
                 <Badge
                     text={title}
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 1b1587d81bce..b6a1b5c12880 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4530,6 +4530,10 @@ const styles = (theme: ThemeColors) =>
             paddingVertical: 4,
         },
 
+        headerStatusBarContainer: {
+            minHeight: variables.componentSizeNormal,
+        },
+
         walletCardLimit: {
             color: theme.text,
             fontSize: variables.fontSizeNormal,