Merge branch 'develop' into Enigma-I-am/link-preview-component

Nwagba Okechukwu · Nwagba Okechukwu · commit 15b2dcfc016b · 2022-06-02T10:42:31.000+01:00
diff --git a/.github/workflows/check-pr.yml b/.github/workflows/check-pr.yml
@@ -1,4 +1,4 @@
-name: Lint & Unit Tests
+name: Lint, Unit Tests, and Code Analysis
 
 on:
   pull_request:
@@ -13,6 +13,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
+        with:
+            # Disabling shallow clone is recommended for improving relevancy of reporting
+            fetch-depth: 0
       - name: Use Node.js ${{ matrix.node-version }}
         uses: actions/setup-node@v2
         with:
@@ -25,3 +28,16 @@ jobs:
         run: yarn lerna-workspaces run lint && cd docusaurus && npx prettier --check '**/*.mdx'
       - name: Test
         run: yarn test:unit
+      - name: SonarCloud Scan
+        uses: sonarsource/sonarcloud-github-action@master
+        with:
+          args: >
+            -Dsonar.organization=getstream
+            -Dsonar.projectKey=GetStream_stream-chat-react-native
+            -Dsonar.javascript.lcov.reportPaths=./package/coverage/lcov.info
+            -Dsonar.sources=package/src/
+            -Dsonar.test.exclusions=**/__tests__/**
+            -Dsonar.verbose=true
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
diff --git a/README.md b/README.md
@@ -11,6 +11,7 @@
 [![NPM](https://img.shields.io/npm/v/stream-chat-react-native.svg)](https://www.npmjs.com/package/stream-chat-react-native)
 [![Build Status](https://github.com/GetStream/stream-chat-react-native/workflows/test/badge.svg?branch=main)](https://github.com/GetStream/stream-chat-react-native/actions)
 [![Component Reference](https://img.shields.io/badge/docs-component%20reference-blue.svg)](https://getstream.io/chat/docs/sdk/reactnative)
+[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=GetStream_stream-chat-react-native&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=GetStream_stream-chat-react-native)
 
 <img align="right" src="https://getstream.imgix.net/images/ios-chat-tutorial/iphone_chat_art@3x.png?auto=format,enhance" width="50%" />
 
diff --git a/docusaurus/docs/reactnative/basics/getting_started.mdx b/docusaurus/docs/reactnative/basics/getting_started.mdx
@@ -60,6 +60,7 @@ Most if not all of the required packages now support auto-linking so setup shoul
 - [`react-native-safe-area-context`](https://github.com/th3rdwave/react-native-safe-area-context)
 - [`react-native-share`](https://github.com/react-native-share/react-native-share)
 - [`react-native-svg`](https://github.com/react-native-svg/react-native-svg)
+- [`react-native-video`](https://github.com/react-native-video/react-native-video)
 
 <Tabs
   defaultValue='yarn'
@@ -71,14 +72,14 @@ Most if not all of the required packages now support auto-linking so setup shoul
 <TabItem value='yarn'>
 
 ```bash
-yarn add @react-native-community/cameraroll @react-native-community/netinfo @stream-io/flat-list-mvcp react-native-document-picker react-native-fs react-native-gesture-handler react-native-haptic-feedback react-native-haptic-feedback react-native-image-crop-picker react-native-image-resizer react-native-reanimated react-native-safe-area-context react-native-share react-native-svg
+yarn add @react-native-community/cameraroll @react-native-community/netinfo @stream-io/flat-list-mvcp react-native-document-picker react-native-fs react-native-gesture-handler react-native-haptic-feedback react-native-haptic-feedback react-native-image-crop-picker react-native-image-resizer react-native-reanimated react-native-safe-area-context react-native-share react-native-svg react-native-video
 ```
 
 </TabItem>
 <TabItem value='npm'>
 
 ```bash
-npm install @react-native-community/cameraroll @react-native-community/netinfo @stream-io/flat-list-mvcp react-native-document-picker react-native-fs react-native-gesture-handler react-native-haptic-feedback react-native-haptic-feedback react-native-image-crop-picker react-native-image-resizer react-native-reanimated react-native-safe-area-context react-native-share react-native-svg
+npm install @react-native-community/cameraroll @react-native-community/netinfo @stream-io/flat-list-mvcp react-native-document-picker react-native-fs react-native-gesture-handler react-native-haptic-feedback react-native-haptic-feedback react-native-image-crop-picker react-native-image-resizer react-native-reanimated react-native-safe-area-context react-native-share react-native-svg react-native-video
 ```
 
 </TabItem>
@@ -150,6 +151,7 @@ For some of the packages listed below, there are additional steps required to se
 - `react-native` - [additional installation steps](https://reactnative.dev/docs/image#gif-and-webp-support-on-android)
 - `react-native-image-crop-picker` - [additional installation steps](https://github.com/ivpusic/react-native-image-crop-picker#step-3)
 - `react-native-cameraroll` - [additional installation steps](https://github.com/react-native-cameraroll/react-native-cameraroll#permissions)
+- `react-native-video` - [additional installation steps](https://github.com/react-native-video/react-native-video/blob/master/API.md#installation)
 
 :::note
 
@@ -174,5 +176,5 @@ Stream Chat for React Native is set up for parity on Expo, expo requires a diffe
 
 ```bash
 expo install stream-chat-expo
-expo install @react-native-community/netinfo expo-document-picker expo-file-system expo-haptics expo-image-manipulator expo-image-picker expo-media-library expo-sharing react-native-gesture-handler react-native-reanimated react-native-safe-area-context react-native-svg
+expo install @react-native-community/netinfo expo-document-picker expo-file-system expo-haptics expo-image-manipulator expo-image-picker expo-media-library expo-sharing react-native-gesture-handler react-native-reanimated react-native-safe-area-context react-native-svg expo-av
 ```
diff --git a/docusaurus/docs/reactnative/common-content/core-components/channel/props/on_press_message.mdx b/docusaurus/docs/reactnative/common-content/core-components/channel/props/on_press_message.mdx
@@ -22,13 +22,20 @@ For example:
 
 ```tsx
     <Channel
-    onPressMessage={({ additionalInfo, defaultHandler, emitter }) => {
-        if (emitter === 'textMention') {
-          console.log(additionalInfo?.user);
-          return;
-        }
-        defaultHandler?.();
-    }}
+      onPressMessage={({ additionalInfo, defaultHandler, emitter }) => {
+
+          if (emitter === 'textMention') {
+            console.log(additionalInfo?.user);
+            return;
+          }
+
+          if (emitter === 'card' || emitter === 'textLink') {
+            console.log(additionalInfo?.url);
+            return;
+          }
+
+          defaultHandler?.();
+      }}
     >
 ```
 
diff --git a/examples/SampleApp/ios/SampleApp.xcodeproj/project.pbxproj b/examples/SampleApp/ios/SampleApp.xcodeproj/project.pbxproj
@@ -514,7 +514,7 @@
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = SampleApp/SampleAppDebug.entitlements;
 				CODE_SIGN_IDENTITY = "iPhone Developer";
-				CURRENT_PROJECT_VERSION = 109;
+				CURRENT_PROJECT_VERSION = 113;
 				DEVELOPMENT_TEAM = EHV7XZLAHA;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = SampleApp/Info.plist;
@@ -545,7 +545,7 @@
 				CODE_SIGN_ENTITLEMENTS = SampleApp/SampleAppRelease.entitlements;
 				CODE_SIGN_IDENTITY = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 109;
+				CURRENT_PROJECT_VERSION = 113;
 				DEVELOPMENT_TEAM = EHV7XZLAHA;
 				INFOPLIST_FILE = SampleApp/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = (
diff --git a/examples/SampleApp/ios/SampleApp/Info.plist b/examples/SampleApp/ios/SampleApp/Info.plist
@@ -17,11 +17,11 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.5.0</string>
+	<string>1.6.1</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>109</string>
+	<string>113</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true />
 	<key>NSAppTransportSecurity</key>
diff --git a/examples/SampleApp/ios/SampleAppTests/Info.plist b/examples/SampleApp/ios/SampleAppTests/Info.plist
@@ -15,10 +15,10 @@
 	<key>CFBundlePackageType</key>
 	<string>BNDL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.5.0</string>
+	<string>1.6.1</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>109</string>
+	<string>113</string>
 </dict>
 </plist>
diff --git a/package/native-package/yarn.lock b/package/native-package/yarn.lock
@@ -1619,10 +1619,10 @@ source-map@^0.5.0:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
   integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
 
-stream-chat-react-native-core@4.3.1:
-  version "4.3.1"
-  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-4.3.1.tgz#bc53a044c45b60f6bd3feb425e70100d077cc064"
-  integrity sha512-2DZO89EyDtXtmc5MhivD1kOOU6aklK/rgZVvo4RZ15419VlpVFqMjswvFAcF41z2ZJujP86cSSKg5YMhNy7uZw==
+stream-chat-react-native-core@4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-4.5.0.tgz#7c74f542e66ef9028f3c303b9a5149db681df1ff"
+  integrity sha512-koDw3Nzw8mORGrSeL2JfHqXWFHWHdJLMrhd/UIuShDVJcZmxcPjvXoFUrMWMbu4C8yrlftcsKKmDGWlUzdSqaA==
   dependencies:
     "@babel/runtime" "^7.12.5"
     "@gorhom/bottom-sheet" "4.1.5"
diff --git a/package/package.json b/package/package.json
@@ -34,7 +34,7 @@
     "prepare-distribution": "cd examples/SampleApp && npm version patch && react-native-version && git add ./ && git commit -m 'Bump build version' --no-verify",
     "prettier": "prettier --list-different '**/*.{js,ts,tsx,md,json}' .eslintrc.json ../.prettierrc .babelrc",
     "prettier-fix": "prettier --write '**/*.{js,ts,tsx,md,json}' .eslintrc.json ../.prettierrc .babelrc",
