feat: hide select all control (#46)

azeezat · Sep 14, 2023 · 92bb6c4 · 92bb6c4
1 parent 1720389
commit 92bb6c4
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 25 deletions.
diff --git a/README.md b/README.md
@@ -274,7 +274,7 @@ For more examples visit our [wiki page](https://github.com/azeezat/react-native-
 | listComponentStyles        | `Object`                 | `{listEmptyComponentStyle: ViewStyle, itemSeparatorStyle: ViewStyle, sectionHeaderStyle: TextStyle}`                        |
 | checkboxComponentStyles    | `Object`                 | `{checkboxSize: number, checkboxStyle: ViewStyle, checkboxLabelStyle: TextStyle}`                                           |
 | checkboxComponent          | `React Component`        | `<View style={styles.radioButton} />`                                                                                       |
-| listControls               | `Object`                 | `{ selectAllText: 'Choose all', unselectAllText: 'Remove all', selectAllCallback: () => {}, unselectAllCallback: () => {}, emptyListMessage: 'No record found'}` |
+| listControls               | `Object`                 | `{ selectAllText: 'Choose all', unselectAllText: 'Remove all', selectAllCallback: () => {}, unselectAllCallback: () => {}, hideSelectAll: boolean, emptyListMessage: 'No record found'}` |
 | searchControls             | `Object`                 | `{ textInputStyle: ViewStyle \| TextStyle,  textInputContainerStyle: ViewStyle, textInputProps: TextInputProps}`            |
 
 ## Deprecation Notice

diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -155,8 +155,7 @@ export default function App() {
               checkboxLabelStyle: { color: 'green', fontSize: 20 },
             }}
             listControls={{
-              selectAllText: 'Select all that applies',
-              unselectAllText: 'Remove all',
+              hideSelectAll: true,
             }}
           />
 
@@ -278,7 +277,7 @@ export default function App() {
               },
             }}
             listControls={{
-              selectAllText: 'Choose everything',
+              selectAllText: 'Select all that applies',
               unselectAllText: 'Remove everything',
               selectAllCallback: () => Alert.alert('You selected everything'),
               unselectAllCallback: () => Alert.alert('You removed everything'),

diff --git a/src/index.tsx b/src/index.tsx
@@ -368,27 +368,29 @@ export const DropdownSelect: React.FC<DropdownProps> = ({
                 />
               )}
               {listHeaderComponent}
-              {isMultiple && modifiedOptions?.length > 1 && (
-                <View style={styles.optionsContainerStyle}>
-                  <TouchableOpacity onPress={() => {}}>
-                    <CheckBox
-                      value={selectAll}
-                      label={
-                        selectAll
-                          ? listControls?.unselectAllText || 'Clear all'
-                          : listControls?.selectAllText || 'Select all'
-                      }
-                      onChange={() => handleSelectAll()}
-                      primaryColor={primary}
-                      checkboxSize={checkboxSize}
-                      checkboxStyle={checkboxStyle}
-                      checkboxLabelStyle={checkboxLabelStyle}
-                      checkboxComponentStyles={checkboxComponentStyles}
-                      checkboxComponent={checkboxComponent}
-                    />
-                  </TouchableOpacity>
-                </View>
-              )}
+              {!listControls?.hideSelectAll &&
+                isMultiple &&
+                modifiedOptions?.length > 1 && (
+                  <View style={styles.optionsContainerStyle}>
+                    <TouchableOpacity onPress={() => {}}>
+                      <CheckBox
+                        value={selectAll}
+                        label={
+                          selectAll
+                            ? listControls?.unselectAllText || 'Clear all'
+                            : listControls?.selectAllText || 'Select all'
+                        }
+                        onChange={() => handleSelectAll()}
+                        primaryColor={primary}
+                        checkboxSize={checkboxSize}
+                        checkboxStyle={checkboxStyle}
+                        checkboxLabelStyle={checkboxLabelStyle}
+                        checkboxComponentStyles={checkboxComponentStyles}
+                        checkboxComponent={checkboxComponent}
+                      />
+                    </TouchableOpacity>
+                  </View>
+                )}
             </>
           }
           ListFooterComponent={listFooterComponent}

diff --git a/src/types/index.types.ts b/src/types/index.types.ts
@@ -64,6 +64,7 @@ export type DropdownProps = {
     unselectAllText?: string;
     selectAllCallback?: () => void;
     unselectAllCallback?: () => void;
+    hideSelectAll?: boolean;
     emptyListMessage?: string;
   };
   searchControls?: {