Chore: use `@react-native-clipboard/clipboard` (#3950)

* add: @react-native-clipboard/clipboard

* create jest.setup.js file and centralizes all mocks on these folder for jest

Co-authored-by: GleidsonDaniel <gleidson10daniel@hotmail.com>

__tests__/Storyshots.test.js

@@ -1,45 +1,8 @@
 import initStoryshots, { Stories2SnapsConverter } from '@storybook/addon-storyshots';
 import { render } from '@testing-library/react-native';
 
-jest.mock('rn-fetch-blob', () => ({
-	fs: {
-		dirs: {
-			DocumentDir: '/data/com.rocket.chat/documents',
-			DownloadDir: '/data/com.rocket.chat/downloads'
-		},
-		exists: jest.fn(() => null)
-	},
-	fetch: jest.fn(() => null),
-	config: jest.fn(() => null)
-}));
-
-jest.mock('react-native-file-viewer', () => ({
-	open: jest.fn(() => null)
-}));
-
-jest.mock('../app/lib/database', () => jest.fn(() => null));
 global.Date.now = jest.fn(() => new Date('2019-10-10').getTime());
 
-jest.mock('react-native-mmkv-storage', () => {
-	return {
-		Loader: jest.fn().mockImplementation(() => {
-			return {
-				setProcessingMode: jest.fn().mockImplementation(() => {
-					return {
-						withEncryption: jest.fn().mockImplementation(() => {
-							return {
-								initialize: jest.fn()
-							};
-						})
-					};
-				})
-			};
-		}),
-		create: jest.fn(),
-		MODES: { MULTI_PROCESS: '' }
-	};
-});
-
 const converter = new Stories2SnapsConverter();
 
 initStoryshots({

app/containers/MessageActions/index.tsx

@@ -1,5 +1,6 @@
 import React, { forwardRef, useImperativeHandle } from 'react';
-import { Alert, Clipboard, Share } from 'react-native';
+import { Alert, Share } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
 import { connect } from 'react-redux';
 import moment from 'moment';
 

app/containers/markdown/Link.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Clipboard, Text } from 'react-native';
+import { Text } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
 
 import styles from './styles';
 import { themes } from '../../constants/colors';

app/containers/markdown/new/Link.tsx

@@ -1,6 +1,7 @@
 import React, { useContext } from 'react';
-import { Text, Clipboard } from 'react-native';
+import { Text } from 'react-native';
 import { Link as LinkProps } from '@rocket.chat/message-parser';
+import Clipboard from '@react-native-clipboard/clipboard';
 
 import styles from '../styles';
 import I18n from '../../../i18n';

app/containers/message/Components/CollapsibleQuote/CollapsibleQuote.test.tsx

@@ -4,19 +4,6 @@ import React from 'react';
 import MessageContext from '../../Context';
 import CollapsibleQuote from '.';
 
-// For some reason a general mock didn't work, I have to do a search
-jest.mock('react-native-mmkv-storage', () => ({
-	Loader: jest.fn().mockImplementation(() => ({
-		setProcessingMode: jest.fn().mockImplementation(() => ({
-			withEncryption: jest.fn().mockImplementation(() => ({
-				initialize: jest.fn()
-			}))
-		}))
-	})),
-	create: jest.fn(),
-	MODES: { MULTI_PROCESS: '' }
-}));
-
 const testAttachment = {
 	ts: '1970-01-01T00:00:00.000Z',
 	title: 'Engineering (9 today)',

app/containers/message/Urls.tsx

@@ -1,5 +1,6 @@
 import React, { useContext } from 'react';
-import { Clipboard, StyleSheet, Text, View } from 'react-native';
+import { StyleSheet, Text, View } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
 import FastImage from '@rocket.chat/react-native-fast-image';
 import { dequal } from 'dequal';
 

app/views/E2ESaveYourPasswordView.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Clipboard, ScrollView, StyleSheet, Text, View } from 'react-native';
+import { ScrollView, StyleSheet, Text, View } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
 import { connect } from 'react-redux';
 
 import { encryptionSetBanner } from '../actions/encryption';

app/views/SettingsView/index.tsx

@@ -2,7 +2,8 @@ import CookieManager from '@react-native-cookies/cookies';
 import { StackNavigationOptions } from '@react-navigation/stack';
 import FastImage from '@rocket.chat/react-native-fast-image';
 import React from 'react';
-import { Clipboard, Linking, Share } from 'react-native';
+import { Linking, Share } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
 import { connect } from 'react-redux';
 
 import { appStart } from '../../actions/app';

ios/Podfile.lock

@@ -506,6 +506,8 @@ PODS:
     - React-Core
   - RNCAsyncStorage (1.12.1):
     - React-Core
+  - RNCClipboard (1.8.5):
+    - React-Core
   - RNCMaskedView (0.1.11):
     - React
   - RNConfigReader (1.0.0):
@@ -693,6 +695,7 @@ DEPENDENCIES:
   - rn-fetch-blob (from `../node_modules/rn-fetch-blob`)
   - RNBootSplash (from `../node_modules/react-native-bootsplash`)
   - "RNCAsyncStorage (from `../node_modules/@react-native-community/async-storage`)"
+  - "RNCClipboard (from `../node_modules/@react-native-clipboard/clipboard`)"
   - "RNCMaskedView (from `../node_modules/@react-native-community/masked-view`)"
   - RNConfigReader (from `../node_modules/react-native-config-reader`)
   - "RNCPicker (from `../node_modules/@react-native-community/picker`)"
@@ -879,6 +882,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-bootsplash"
   RNCAsyncStorage:
     :path: "../node_modules/@react-native-community/async-storage"
+  RNCClipboard:
+    :path: "../node_modules/@react-native-clipboard/clipboard"
   RNCMaskedView:
     :path: "../node_modules/@react-native-community/masked-view"
   RNConfigReader:
@@ -950,7 +955,7 @@ SPEC CHECKSUMS:
   EXVideoThumbnails: 442c3abadb51a81551a3b53705b7560de390e6f7
   EXWebBrowser: 76783ba5dcb8699237746ecf41a9643d428a4cc5
   FBLazyVector: e686045572151edef46010a6f819ade377dfeb4b
-  FBReactNativeSpec: 110d69378fce79af38271c39894b59fec7890221
+  FBReactNativeSpec: 686ac17e193dcf7d5df4d772b224504dd2f3ad81
   Firebase: 919186c8e119dd9372a45fd1dd17a8a942bc1892
   FirebaseAnalytics: 5fa308e1b13f838d0f6dc74719ac2a72e8c5afc4
   FirebaseCore: 8cd4f8ea22075e0ee582849b1cf79d8816506085
@@ -1024,6 +1029,7 @@ SPEC CHECKSUMS:
   rn-fetch-blob: f065bb7ab7fb48dd002629f8bdcb0336602d3cba
   RNBootSplash: 4844706cbb56a3270556c9b94e59dedadccd47e4
   RNCAsyncStorage: b03032fdbdb725bea0bd9e5ec5a7272865ae7398
+  RNCClipboard: cc054ad1e8a33d2a74cd13e565588b4ca928d8fd
   RNCMaskedView: 0e1bc4bfa8365eba5fbbb71e07fbdc0555249489
   RNConfigReader: 396da6a6444182a76e8ae0930b9436c7575045cb
   RNCPicker: 914b557e20b3b8317b084aca9ff4b4edb95f61e4

jest.setup.js

@@ -0,0 +1,33 @@
+import mockClipboard from '@react-native-clipboard/clipboard/jest/clipboard-mock.js';
+
+jest.mock('@react-native-clipboard/clipboard', () => mockClipboard);
+
+jest.mock('react-native-mmkv-storage', () => ({
+	Loader: jest.fn().mockImplementation(() => ({
+		setProcessingMode: jest.fn().mockImplementation(() => ({
+			withEncryption: jest.fn().mockImplementation(() => ({
+				initialize: jest.fn()
+			}))
+		}))
+	})),
+	create: jest.fn(),
+	MODES: { MULTI_PROCESS: '' }
+}));
+
+jest.mock('rn-fetch-blob', () => ({
+	fs: {
+		dirs: {
+			DocumentDir: '/data/com.rocket.chat/documents',
+			DownloadDir: '/data/com.rocket.chat/downloads'
+		},
+		exists: jest.fn(() => null)
+	},
+	fetch: jest.fn(() => null),
+	config: jest.fn(() => null)
+}));
+
+jest.mock('react-native-file-viewer', () => ({
+	open: jest.fn(() => null)
+}));
+
+jest.mock('./app/lib/database', () => jest.fn(() => null));

package.json

@@ -30,6 +30,7 @@
 		"@bugsnag/react-native": "^7.10.5",
 		"@codler/react-native-keyboard-aware-scroll-view": "^1.0.1",
 		"@nozbe/watermelondb": "0.23.0",
+		"@react-native-clipboard/clipboard": "^1.8.5",
 		"@react-native-community/art": "^1.2.0",
 		"@react-native-community/async-storage": "1.12.1",
 		"@react-native-community/blur": "^3.6.0",
@@ -208,7 +209,8 @@
 			"^.+\\.js$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
 		},
 		"setupFilesAfterEnv": [
-			"@testing-library/jest-native/extend-expect"
+			"@testing-library/jest-native/extend-expect",
+			"./jest.setup.js"
 		]
 	},
 	"snyk": true,

yarn.lock

@@ -3412,6 +3412,11 @@
     prop-types "^15.6.1"
     react-lifecycles-compat "^3.0.4"
 
+"@react-native-clipboard/clipboard@^1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@react-native-clipboard/clipboard/-/clipboard-1.8.5.tgz#b11276e38ef288b0fd70c0a38506e2deecc5fa5a"
+  integrity sha512-o2RPDwP9JMnLece1Qq6a3Fsz/VxfA9auLckkGOor7WcI82DWaWiJ6Uiyu7H1xpaUyqWc+ypVKRX680GYS36HjA==
+
 "@react-native-community/art@^1.1.2", "@react-native-community/art@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@react-native-community/art/-/art-1.2.0.tgz#386d95393f6042d9006f9d4bc6063fb898794460"