-    "test:unit": "TZ=UTC jest",
+    "test:unit": "TZ=UTC jest --coverage",
     "validate-translations": "node bin/validate-translations.js",
     "get-version": "echo $npm_package_version",
     "version": "bash ./bin/before-tag.sh",
diff --git a/package/src/components/Attachment/Card.tsx b/package/src/components/Attachment/Card.tsx
@@ -165,6 +165,7 @@ const CardWithContext = <
       onLongPress={(event) => {
         if (onLongPress) {
           onLongPress({
+            additionalInfo: { url: og_scrape_url },
             emitter: 'card',
             event,
           });
@@ -173,6 +174,7 @@ const CardWithContext = <
       onPress={(event) => {
         if (onPress) {
           onPress({
+            additionalInfo: { url: og_scrape_url },
             defaultHandler: defaultOnPress,
             emitter: 'card',
             event,
@@ -182,6 +184,7 @@ const CardWithContext = <
       onPressIn={(event) => {
         if (onPressIn) {
           onPressIn({
+            additionalInfo: { url: og_scrape_url },
             defaultHandler: defaultOnPress,
             emitter: 'card',
             event,
diff --git a/package/src/components/Chat/hooks/useIsOnline.ts b/package/src/components/Chat/hooks/useIsOnline.ts
@@ -13,7 +13,7 @@ import type { DefaultStreamChatGenerics } from '../../../types/types';
 /**
  * Disconnect the websocket connection when app goes to background,
  * and reconnect when app comes to foreground.
- * We do this to make sure, user receives push notifications when app is in the background.
+ * We do this to make sure the user receives push notifications when app is in the background.
  * You can't receive push notification until you have active websocket connection.
  */
 export const useIsOnline = <
@@ -25,10 +25,10 @@ export const useIsOnline = <
   const [isOnline, setIsOnline] = useState(true);
   const [connectionRecovering, setConnectionRecovering] = useState(false);
   const isMounted = useIsMountedRef();
-  const clientExits = !!client;
+  const clientExists = !!client;
 
   const onBackground = useCallback(() => {
-    if (!closeConnectionOnBackground) return;
+    if (!closeConnectionOnBackground || !clientExists) return;
 
     for (const cid in client.activeChannels) {
       const channel = client.activeChannels[cid];
@@ -37,13 +37,13 @@ export const useIsOnline = <
 
     client.closeConnection();
     setIsOnline(false);
-  }, [closeConnectionOnBackground, client]);
+  }, [closeConnectionOnBackground, client, clientExists]);
 
   const onForeground = useCallback(() => {
-    if (!closeConnectionOnBackground) return;
+    if (!closeConnectionOnBackground || !clientExists) return;
 
     client.openConnection();
-  }, [closeConnectionOnBackground, client]);
+  }, [closeConnectionOnBackground, client, clientExists]);
 
   useAppStateListener(onForeground, onBackground);
 
@@ -101,7 +101,7 @@ export const useIsOnline = <
       chatListeners.forEach((listener) => listener.unsubscribe?.());
       unsubscribeNetInfo?.();
     };
-  }, [clientExits]);
+  }, [clientExists]);
 
   return { connectionRecovering, isOnline };
 };
diff --git a/package/src/components/Message/Message.tsx b/package/src/components/Message/Message.tsx
@@ -53,15 +53,13 @@ import {
 import type { MessageActionListItemProps } from '../MessageOverlay/MessageActionListItem';
 
 export type TouchableEmitter =
-  | 'card'
   | 'fileAttachment'
   | 'gallery'
   | 'giphy'
   | 'message'
   | 'messageContent'
   | 'messageReplies'
-  | 'reactionList'
-  | 'textLink';
+  | 'reactionList';
 
 export type TextMentionTouchableHandlerPayload<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
@@ -70,21 +68,27 @@ export type TextMentionTouchableHandlerPayload<
   additionalInfo?: { user?: UserResponse<StreamChatGenerics> };
 };
 
+export type UrlTouchableHandlerPayload = {
+  emitter: 'textLink' | 'card';
+  additionalInfo?: { url?: string };
+};
+
 export type TouchableHandlerPayload = {
   defaultHandler?: () => void;
   event?: GestureResponderEvent;
 } & (
   | {
-      additionalInfo?: Record<string, unknown>;
       emitter?: TouchableEmitter;
     }
   | TextMentionTouchableHandlerPayload
+  | UrlTouchableHandlerPayload
 );
 
 export type MessageTouchableHandlerPayload<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = TouchableHandlerPayload & {
   actionHandlers?: MessageActionHandlers;
+  additionalInfo?: Record<string, unknown>;
   message?: MessageType<StreamChatGenerics>;
 };
 
diff --git a/package/src/components/Message/MessageSimple/utils/renderText.tsx b/package/src/components/Message/MessageSimple/utils/renderText.tsx
@@ -161,10 +161,14 @@ export const renderText = <
   };
 
   const link: ReactNodeOutput = (node, output, { ...state }) => {
+    const url = node.target;
     const onPress = (event: GestureResponderEvent) => {
       if (!preventPress && onPressParam) {
         onPressParam({
-          defaultHandler: () => onLink(node.target),
+          additionalInfo: { url },
+          defaultHandler: () => {
+            onLink(url);
+          },
           emitter: 'textLink',
           event,
         });
@@ -174,6 +178,7 @@ export const renderText = <
     const onLongPress = (event: GestureResponderEvent) => {
       if (!preventPress && onLongPressParam) {
         onLongPressParam({
+          additionalInfo: { url },
           emitter: 'textLink',
           event,
         });
diff --git a/package/src/components/Reply/Reply.tsx b/package/src/components/Reply/Reply.tsx
@@ -206,7 +206,9 @@ const ReplyWithContext = <
             />
           ) : null
         ) : null}
-        {messageType === 'video' ? <VideoThumbnail style={[styles.videoAttachment]} /> : null}
+        {messageType === 'video' && !lastAttachment.og_scrape_url ? (
+          <VideoThumbnail style={[styles.videoAttachment]} />
+        ) : null}
         <MessageTextContainer<StreamChatGenerics>
           markdownStyles={
             quotedMessage.deleted_at
diff --git a/package/src/contexts/messageInputContext/MessageInputContext.tsx b/package/src/contexts/messageInputContext/MessageInputContext.tsx
@@ -665,6 +665,8 @@ export const MessageInputProvider = <
         attachments.push({
           fallback: image.file.name,
           image_url: image.url,
+          original_height: image.height,
+          original_width: image.width,
           type: 'image',
         } as Attachment<StreamChatGenerics>);
       }
@@ -686,6 +688,15 @@ export const MessageInputProvider = <
             image_url: file.url,
             type: 'image',
           } as Attachment<StreamChatGenerics>);
+        } else if (file.file.type?.startsWith('audio/')) {
+          attachments.push({
+            asset_url: file.url,
+            duration: file.file.duration,
+            file_size: file.file.size,
+            mime_type: file.file.type,
+            title: file.file.name,
+            type: 'audio',
+          } as Attachment<StreamChatGenerics>);
         } else if (file.file.type?.startsWith('video/')) {
           attachments.push({
             asset_url: file.url,
