Merge pull request #2757 from GetStream/attachment-picker-icons-visibility

fix: attachment picker image picker icon visibility as per dependency

Author: isekovanic

package/src/components/AttachmentPicker/components/AttachmentPickerSelectionBar.tsx

@@ -27,8 +27,14 @@ export const AttachmentPickerSelectionBar = () => {
     setSelectedPicker,
   } = useAttachmentPickerContext();
 
-  const { hasCameraPicker, hasFilePicker, imageUploads, pickFile, takeAndUploadImage } =
-    useMessageInputContext();
+  const {
+    hasCameraPicker,
+    hasFilePicker,
+    hasImagePicker,
+    imageUploads,
+    pickFile,
+    takeAndUploadImage,
+  } = useMessageInputContext();
 
   const {
     theme: {
@@ -53,18 +59,20 @@ export const AttachmentPickerSelectionBar = () => {
 
   return (
     <View style={[styles.container, container, { height: attachmentSelectionBarHeight }]}>
-      <TouchableOpacity
-        hitSlop={{ bottom: 15, top: 15 }}
-        onPress={setImagePicker}
-        testID='upload-photo-touchable'
-      >
-        <View style={[styles.icon, icon]}>
-          <ImageSelectorIcon
-            numberOfImageUploads={imageUploads.length}
-            selectedPicker={selectedPicker}
-          />
-        </View>
-      </TouchableOpacity>
+      {hasImagePicker ? (
+        <TouchableOpacity
+          hitSlop={{ bottom: 15, top: 15 }}
+          onPress={setImagePicker}
+          testID='upload-photo-touchable'
+        >
+          <View style={[styles.icon, icon]}>
+            <ImageSelectorIcon
+              numberOfImageUploads={imageUploads.length}
+              selectedPicker={selectedPicker}
+            />
+          </View>
+        </TouchableOpacity>
+      ) : null}
       {hasFilePicker ? (
         <TouchableOpacity
           hitSlop={{ bottom: 15, top: 15 }}

package/src/components/Channel/Channel.tsx

@@ -84,6 +84,7 @@ import {
   FlatList as FlatListDefault,
   isAudioRecorderAvailable,
   isDocumentPickerAvailable,
+  isImageMediaLibraryAvailable,
   isImagePickerAvailable,
 } from '../../native';
 import * as dbApi from '../../store/apis';
@@ -522,7 +523,7 @@ const ChannelWithContext = <
     hasCommands = true,
     // If pickDocument isn't available, default to hiding the file picker
     hasFilePicker = isDocumentPickerAvailable(),
-    hasImagePicker = true,
+    hasImagePicker = isImagePickerAvailable() || isImageMediaLibraryAvailable(),
     hideDateSeparators = false,
     hideStickyDateHeader = false,
     ImageLoadingFailedIndicator = ImageLoadingFailedIndicatorDefault,

package/src/components/MessageInput/components/NativeAttachmentPicker.tsx

@@ -36,6 +36,7 @@ export const NativeAttachmentPicker = ({
     },
   } = useTheme();
   const {
+    hasCameraPicker,
     hasFilePicker,
     hasImagePicker,
     pickAndUploadImageFromNativePicker,
@@ -115,7 +116,13 @@ export const NativeAttachmentPicker = ({
   if (hasFilePicker) {
     buttons.push({ icon: <FileSelectorIcon />, id: 'File', onPressHandler: pickFile });
   }
-  buttons.push({ icon: <CameraSelectorIcon />, id: 'Camera', onPressHandler: takeAndUploadImage });
+  if (hasCameraPicker) {
+    buttons.push({
+      icon: <CameraSelectorIcon />,
+      id: 'Camera',
+      onPressHandler: takeAndUploadImage,
+    });
+  }
 
   return (
     <>