added new styling for headermessage

brandonhenry · Mar 27, 2024 · cfd7a8b · cfd7a8b
1 parent 2faf908
commit cfd7a8b
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 1 deletion.
diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx
@@ -69,6 +69,7 @@ function BaseSelectionList<TItem extends ListItem>(
         listHeaderWrapperStyle,
         isRowMultilineSupported = false,
         textInputRef,
+        headerMessageStyle = [styles.ph5, styles.pb5]
     }: BaseSelectionListProps<TItem>,
     ref: ForwardedRef<SelectionListHandle>,
 ) {
@@ -514,7 +515,7 @@ function BaseSelectionList<TItem extends ListItem>(
                             </View>
                         )}
                         {!!headerMessage && (
-                            <View style={[styles.ph5, styles.pb5]}>
+                            <View style={[headerMessageStyle]}>
                                 <Text style={[styles.textLabel, styles.colorMuted]}>{headerMessage}</Text>
                             </View>
                         )}

diff --git a/src/components/SelectionList/types.ts b/src/components/SelectionList/types.ts
@@ -229,6 +229,9 @@ type BaseSelectionListProps<TItem extends ListItem> = Partial<ChildrenProps> & {
     /** Message to display at the top of the list */
     headerMessage?: string;
 
+    /** Styles to apply to the header message */
+    headerMessageStyle?: StyleProp<ViewStyle>;
+
     /** Text to display on the confirm button */
     confirmButtonText?: string;
 

diff --git a/src/pages/SearchPage/index.tsx b/src/pages/SearchPage/index.tsx
@@ -168,6 +168,7 @@ function SearchPage({betas, reports, isSearchingForReports, navigation}: SearchP
                             textInputHint={offlineMessage}
                             onChangeText={setSearchValue}
                             headerMessage={headerMessage}
+                            headerMessageStyle={headerMessage === translate('common.noResultsFound') ? [themeStyles.ph4, themeStyles.pb5] : undefined}
                             onLayout={setPerformanceTimersEnd}
                             autoFocus
                             onSelectRow={selectReport}