feat: add sharing functionality

Author: isekovanic

sample-apps/react-native/ExpoTikTokApp/components/ActivityPager/PagerItem.tsx

@@ -2,7 +2,6 @@ import type { ActivityResponse } from '@stream-io/feeds-react-native-sdk';
 import { useFeedContext } from '@stream-io/feeds-react-native-sdk';
 import React, { useMemo } from 'react';
 import {
-  Alert,
   Dimensions,
   StyleSheet,
   Text,
@@ -18,6 +17,7 @@ import { Bookmark } from '@/components/Bookmark';
 import { useRouter } from 'expo-router';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { LocationPreview } from '@/components/LocationPreview';
+import { ShareButton } from '@/components/Share';
 
 const { height: SCREEN_HEIGHT } = Dimensions.get('window');
 
@@ -95,16 +95,9 @@ const UnmemoizedPagerItem = ({
             <Text style={styles.iconLabel}>{activity.bookmark_count ?? 0}</Text>
           </TouchableOpacity>
 
-          <TouchableOpacity
-            onPress={() =>
-              Alert.alert(
-                'Sharing was captured successfully, but is not implemented yet !',
-              )
-            }
-            style={styles.iconContainer}
-          >
-            <Ionicons name="arrow-redo-outline" size={28} color="white" />
-          </TouchableOpacity>
+          <View style={styles.iconContainer}>
+            <ShareButton attachment={videoAttachment} />
+          </View>
         </View>
       </View>
     );

sample-apps/react-native/ExpoTikTokApp/components/LocationPreview.tsx

@@ -5,7 +5,7 @@ import { Place } from '@/components/PlaceSearchDropdown';
 import { useRouter } from 'expo-router';
 
 type LocationPreviewProps = {
-  location: Omit<Place, 'id'>;
+  location: Omit<Place, 'id' | 'address'>;
 };
 
 export const LocationPreview = ({ location }: LocationPreviewProps) => {

sample-apps/react-native/ExpoTikTokApp/components/Share.tsx

@@ -0,0 +1,34 @@
+import { Ionicons } from '@expo/vector-icons';
+import { Share, TouchableOpacity } from 'react-native';
+import React from 'react';
+import {
+  Attachment,
+  isImageFile,
+  isVideoFile,
+} from '@stream-io/feeds-react-native-sdk';
+import { useStableCallback } from '@/hooks/useStableCallback';
+
+const pretext = 'Check out this cool';
+
+export const ShareButton = ({ attachment }: { attachment: Attachment }) => {
+  const shareText = attachment.image_url
+    ? `${pretext} image ! ${attachment.image_url}`
+    : `${pretext} video ! ${attachment.asset_url}`;
+
+  const shareContent = useStableCallback(async () => {
+    try {
+      await Share.share({
+        message: shareText,
+        title: 'ExpoTikTokApp',
+      });
+    } catch (error) {
+      console.error('Error sharing:', error);
+    }
+  });
+
+  return (
+    <TouchableOpacity onPress={shareContent}>
+      <Ionicons name="arrow-redo-outline" size={28} color="white" />
+    </TouchableOpacity>
+  );
+};