FIx group chat confirmation list is displayed with delay

src/components/SelectionList/BaseSelectionList.tsx

@@ -70,6 +70,7 @@ function BaseSelectionList<TItem extends ListItem>(
         isRowMultilineSupported = false,
         textInputRef,
         headerMessageStyle,
+        shouldHideListOnInitialRender = true,
     }: BaseSelectionListProps<TItem>,
     ref: ForwardedRef<SelectionListHandle>,
 ) {
@@ -572,7 +573,7 @@ function BaseSelectionList<TItem extends ListItem>(
                                     viewabilityConfig={{viewAreaCoveragePercentThreshold: 95}}
                                     testID="selection-list"
                                     onLayout={onSectionListLayout}
-                                    style={(!maxToRenderPerBatch || isInitialSectionListRender) && styles.opacity0}
+                                    style={(!maxToRenderPerBatch || (shouldHideListOnInitialRender && isInitialSectionListRender)) && styles.opacity0}
                                     ListFooterComponent={ShowMoreButtonInstance}
                                 />
                                 {children}

src/components/SelectionList/types.ts

@@ -297,6 +297,12 @@ type BaseSelectionListProps<TItem extends ListItem> = Partial<ChildrenProps> & {
 
     /** Ref for textInput */
     textInputRef?: MutableRefObject<TextInput | null>;
+
+    /**
+     * When true, the list won't be visible until the list layout is measured. This prevents the list from "blinking" as it's scrolled to the bottom which is recommended for large lists.
+     * When false, the list will render immediately and scroll to the bottom which works great for small lists.
+     */
+    shouldHideListOnInitialRender?: boolean;
 };
 
 type SelectionListHandle = {

src/pages/NewChatConfirmPage.tsx

@@ -135,6 +135,7 @@ function NewChatConfirmPage({newGroupDraft, allPersonalDetails}: NewChatConfirmP
                 showConfirmButton={selectedOptions.length > 1}
                 confirmButtonText={translate('newChatPage.startGroup')}
                 onConfirm={createGroup}
+                shouldHideListOnInitialRender={false}
             />
         </ScreenWrapper>
     );