caglardurmus / react-native-insta-story

Story component for React Native
MIT License
178 stars 85 forks source link

I can't patch on package? #62

Open Nalymoslih opened 6 months ago

Nalymoslih commented 6 months ago

Hi! πŸ‘‹

Firstly, thanks for your work on this project! πŸ™‚

Today I used patch-package to patch react-native-insta-story@1.1.9 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-insta-story/src/StoryCircleListItem.tsx b/node_modules/react-native-insta-story/src/StoryCircleListItem.tsx
index c80e6d8..6bd1f6f 100644
--- a/node_modules/react-native-insta-story/src/StoryCircleListItem.tsx
+++ b/node_modules/react-native-insta-story/src/StoryCircleListItem.tsx
@@ -10,6 +10,7 @@ import {

 import { usePrevious } from './helpers/StateHelpers';
 import { IUserStory, StoryCircleListItemProps } from './interfaces';
+import Sizing from '../../../src/common/Sizing';

 import DEFAULT_AVATAR from './assets/images/no_avatar.png';

@@ -27,19 +28,23 @@ const StoryCircleListItem = ({
   avatarWrapperStyle,
 }: StoryCircleListItemProps) => {
   const [isPressed, setIsPressed] = useState(item?.seen);
+  const [isVerifiedUser, setIsVerifiedUser] = useState(false);

   const prevSeen = usePrevious(item?.seen);
+  console.log({item});

   useEffect(() => {
-    if (prevSeen != item?.seen) {
+    if (prevSeen !== item?.seen) {
       setIsPressed(item?.seen);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [item?.seen]);
+  }, [item?.seen, prevSeen]);
+
+  useEffect(() => {
+    setIsVerifiedUser(item?.isVerified || false);
+  }, [item?.isVerified]);

   const _handleItemPress = (item: IUserStory) => {
     if (handleStoryItemPress) handleStoryItemPress(item);
-
     setIsPressed(true);
   };

@@ -47,6 +52,21 @@ const StoryCircleListItem = ({

   return (
     <View style={styles.container}>
+      {isVerifiedUser && (
+        <Image
+          source={require('../../../src/images/verified.png')}
+          style={{
+            width: Sizing.deviceWidth * 0.08,
+            height: Sizing.deviceHeight * 0.025,
+            borderRadius: 100,
+            position: 'absolute',
+            bottom: Sizing.deviceHeight * 0.065,
+            left: Sizing.deviceWidth * 0.093,
+            zIndex: 999,
+            resizeMode: 'contain',
+          }}
+        />
+      )}
       <TouchableOpacity
         onPress={() => _handleItemPress(item)}
         style={[
@@ -124,3 +144,4 @@ const styles = StyleSheet.create({
     fontSize: 11,
   },
 });
+

This issue body was partially generated by patch-package.