fix: picker btn behaviour

Author: isekovanic

examples/SampleApp/src/components/AttachmentPickerContent.tsx

@@ -1,10 +1,11 @@
-import React, { useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import {
   useAttachmentPickerState,
   AttachmentPickerContentProps,
   AttachmentPickerContent,
   AttachmentPickerGenericContent,
   useStableCallback,
+  useTheme,
   useTranslationContext,
 } from 'stream-chat-react-native';
 import { ShareLocationIcon } from '../icons/ShareLocationIcon.tsx';
@@ -14,6 +15,14 @@ export const CustomAttachmentPickerContent = (props: AttachmentPickerContentProp
   const [modalVisible, setModalVisible] = useState(false);
   const { selectedPicker } = useAttachmentPickerState();
   const { t } = useTranslationContext();
+  const {
+    theme: { semantics },
+  } = useTheme();
+
+  const Icon = useCallback(
+    () => <ShareLocationIcon stroke={semantics.textTertiary} />,
+    [semantics.textTertiary],
+  );
 
   const onRequestClose = () => {
     setModalVisible(false);
@@ -27,7 +36,7 @@ export const CustomAttachmentPickerContent = (props: AttachmentPickerContentProp
     return (
       <>
         <AttachmentPickerGenericContent
-          Icon={ShareLocationIcon}
+          Icon={Icon}
           onPress={onOpenModal}
           height={props.height}
           buttonText={t('Share Location')}

examples/SampleApp/src/components/AttachmentPickerSelectionBar.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { useMemo, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import {
   AttachmentTypePickerButton,
@@ -13,15 +13,22 @@ import {
   useTheme,
 } from 'stream-chat-react-native';
 import { ShareLocationIcon } from '../icons/ShareLocationIcon';
+import { LiveLocationCreateModal } from './LocationSharing/CreateLocationModal';
 
 export const CustomAttachmentPickerSelectionBar = () => {
+  const [modalVisible, setModalVisible] = useState(false);
   const { attachmentPickerStore } = useAttachmentPickerContext();
   const { selectedPicker } = useAttachmentPickerState();
 
   const styles = useStyles();
 
+  const onRequestClose = () => {
+    setModalVisible(false);
+  };
+
   const onOpenModal = useStableCallback(() => {
     attachmentPickerStore.setSelectedPicker('location');
+    setModalVisible(true);
   });
 
   return (
@@ -36,6 +43,9 @@ export const CustomAttachmentPickerSelectionBar = () => {
         onPress={onOpenModal}
         selected={selectedPicker === 'location'}
       />
+      {modalVisible ? (
+        <LiveLocationCreateModal visible={modalVisible} onRequestClose={onRequestClose} />
+      ) : null}
     </View>
   );
 };