(`/products/${productId}`)).data;
9 | };
10 |
11 | export const useGetProductById = (
12 | productId: number,
13 | options?: UseQueryOptions<
14 | Product,
15 | AxiosError,
16 | Product,
17 | readonly (string | number)[]
18 | >,
19 | ) => {
20 | return useQuery({
21 | queryFn: () => getProductById(productId),
22 | queryKey: [...productKeyFactory.productById(productId)],
23 | ...options,
24 | });
25 | };
26 |
--------------------------------------------------------------------------------
/android/app/src/release/java/com/reactnativezustandrq/ReactNativeFlipper.java:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) Meta Platforms, Inc. and affiliates.
3 | *
4 | * This source code is licensed under the MIT license found in the LICENSE file in the root
5 | * directory of this source tree.
6 | */
7 | package com.reactnativezustandrq;
8 |
9 | import android.content.Context;
10 | import com.facebook.react.ReactInstanceManager;
11 |
12 | /**
13 | * Class responsible of loading Flipper inside your React Native application. This is the release
14 | * flavor of it so it's empty as we don't want to load Flipper.
15 | */
16 | public class ReactNativeFlipper {
17 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
18 | // Do nothing as we don't want to initialize Flipper on Release.
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/__mocks__/zustand.js:
--------------------------------------------------------------------------------
1 | // https://docs.pmnd.rs/zustand/guides/testing#resetting-state-between-tests-in-react-dom
2 | const {create: actualCreate} = jest.requireActual('zustand'); // if using jest
3 | import {act} from '@testing-library/react-native';
4 |
5 | // a variable to hold reset functions for all stores declared in the app
6 | const storeResetFns = new Set();
7 |
8 | // when creating a store, we get its initial state, create a reset function and add it in the set
9 | export const create = createState => {
10 | const store = actualCreate(createState);
11 | const initialState = store.getState();
12 | storeResetFns.add(() => store.setState(initialState, true));
13 | return store;
14 | };
15 |
16 | // Reset all stores after each test run
17 | beforeEach(() => {
18 | act(() => storeResetFns.forEach(resetFn => resetFn()));
19 | });
20 |
--------------------------------------------------------------------------------
/ios/ReactNativeZustandRQTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | $(PRODUCT_BUNDLE_IDENTIFIER)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/src/screens/error.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import {Button, StyleSheet, Text, View} from 'react-native';
3 |
4 | type Props = {
5 | resetError: () => void;
6 | };
7 |
8 | const ErrorScreen: React.FC = ({resetError}) => {
9 | return (
10 |
11 |
12 | An error occurred...
13 |
14 |
15 |
16 | );
17 | };
18 |
19 | export default ErrorScreen;
20 |
21 | const styles = StyleSheet.create({
22 | flexCenter: {
23 | flex: 1,
24 | justifyContent: 'center',
25 | alignItems: 'center',
26 | backgroundColor: '#E5E5E5',
27 | },
28 | errorText: {
29 | color: 'red',
30 | textAlign: 'center',
31 | fontSize: 32,
32 | },
33 | });
34 |
--------------------------------------------------------------------------------
/src/screens/__tests__/error.test.tsx:
--------------------------------------------------------------------------------
1 | import {fireEvent, render, screen} from '@testing-library/react-native';
2 | import React from 'react';
3 | import ErrorScreen from '../error';
4 |
5 | const resetErrorMock = jest.fn();
6 | const component = ;
7 |
8 | describe('Product list screen', () => {
9 | it('should display loading indicator on mount', async () => {
10 | render(component);
11 |
12 | expect(screen.getByText(`An error occurred...`)).toBeTruthy();
13 | });
14 |
15 | it('should display Go home button', async () => {
16 | render(component);
17 |
18 | expect(screen.getByText(`Go home`)).toBeTruthy();
19 | });
20 |
21 | it('go home button should be pressable ', async () => {
22 | render(component);
23 |
24 | fireEvent.press(screen.getByText(`Go home`));
25 |
26 | expect(resetErrorMock).toHaveBeenCalled();
27 | });
28 | });
29 |
--------------------------------------------------------------------------------
/jest.config.js:
--------------------------------------------------------------------------------
1 | const {defaults: tsjPreset} = require('ts-jest/presets');
2 |
3 | /** @type {import('ts-jest').JestConfigWithTsJest} */
4 | module.exports = {
5 | preset: 'react-native',
6 | transform: {
7 | '^.+\\.jsx$': 'babel-jest',
8 | '^.+\\.tsx?$': [
9 | 'ts-jest',
10 | {
11 | tsconfig: 'tsconfig.spec.json',
12 | },
13 | ],
14 | },
15 | testMatch: ['/src/**/?(*.)+(spec|test).[jt]s?(x)'],
16 | moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
17 | collectCoverage: true,
18 | collectCoverageFrom: ['./src/screens/**/*.tsx', './src/store/**/*.ts'],
19 | setupFilesAfterEnv: [
20 | './jest.setup.ts',
21 | '@testing-library/jest-native/extend-expect',
22 | ],
23 | transformIgnorePatterns: [
24 | `node_modules/(?!(${[
25 | 'react-native-vector-icons',
26 | 'react-native',
27 | '@react-native',
28 | '@react-navigation/elements',
29 | ].join('|')})/)`,
30 | ],
31 | };
32 |
--------------------------------------------------------------------------------
/src/components/error-boundary.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import ErrorScreen from '../screens/error';
3 |
4 | interface Props {
5 | children: React.ReactNode;
6 | }
7 |
8 | interface State {
9 | hasError: boolean;
10 | }
11 |
12 | class ErrorBoundary extends React.Component {
13 | constructor(props: Props) {
14 | super(props);
15 | this.state = {
16 | hasError: false,
17 | };
18 | }
19 |
20 | public static getDerivedStateFromError(_error: Error): State {
21 | return {hasError: true};
22 | }
23 |
24 | public componentDidCatch(_error: Error, _errorInfo: React.ErrorInfo): void {}
25 |
26 | private resetState = (): void => {
27 | this.setState({hasError: false});
28 | };
29 |
30 | public render(): React.ReactNode {
31 | if (this.state.hasError) {
32 | return ;
33 | }
34 |
35 | return this.props.children;
36 | }
37 | }
38 |
39 | export default ErrorBoundary;
40 |
--------------------------------------------------------------------------------
/android/build.gradle:
--------------------------------------------------------------------------------
1 | // Top-level build file where you can add configuration options common to all sub-projects/modules.
2 |
3 | buildscript {
4 | ext {
5 | buildToolsVersion = "33.0.0"
6 | minSdkVersion = 21
7 | compileSdkVersion = 33
8 | targetSdkVersion = 33
9 |
10 | // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
11 | ndkVersion = "23.1.7779620"
12 | kotlinVersion = '1.6.10'
13 | }
14 | repositories {
15 | google()
16 | mavenCentral()
17 | }
18 | dependencies {
19 | classpath("com.android.tools.build:gradle:7.3.1")
20 | classpath("com.facebook.react:react-native-gradle-plugin")
21 | classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion")
22 | }
23 |
24 | allprojects {
25 | repositories {
26 |
27 | maven {
28 | url("$rootDir/../node_modules/detox/Detox-android")
29 | }
30 | maven { url 'https://www.jitpack.io' }
31 |
32 | }
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/android/app/src/androidTest/java/com/reactnativezustandrq/DetoxTest.java:
--------------------------------------------------------------------------------
1 | package com.reactnativezustandrq;
2 |
3 | import com.wix.detox.Detox;
4 | import com.wix.detox.config.DetoxConfig;
5 |
6 | import org.junit.Rule;
7 | import org.junit.Test;
8 | import org.junit.runner.RunWith;
9 |
10 | import androidx.test.ext.junit.runners.AndroidJUnit4;
11 | import androidx.test.filters.LargeTest;
12 | import androidx.test.rule.ActivityTestRule;
13 |
14 | @RunWith(AndroidJUnit4.class)
15 | @LargeTest
16 | public class DetoxTest {
17 | @Rule
18 | public ActivityTestRule mActivityRule = new ActivityTestRule<>(MainActivity.class, false, false);
19 |
20 | @Test
21 | public void runDetoxTests() {
22 | DetoxConfig detoxConfig = new DetoxConfig();
23 | detoxConfig.idlePolicyConfig.masterTimeoutSec = 90;
24 | detoxConfig.idlePolicyConfig.idleResourceTimeoutSec = 60;
25 | detoxConfig.rnContextLoadTimeoutSec = (BuildConfig.DEBUG ? 180 : 60);
26 |
27 | Detox.runTests(mActivityRule, detoxConfig);
28 | }
29 | }
--------------------------------------------------------------------------------
/src/store/helpers.ts:
--------------------------------------------------------------------------------
1 | import {ProductInBasket} from './product';
2 |
3 | export const updateProductQuantity = (
4 | favoritedProducts: Array,
5 | productId: number,
6 | updateType: 'increase' | 'decrease',
7 | ) => {
8 | return favoritedProducts.map(favoritedProduct => {
9 | if (favoritedProduct.product.id === productId) {
10 | return {
11 | ...favoritedProduct,
12 | quantity:
13 | updateType === 'increase'
14 | ? favoritedProduct.quantity + 1
15 | : favoritedProduct.quantity - 1,
16 | };
17 | }
18 | return favoritedProduct;
19 | });
20 | };
21 |
22 | export const increaseFavoritedProductQuantity = (
23 | favoritedProducts: Array,
24 | productId: number,
25 | ) => {
26 | return updateProductQuantity(favoritedProducts, productId, 'increase');
27 | };
28 |
29 | export const decreaseFavoritedProductQuantity = (
30 | favoritedProducts: Array,
31 | productId: number,
32 | ) => {
33 | return updateProductQuantity(favoritedProducts, productId, 'decrease');
34 | };
35 |
--------------------------------------------------------------------------------
/ios/ReactNativeZustandRQ/Images.xcassets/AppIcon.appiconset/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "images" : [
3 | {
4 | "idiom" : "iphone",
5 | "scale" : "2x",
6 | "size" : "20x20"
7 | },
8 | {
9 | "idiom" : "iphone",
10 | "scale" : "3x",
11 | "size" : "20x20"
12 | },
13 | {
14 | "idiom" : "iphone",
15 | "scale" : "2x",
16 | "size" : "29x29"
17 | },
18 | {
19 | "idiom" : "iphone",
20 | "scale" : "3x",
21 | "size" : "29x29"
22 | },
23 | {
24 | "idiom" : "iphone",
25 | "scale" : "2x",
26 | "size" : "40x40"
27 | },
28 | {
29 | "idiom" : "iphone",
30 | "scale" : "3x",
31 | "size" : "40x40"
32 | },
33 | {
34 | "idiom" : "iphone",
35 | "scale" : "2x",
36 | "size" : "60x60"
37 | },
38 | {
39 | "idiom" : "iphone",
40 | "scale" : "3x",
41 | "size" : "60x60"
42 | },
43 | {
44 | "idiom" : "ios-marketing",
45 | "scale" : "1x",
46 | "size" : "1024x1024"
47 | }
48 | ],
49 | "info" : {
50 | "author" : "xcode",
51 | "version" : 1
52 | }
53 | }
54 |
--------------------------------------------------------------------------------
/android/app/src/main/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
14 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
--------------------------------------------------------------------------------
/src/utils/layout.ts:
--------------------------------------------------------------------------------
1 | import {Dimensions} from 'react-native';
2 |
3 | const {width: SCREEN_WIDTH, height: SCREEN_HEIGHT} = Dimensions.get('window');
4 |
5 | /**
6 | *
7 | * @param percentage string or number
8 | * @function
9 | * @description takes percentage (string or number) as parameter and returns calculated percentage size as number
10 | * @returns window width
11 | */
12 |
13 | export const getWindowWidth = (percentage: string | number): number => {
14 | if (typeof percentage === 'number') {
15 | return SCREEN_WIDTH * (percentage / 100);
16 | } else {
17 | return SCREEN_WIDTH * (Number(percentage.replace('%', '')) / 100);
18 | }
19 | };
20 |
21 | /**
22 | *
23 | * @param percentage string or number
24 | * @function
25 | * @description takes percentage (string or number) as parameter and returns calculated percentage size as number
26 | * @returns window height
27 | */
28 |
29 | export const getWindowHeight = (percentage: string | number): number => {
30 | if (typeof percentage === 'number') {
31 | return SCREEN_HEIGHT * (percentage / 100);
32 | } else {
33 | return SCREEN_HEIGHT * (Number(percentage.replace('%', '')) / 100);
34 | }
35 | };
36 |
--------------------------------------------------------------------------------
/src/app.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | import {DefaultTheme, NavigationContainer} from '@react-navigation/native';
4 | import {GestureHandlerRootView} from 'react-native-gesture-handler';
5 | import {SafeAreaProvider} from 'react-native-safe-area-context';
6 | import {QueryClient, QueryClientProvider} from 'react-query';
7 | import ErrorBoundary from './components/error-boundary';
8 | import ProductStack from './navigation/product-stack';
9 | import {COMMON_STYLES} from './styles/common-styles';
10 |
11 | export const queryClient = new QueryClient();
12 |
13 | export default function App() {
14 | return (
15 |
16 |
17 |
18 |
19 |
24 |
25 |
26 |
27 |
28 |
29 |
30 | );
31 | }
32 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # OSX
2 | #
3 | .DS_Store
4 |
5 | # coverage
6 | coverage
7 |
8 | # Xcode
9 | #
10 | build/
11 | *.pbxuser
12 | !default.pbxuser
13 | *.mode1v3
14 | !default.mode1v3
15 | *.mode2v3
16 | !default.mode2v3
17 | *.perspectivev3
18 | !default.perspectivev3
19 | xcuserdata
20 | *.xccheckout
21 | *.moved-aside
22 | DerivedData
23 | *.hmap
24 | *.ipa
25 | *.xcuserstate
26 | ios/.xcode.env.local
27 |
28 | # Android/IntelliJ
29 | #
30 | build/
31 | .idea
32 | .gradle
33 | local.properties
34 | *.iml
35 | *.hprof
36 | .cxx/
37 | *.keystore
38 | !debug.keystore
39 |
40 | # node.js
41 | #
42 | node_modules/
43 | npm-debug.log
44 | yarn-error.log
45 |
46 | # fastlane
47 | #
48 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
49 | # screenshots whenever they are needed.
50 | # For more information about the recommended setup visit:
51 | # https://docs.fastlane.tools/best-practices/source-control/
52 |
53 | **/fastlane/report.xml
54 | **/fastlane/Preview.html
55 | **/fastlane/screenshots
56 | **/fastlane/test_output
57 |
58 | # Bundle artifact
59 | *.jsbundle
60 |
61 | # Ruby / CocoaPods
62 | /ios/Pods/
63 | /vendor/bundle/
64 |
65 | # Temporary files created by Metro to check the health of the file watcher
66 | .metro-health-check*
67 |
--------------------------------------------------------------------------------
/ios/ReactNativeZustandRQ/AppDelegate.mm:
--------------------------------------------------------------------------------
1 | #import "AppDelegate.h"
2 |
3 | #import
4 |
5 | @implementation AppDelegate
6 |
7 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
8 | {
9 | self.moduleName = @"ReactNativeZustandRQ";
10 | // You can add your custom initial props in the dictionary below.
11 | // They will be passed down to the ViewController used by React Native.
12 | self.initialProps = @{};
13 |
14 | return [super application:application didFinishLaunchingWithOptions:launchOptions];
15 | }
16 |
17 | - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
18 | {
19 | #if DEBUG
20 | return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
21 | #else
22 | return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
23 | #endif
24 | }
25 |
26 | /// This method controls whether the `concurrentRoot`feature of React18 is turned on or off.
27 | ///
28 | /// @see: https://reactjs.org/blog/2022/03/29/react-v18.html
29 | /// @note: This requires to be rendering on Fabric (i.e. on the New Architecture).
30 | /// @return: `true` if the `concurrentRoot` feature is enabled. Otherwise, it returns `false`.
31 | - (BOOL)concurrentRootEnabled
32 | {
33 | return true;
34 | }
35 |
36 | @end
37 |
--------------------------------------------------------------------------------
/__mocks__/msw/handlers.ts:
--------------------------------------------------------------------------------
1 | import {rest} from 'msw';
2 | import {setupServer} from 'msw/node';
3 | import {BASE_URL} from '../../src/api/axios.instance';
4 | import {
5 | GET_ALL_PRODUCTS_MOCK_RESPONSE,
6 | GET_PRODUCT_BY_ID_MOCK_RESPONSE,
7 | } from './mock-data';
8 |
9 | const getAllProductsUrl = BASE_URL + '/products';
10 | const getProductByIdUrl = BASE_URL + `/products/:id`;
11 |
12 | const getAllProductsHandler = rest.get(getAllProductsUrl, (_req, res, ctx) => {
13 | return res(ctx.status(200), ctx.json(GET_ALL_PRODUCTS_MOCK_RESPONSE));
14 | });
15 |
16 | const getProductByIdHandler = rest.get(getProductByIdUrl, (_req, res, ctx) => {
17 | return res(ctx.status(200), ctx.json(GET_PRODUCT_BY_ID_MOCK_RESPONSE));
18 | });
19 |
20 | const handlers = [getAllProductsHandler, getProductByIdHandler];
21 |
22 | export const mswServer = setupServer(...handlers);
23 |
24 | const getAllProductsFailedHandler = rest.get(
25 | getAllProductsUrl,
26 | (_req, res, ctx) => {
27 | return res(ctx.status(500));
28 | },
29 | );
30 |
31 | const getProductByIdFailedHandler = rest.get(
32 | getProductByIdUrl,
33 | (_req, res, ctx) => {
34 | return res(ctx.status(500));
35 | },
36 | );
37 |
38 | export const setupGetAllProductsFailedHandler = () =>
39 | mswServer.use(getAllProductsFailedHandler);
40 |
41 | export const setupGetProductByIdFailedHandler = () =>
42 | mswServer.use(getProductByIdFailedHandler);
43 |
--------------------------------------------------------------------------------
/src/components/basket-icon.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import {Pressable, StyleSheet, Text, View} from 'react-native';
3 | import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
4 |
5 | type Props = {
6 | onPress: () => void;
7 | productCount: number;
8 | };
9 |
10 | const BasketIcon: React.FC = ({onPress, productCount}) => {
11 | return (
12 |
13 | {productCount > 0 && (
14 |
15 |
18 | {productCount}
19 |
20 |
21 | )}
22 |
23 |
29 |
30 | );
31 | };
32 |
33 | export default BasketIcon;
34 |
35 | const styles = StyleSheet.create({
36 | productCountText: {
37 | color: 'white',
38 | fontSize: 12,
39 | },
40 | productCountTextContainer: {
41 | top: -6,
42 | backgroundColor: 'darkslateblue',
43 | borderRadius: 999,
44 | height: 18,
45 | justifyContent: 'center',
46 | alignItems: 'center',
47 | width: 18,
48 | right: -10,
49 | position: 'absolute',
50 | },
51 | });
52 |
--------------------------------------------------------------------------------
/android/app/src/main/java/com/reactnativezustandrq/MainActivity.java:
--------------------------------------------------------------------------------
1 | package com.reactnativezustandrq;
2 | import android.os.Bundle;
3 | import com.facebook.react.ReactActivity;
4 | import com.facebook.react.ReactActivityDelegate;
5 | import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint;
6 | import com.facebook.react.defaults.DefaultReactActivityDelegate;
7 |
8 | public class MainActivity extends ReactActivity {
9 |
10 | /**
11 | * Returns the name of the main component registered from JavaScript. This is used to schedule
12 | * rendering of the component.
13 | */
14 |
15 | @Override
16 | protected void onCreate(Bundle savedInstanceState) {
17 | super.onCreate(null);
18 | }
19 |
20 | @Override
21 | protected String getMainComponentName() {
22 | return "ReactNativeZustandRQ";
23 | }
24 |
25 | /**
26 | * Returns the instance of the {@link ReactActivityDelegate}. Here we use a util class {@link
27 | * DefaultReactActivityDelegate} which allows you to easily enable Fabric and Concurrent React
28 | * (aka React 18) with two boolean flags.
29 | */
30 | @Override
31 | protected ReactActivityDelegate createReactActivityDelegate() {
32 | return new DefaultReactActivityDelegate(
33 | this,
34 | getMainComponentName(),
35 | // If you opted-in for the New Architecture, we enable the Fabric Renderer.
36 | DefaultNewArchitectureEntryPoint.getFabricEnabled(), // fabricEnabled
37 | // If you opted-in for the New Architecture, we enable Concurrent React (i.e. React 18).
38 | DefaultNewArchitectureEntryPoint.getConcurrentReactEnabled() // concurrentRootEnabled
39 | );
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/android/gradle.properties:
--------------------------------------------------------------------------------
1 | # Project-wide Gradle settings.
2 |
3 | # IDE (e.g. Android Studio) users:
4 | # Gradle settings configured through the IDE *will override*
5 | # any settings specified in this file.
6 |
7 | # For more details on how to configure your build environment visit
8 | # http://www.gradle.org/docs/current/userguide/build_environment.html
9 |
10 | # Specifies the JVM arguments used for the daemon process.
11 | # The setting is particularly useful for tweaking memory settings.
12 | # Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
13 | org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
14 |
15 | # When configured, Gradle will run in incubating parallel mode.
16 | # This option should only be used with decoupled projects. More details, visit
17 | # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
18 | # org.gradle.parallel=true
19 |
20 | # AndroidX package structure to make it clearer which packages are bundled with the
21 | # Android operating system, and which are packaged with your app's APK
22 | # https://developer.android.com/topic/libraries/support-library/androidx-rn
23 | android.useAndroidX=true
24 | # Automatically convert third-party libraries to use AndroidX
25 | android.enableJetifier=true
26 |
27 | # Version of flipper SDK to use with React Native
28 | FLIPPER_VERSION=0.125.0
29 |
30 | # Use this property to specify which architecture you want to build.
31 | # You can also override it from the CLI using
32 | # ./gradlew -PreactNativeArchitectures=x86_64
33 | reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
34 |
35 | # Use this property to enable support to the new architecture.
36 | # This will allow you to use TurboModules and the Fabric render in
37 | # your application. You should enable this flag either if you want
38 | # to write custom TurboModules/Fabric components OR use libraries that
39 | # are providing them.
40 | newArchEnabled=false
41 |
42 | # Use this property to enable or disable the Hermes JS engine.
43 | # If set to false, you will be using JSC instead.
44 | hermesEnabled=true
45 |
--------------------------------------------------------------------------------
/android/app/src/main/res/drawable/rn_edit_text_material.xml:
--------------------------------------------------------------------------------
1 |
2 |
16 |
21 |
22 |
23 |
32 | This source code is licensed under the MIT license found in the LICENSE file in the root
5 | * directory of this source tree.
6 | */
7 | package com.reactnativezustandrq;
8 |
9 | import android.content.Context;
10 | import com.facebook.flipper.android.AndroidFlipperClient;
11 | import com.facebook.flipper.android.utils.FlipperUtils;
12 | import com.facebook.flipper.core.FlipperClient;
13 | import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
14 | import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
15 | import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
16 | import com.facebook.flipper.plugins.inspector.DescriptorMapping;
17 | import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
18 | import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
19 | import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
20 | import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
21 | import com.facebook.react.ReactInstanceEventListener;
22 | import com.facebook.react.ReactInstanceManager;
23 | import com.facebook.react.bridge.ReactContext;
24 | import com.facebook.react.modules.network.NetworkingModule;
25 | import okhttp3.OkHttpClient;
26 |
27 | /**
28 | * Class responsible of loading Flipper inside your React Native application. This is the debug
29 | * flavor of it. Here you can add your own plugins and customize the Flipper setup.
30 | */
31 | public class ReactNativeFlipper {
32 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
33 | if (FlipperUtils.shouldEnableFlipper(context)) {
34 | final FlipperClient client = AndroidFlipperClient.getInstance(context);
35 |
36 | client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
37 | client.addPlugin(new DatabasesFlipperPlugin(context));
38 | client.addPlugin(new SharedPreferencesFlipperPlugin(context));
39 | client.addPlugin(CrashReporterPlugin.getInstance());
40 |
41 | NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
42 | NetworkingModule.setCustomClientBuilder(
43 | new NetworkingModule.CustomClientBuilder() {
44 | @Override
45 | public void apply(OkHttpClient.Builder builder) {
46 | builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
47 | }
48 | });
49 | client.addPlugin(networkFlipperPlugin);
50 | client.start();
51 |
52 | // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
53 | // Hence we run if after all native modules have been initialized
54 | ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
55 | if (reactContext == null) {
56 | reactInstanceManager.addReactInstanceEventListener(
57 | new ReactInstanceEventListener() {
58 | @Override
59 | public void onReactContextInitialized(ReactContext reactContext) {
60 | reactInstanceManager.removeReactInstanceEventListener(this);
61 | reactContext.runOnNativeModulesQueueThread(
62 | new Runnable() {
63 | @Override
64 | public void run() {
65 | client.addPlugin(new FrescoFlipperPlugin());
66 | }
67 | });
68 | }
69 | });
70 | } else {
71 | client.addPlugin(new FrescoFlipperPlugin());
72 | }
73 | }
74 | }
75 | }
76 |
--------------------------------------------------------------------------------
/ios/ReactNativeZustandRQ.xcodeproj/xcshareddata/xcschemes/ReactNativeZustandRQ.xcscheme:
--------------------------------------------------------------------------------
1 |
2 |
5 |
8 |
9 |
15 |
21 |
22 |
23 |
24 |
25 |
30 |
31 |
33 |
39 |
40 |
41 |
42 |
43 |
53 |
55 |
61 |
62 |
63 |
64 |
70 |
72 |
78 |
79 |
80 |
81 |
83 |
84 |
87 |
88 |
89 |
--------------------------------------------------------------------------------
/src/screens/product-list.tsx:
--------------------------------------------------------------------------------
1 | import {DefaultTheme} from '@react-navigation/native';
2 | import * as React from 'react';
3 | import {
4 | FlatList,
5 | ListRenderItemInfo,
6 | RefreshControl,
7 | StyleSheet,
8 | Text,
9 | View,
10 | } from 'react-native';
11 | import {SafeAreaView} from 'react-native-safe-area-context';
12 | import {Product, useGetAllProducts} from '../api/product';
13 | import ProductListCard from '../components/product-list-card';
14 | import ScreenLoading from '../components/screen-loading';
15 | import Spacing from '../components/spacing';
16 | import useRefreshByUser from '../hooks/useRefreshByUser';
17 | import {RouteNames} from '../navigation/route-names';
18 | import {ProductListScreenProps} from '../navigation/types';
19 | import {useProductActions, useProductsInBasket} from '../store/product';
20 | import {COMMON_STYLES} from '../styles/common-styles';
21 |
22 | type Props = ProductListScreenProps;
23 |
24 | const ProductListScreen: React.FC = ({navigation}) => {
25 | const {data, isLoading, refetch, isError, isSuccess} = useGetAllProducts();
26 |
27 | const {isRefetchingByUser, refetchByUser} = useRefreshByUser(refetch);
28 |
29 | const {addProductToBasket, removeProductFromBasket} = useProductActions();
30 | const productsInBasket = useProductsInBasket();
31 |
32 | const onAddToBasketPress = React.useCallback(
33 | (product: Product) => () => {
34 | if (
35 | productsInBasket.find(
36 | productInBasket => productInBasket.product.id === product.id,
37 | )
38 | ) {
39 | removeProductFromBasket(product.id);
40 | } else {
41 | addProductToBasket(product);
42 | }
43 | },
44 | [addProductToBasket, productsInBasket, removeProductFromBasket],
45 | );
46 |
47 | const onProductCardPress = React.useCallback(
48 | (productId: number) => () => {
49 | navigation.navigate(RouteNames.productDetail, {id: productId});
50 | },
51 | [navigation],
52 | );
53 |
54 | const renderItemSeparator = () => (
55 |
59 | );
60 |
61 | const getKeyExtractor = (item: Product) => item.id.toString();
62 |
63 | const renderItem = ({item: product}: ListRenderItemInfo) => {
64 | return (
65 | productInBasket.product.id === product.id,
72 | ) !== 'undefined'
73 | }
74 | onAddToBasketPress={onAddToBasketPress(product)}
75 | onPress={onProductCardPress(product.id)}
76 | />
77 | );
78 | };
79 |
80 | if (isLoading) {
81 | return ;
82 | }
83 |
84 | return (
85 |
86 | {isError && (
87 |
88 | An error occurred
89 |
90 | )}
91 |
92 | {isSuccess && (
93 |
94 | data={data}
95 | testID="product-list-flat-list"
96 | refreshControl={
97 |
101 | }
102 | renderItem={renderItem}
103 | numColumns={2}
104 | ItemSeparatorComponent={renderItemSeparator}
105 | columnWrapperStyle={styles.columnWrapper}
106 | contentContainerStyle={styles.contentContainerStyle}
107 | showsVerticalScrollIndicator={false}
108 | keyExtractor={getKeyExtractor}
109 | style={COMMON_STYLES.flex}
110 | />
111 | )}
112 |
113 | );
114 | };
115 |
116 | export default ProductListScreen;
117 |
118 | const styles = StyleSheet.create({
119 | contentContainerStyle: {
120 | flexGrow: 1,
121 | padding: COMMON_STYLES.screenPadding,
122 | },
123 | columnWrapper: {
124 | justifyContent: 'space-between',
125 | },
126 | });
127 |
--------------------------------------------------------------------------------
/ios/ReactNativeZustandRQ/LaunchScreen.storyboard:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
24 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/src/screens/basket.tsx:
--------------------------------------------------------------------------------
1 | import {DefaultTheme} from '@react-navigation/native';
2 | import * as React from 'react';
3 | import {
4 | FlatList,
5 | ListRenderItemInfo,
6 | StyleSheet,
7 | Text,
8 | View,
9 | } from 'react-native';
10 | import BasketCard from '../components/basket-card';
11 | import DeleteIcon from '../components/delete-icon';
12 | import Spacing from '../components/spacing';
13 | import {ProductListScreenProps} from '../navigation/types';
14 | import {
15 | ProductInBasket,
16 | useProductActions,
17 | useProductsInBasket,
18 | } from '../store/product';
19 | import {COMMON_STYLES} from '../styles/common-styles';
20 | import {getBasketTotalPrice} from '../utils/get-basket-total-price';
21 | import {getWindowHeight} from '../utils/layout';
22 |
23 | type Props = ProductListScreenProps;
24 |
25 | const BasketScreen: React.FC = ({navigation}) => {
26 | const {
27 | increaseProductQuantityInBasket,
28 | decreaseProductQuantityInBasket,
29 | removeProductFromBasket,
30 | resetAllProductsInBasket,
31 | } = useProductActions();
32 |
33 | const productsInBasket = useProductsInBasket();
34 |
35 | React.useEffect(() => {
36 | if (productsInBasket.length > 0) {
37 | navigation.setOptions({
38 | headerRight: () => ,
39 | });
40 | }
41 | }, [productsInBasket.length, navigation, resetAllProductsInBasket]);
42 |
43 | const renderBasketItem = ({
44 | item: {product, quantity},
45 | }: ListRenderItemInfo) => {
46 | return (
47 |
53 | increaseProductQuantityInBasket(product.id)
54 | }
55 | onDecreaseQuantityPress={() => {
56 | if (quantity === 1) {
57 | removeProductFromBasket(product.id);
58 | } else {
59 | decreaseProductQuantityInBasket(product.id);
60 | }
61 | }}
62 | />
63 | );
64 | };
65 |
66 | const renderSeparatorComponent = () => (
67 |
68 | );
69 |
70 | const getKeyExtractor = (item: ProductInBasket) => item.product.id.toString();
71 |
72 | const renderListEmptyComponent = () => (
73 |
74 | Your basket is empty
75 |
76 | );
77 |
78 | return (
79 |
80 |
91 |
92 | {productsInBasket.length > 0 && (
93 |
94 | {'Total Price: '}
95 |
96 | $ {getBasketTotalPrice(productsInBasket)}
97 |
98 |
99 | )}
100 |
101 | );
102 | };
103 |
104 | export default BasketScreen;
105 |
106 | const styles = StyleSheet.create({
107 | root: {
108 | flex: 1,
109 | },
110 | safeArea: {
111 | flex: 1,
112 | backgroundColor: '#fff',
113 | },
114 | contentContainerStyle: {
115 | flexGrow: 1,
116 | backgroundColor: DefaultTheme.colors.background,
117 | padding: COMMON_STYLES.screenPadding,
118 | },
119 | basketItemsContainer: {
120 | flex: 1,
121 | justifyContent: 'flex-start',
122 | },
123 | summaryContainer: {
124 | height: getWindowHeight(10),
125 | width: '100%',
126 | borderTopColor: '#e2e2e2',
127 | borderTopWidth: 1,
128 | backgroundColor: '#fff',
129 | flexDirection: 'row',
130 | alignItems: 'flex-start',
131 | justifyContent: 'space-between',
132 | padding: COMMON_STYLES.screenPadding,
133 | },
134 | totalPrice: {
135 | fontSize: 18,
136 | textAlign: 'left',
137 | },
138 | priceText: {
139 | textAlign: 'right',
140 | fontSize: 18,
141 | width: 150,
142 | },
143 | });
144 |
--------------------------------------------------------------------------------
/src/screens/product-detail.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import {
3 | Button,
4 | Image,
5 | RefreshControl,
6 | ScrollView,
7 | StyleSheet,
8 | Text,
9 | View,
10 | } from 'react-native';
11 | import {SafeAreaView} from 'react-native-safe-area-context';
12 | import {useGetProductById} from '../api/product';
13 | import QuantityToggler from '../components/quantity-toggler';
14 | import ScreenLoading from '../components/screen-loading';
15 | import Spacing from '../components/spacing';
16 | import useRefreshByUser from '../hooks/useRefreshByUser';
17 | import {RouteNames} from '../navigation/route-names';
18 | import {ProductDetailScreenProps} from '../navigation/types';
19 | import {
20 | useProductActions,
21 | useProductInBasketQuantityById,
22 | } from '../store/product';
23 | import {COMMON_STYLES} from '../styles/common-styles';
24 | import {cutString} from '../utils/cut-string';
25 | import {getPriceText} from '../utils/get-price-text';
26 | import {getWindowHeight, getWindowWidth} from '../utils/layout';
27 |
28 | const VERTICAL_SPACING = 24;
29 | type Props = ProductDetailScreenProps;
30 |
31 | const ProductDetail: React.FC = ({navigation, route}) => {
32 | const {data, isLoading, refetch, isSuccess, isError} = useGetProductById(
33 | route.params.id,
34 | );
35 |
36 | const {isRefetchingByUser, refetchByUser} = useRefreshByUser(refetch);
37 |
38 | const {
39 | increaseProductQuantityInBasket,
40 | decreaseProductQuantityInBasket,
41 | addProductToBasket,
42 | removeProductFromBasket,
43 | } = useProductActions();
44 |
45 | const productQuantity = useProductInBasketQuantityById(data?.id);
46 |
47 | React.useEffect(() => {
48 | if (data?.title) {
49 | navigation.setOptions({
50 | headerTitle: cutString(data?.title),
51 | });
52 | }
53 | }, [data?.title, navigation]);
54 |
55 | if (isLoading) {
56 | return ;
57 | }
58 |
59 | return (
60 |
61 | {isError && (
62 |
63 | An error occurred
64 |
65 | )}
66 |
67 | {isSuccess && (
68 |
75 | }
76 | contentContainerStyle={styles.contentContainerStyle}
77 | showsVerticalScrollIndicator={false}
78 | style={COMMON_STYLES.flex}>
79 |
80 |
81 |
87 |
88 |
89 |
90 |
91 | {data?.title}
92 |
93 |
94 |
95 |
96 |
97 | {getPriceText(data!.price)}
98 |
99 | {
104 | if (data?.id) {
105 | // item has not been added to basket yet
106 | if (typeof productQuantity === 'undefined') {
107 | addProductToBasket(data);
108 | } else {
109 | increaseProductQuantityInBasket(data.id);
110 | }
111 | }
112 | }}
113 | onDecreaseQuantityPress={() => {
114 | if (data?.id) {
115 | // item has quantity of 1, means its time to remove the item from the basket
116 | if (productQuantity === 1) {
117 | removeProductFromBasket(data.id);
118 | } else {
119 | decreaseProductQuantityInBasket(data.id);
120 | }
121 | }
122 | }}
123 | />
124 |
125 |
126 |
127 |
128 | {data?.description}
129 |
130 |
131 | )}
132 |
133 |
140 | );
141 | };
142 |
143 | export default ProductDetail;
144 |
145 | const styles = StyleSheet.create({
146 | safeArea: {
147 | flex: 1,
148 | backgroundColor: '#fff',
149 | },
150 | contentContainerStyle: {
151 | flexGrow: 1,
152 | paddingVertical: COMMON_STYLES.screenPadding,
153 | backgroundColor: '#fff',
154 | },
155 | image: {
156 | justifyContent: 'flex-end',
157 | backgroundColor: '#fff',
158 | width: getWindowWidth(100),
159 | height: getWindowHeight(25),
160 | },
161 | infoContainer: {
162 | borderTopWidth: 1,
163 | paddingHorizontal: COMMON_STYLES.screenPadding,
164 | paddingTop: COMMON_STYLES.screenPadding,
165 | borderColor: '#e2e2e2',
166 | },
167 | infoText: {
168 | fontSize: 16,
169 | },
170 | title: {
171 | fontSize: 20,
172 | },
173 | quantityTogglerContainer: {
174 | flexDirection: 'row',
175 | justifyContent: 'space-between',
176 | alignItems: 'center',
177 | },
178 | quantityToggler: {
179 | flex: 0.5,
180 | },
181 | });
182 |
--------------------------------------------------------------------------------
/e2e/starter.test.js:
--------------------------------------------------------------------------------
1 | describe('Example', () => {
2 | beforeAll(async () => {
3 | await device.launchApp({
4 | newInstance: true,
5 | });
6 | });
7 |
8 | beforeEach(async () => {
9 | await device.reloadReactNative();
10 | });
11 |
12 | test('complete app flow', async () => {
13 | // wait for product flat list to be visible with timeout of 6000ms
14 | // 6000ms can vary depending on the network, since we fetch the data from https://fakestoreapi.com
15 | // and server might not be stable all the time
16 | await waitFor(element(by.id('product-list-flat-list')))
17 | .toBeVisible()
18 | .withTimeout(6000);
19 |
20 | // it expects first product list card to be visible
21 | await expect(element(by.id('product-list-card-1'))).toBeVisible();
22 |
23 | // scroll to the end of the product list
24 | await element(by.id('product-list-flat-list')).scrollTo('bottom');
25 |
26 | // it expects last item of the product list to be visible after scrolling to the bottom
27 | await expect(element(by.id('product-list-card-20'))).toBeVisible();
28 |
29 | // scroll to top of the product list
30 | await element(by.id('product-list-flat-list')).scrollTo('top');
31 |
32 | // tap heart button of the first product list item in order to add product to the basket
33 | await element(by.id('basket-button-1')).tap();
34 |
35 | // tap heart button of the third product list item in order to add product to the basket
36 | await element(by.id('basket-button-3')).tap();
37 |
38 | // tap basket icon in order to navigate to basket screen
39 | await element(by.id('basket-icon')).tap();
40 |
41 | // it expects basket card of first product to be visible
42 | await waitFor(element(by.id('basket-card-1')))
43 | .toBeVisible()
44 | .withTimeout(1000);
45 |
46 | // it expects basket card of third product to be visible
47 | await expect(element(by.id('basket-card-3'))).toBeVisible();
48 |
49 | // increase quantity of the first product item by tapping + button in basket screen
50 | await element(by.id('increase-quantity-btn-1')).tap();
51 |
52 | // increase quantity of the first product item by tapping + button in basket screen
53 | await element(by.id('increase-quantity-btn-1')).tap();
54 |
55 | // it expects first product's quantity toggler component to have text of 3
56 | // since it has been added in product list with count of 1, and its quantity is increased by 2 in the basket screen/above
57 | await expect(element(by.id('quantity-toggler-value-1'))).toHaveText('3');
58 |
59 | // decrease first product quantity
60 | await element(by.id('decrease-quantity-btn-1')).tap();
61 |
62 | // it expects first product's quantity toggler component to have text of 2 since it is decreased by 1 above
63 | await expect(element(by.id('quantity-toggler-value-1'))).toHaveText('2');
64 |
65 | // increase quantity of the third product item by tapping + button in basket screen
66 | await element(by.id('increase-quantity-btn-3')).tap();
67 |
68 | // increase quantity of the third product item by tapping + button in basket screen
69 | await element(by.id('increase-quantity-btn-3')).tap();
70 |
71 | // it expects third product's quantity toggler component to have text of 3
72 | await expect(element(by.id('quantity-toggler-value-3'))).toHaveText('3');
73 |
74 | // decrease quantity of the third product item by tapping - button in basket screen
75 | await element(by.id('decrease-quantity-btn-3')).tap();
76 |
77 | // decrease quantity of the third product item by tapping - button in basket screen
78 | await element(by.id('decrease-quantity-btn-3')).tap();
79 |
80 | // decrease quantity of the third product item by tapping - button in basket screen
81 | await element(by.id('decrease-quantity-btn-3')).tap();
82 |
83 | // third product item is removed from the basket since its quantity its decreased by 3 times above
84 | await waitFor(element(by.id('basket-card-3')))
85 | .not.toBeVisible()
86 | .withTimeout(1000);
87 |
88 | // tap basket screen delete icon in the header right
89 | await element(by.id('basket-delete-icon')).tap();
90 |
91 | // it expects your basket is empty text to be visible after tapping basket delete icon
92 | await waitFor(element(by.text('Your basket is empty')))
93 | .toBeVisible()
94 | .withTimeout(1000);
95 |
96 | // tap basket screen header left to navigate back
97 | await element(by.id('basket-screen-header-left-btn')).tap();
98 |
99 | // it expects fourth product list item to be visible
100 | await waitFor(element(by.id('product-list-card-4')))
101 | .toBeVisible()
102 | .withTimeout(700);
103 |
104 | // tap fourth product list item
105 | await element(by.id('product-list-card-4')).tap();
106 |
107 | // it expects product detail image to be visible after tapping to the product item
108 | await waitFor(element(by.id('product-detail-image')))
109 | .toBeVisible()
110 | .withTimeout(700);
111 |
112 | // tap twice to increase quantity of fourth product item in product detail screen
113 | await element(by.id('increase-quantity-btn-4')).tap();
114 | await element(by.id('increase-quantity-btn-4')).tap();
115 |
116 | // it expects fourth product's quantity toggler component to have text of 1
117 | await expect(element(by.id('quantity-toggler-value-4'))).toHaveText('2');
118 |
119 | // tap to decrease quantity of fourth product item in product detail screen
120 | await element(by.id('decrease-quantity-btn-4')).tap();
121 |
122 | // it expects fourth product's quantity toggler component to have text of 1
123 | await expect(element(by.id('quantity-toggler-value-4'))).toHaveText('1');
124 |
125 | // tap go to basket button in order to navigate to basket screen from product detail screen
126 | await element(by.id('product-detail-go-to-basket-btn')).tap();
127 |
128 | // it expects fourth product item basket card to be visible since it has been added to the basket in above
129 | await waitFor(element(by.id('basket-card-4')))
130 | .toBeVisible()
131 | .withTimeout(1000);
132 |
133 | // it expects fourth product's quantity toggler component to have text of 1 in the basket screen
134 | await expect(element(by.id('quantity-toggler-value-4'))).toHaveText('1');
135 | });
136 | });
137 |
--------------------------------------------------------------------------------
/src/screens/__tests__/basket.test.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | fireEvent,
3 | render,
4 | screen,
5 | waitFor,
6 | } from '@testing-library/react-native';
7 | import React from 'react';
8 | import {GET_ALL_PRODUCTS_MOCK_RESPONSE} from '../../../__mocks__/msw/mock-data';
9 | import {useProductsInBasket} from '../../store/product';
10 | import {getBasketTotalPrice} from '../../utils/get-basket-total-price';
11 | import {createReactQueryWrapper} from '../../utils/testing';
12 | import BasketScreen from '../basket';
13 |
14 | const increaseProductQuantityInBasketMock = jest.fn();
15 | const decreaseProductQuantityInBasketMock = jest.fn();
16 | const addProductToBasketMock = jest.fn();
17 | const removeProductFromBasketMock = jest.fn();
18 |
19 | const favoritedProducts = GET_ALL_PRODUCTS_MOCK_RESPONSE.map(product => ({
20 | product,
21 | quantity: Math.floor(Math.random() * 10) + 1,
22 | }));
23 |
24 | jest.mock('../../store/product', () => ({
25 | useProductActions: () => ({
26 | increaseProductQuantityInBasket: increaseProductQuantityInBasketMock,
27 | decreaseProductQuantityInBasket: decreaseProductQuantityInBasketMock,
28 | addProductToBasket: addProductToBasketMock,
29 | removeProductFromBasket: removeProductFromBasketMock,
30 | }),
31 | useProductsInBasket: jest.fn(),
32 | }));
33 |
34 | const navigateMock = jest.fn();
35 | const setOptionsMock = jest.fn();
36 | const navigation = {navigate: navigateMock, setOptions: setOptionsMock} as any;
37 | const route = jest.fn() as any;
38 |
39 | const component = ;
40 |
41 | describe('Basket screen', () => {
42 | it('should display all basket list data correctly', async () => {
43 | (useProductsInBasket as jest.Mock).mockImplementation(
44 | () => favoritedProducts,
45 | );
46 |
47 | render(component, {wrapper: createReactQueryWrapper});
48 |
49 | const eventData = {
50 | nativeEvent: {
51 | contentOffset: {
52 | y: 500,
53 | },
54 | contentSize: {
55 | height: 500,
56 | width: 100,
57 | },
58 | layoutMeasurement: {
59 | height: 100,
60 | width: 100,
61 | },
62 | },
63 | };
64 |
65 | // first 10 item will be visible on initial render
66 | for (const {
67 | product: {id},
68 | } of favoritedProducts.slice(0, favoritedProducts.length / 2)) {
69 | expect(await screen.getByTestId(`basket-card-${id}`)).toBeTruthy();
70 | }
71 |
72 | // scroll down to render remaining items
73 | fireEvent.scroll(screen.getByTestId('basket-screen-flat-list'), eventData);
74 |
75 | await waitFor(async () => {
76 | for (const {
77 | product: {id},
78 | } of favoritedProducts.slice(10, favoritedProducts.length)) {
79 | expect(await screen.getByTestId(`basket-card-${id}`)).toBeTruthy();
80 | }
81 | });
82 | });
83 |
84 | it('should set navigation header right component if there is at least one item in the basket', async () => {
85 | (useProductsInBasket as jest.Mock).mockImplementation(
86 | () => favoritedProducts,
87 | );
88 |
89 | render(component, {wrapper: createReactQueryWrapper});
90 |
91 | expect(setOptionsMock).toHaveBeenCalled();
92 | });
93 |
94 | it('should display basket total price correctly', async () => {
95 | render(component, {wrapper: createReactQueryWrapper});
96 |
97 | expect(
98 | screen.findByText(`$ ${getBasketTotalPrice(favoritedProducts)}`),
99 | ).toBeTruthy();
100 | });
101 |
102 | it('should not display basket total price when there is no items in the basket', async () => {
103 | (useProductsInBasket as jest.Mock).mockImplementation(() => []);
104 |
105 | render(component, {wrapper: createReactQueryWrapper});
106 |
107 | expect(
108 | screen.queryByText(`$ ${getBasketTotalPrice(favoritedProducts)}`),
109 | ).not.toBeTruthy();
110 | });
111 |
112 | it('should display empty basket when there is no item in the basket', async () => {
113 | (useProductsInBasket as jest.Mock).mockImplementation(() => []);
114 |
115 | render(component, {wrapper: createReactQueryWrapper});
116 |
117 | expect(screen.findByText(`Your basket is empty`)).toBeTruthy();
118 | });
119 |
120 | it('should increase quantity on pressing increase button', async () => {
121 | (useProductsInBasket as jest.Mock).mockImplementation(
122 | () => favoritedProducts,
123 | );
124 |
125 | render(component, {wrapper: createReactQueryWrapper});
126 |
127 | fireEvent.press(screen.getByTestId(`increase-quantity-btn-1`));
128 |
129 | expect(increaseProductQuantityInBasketMock).toHaveBeenCalledWith(
130 | favoritedProducts[0].product.id,
131 | );
132 | });
133 |
134 | it('should remove the product from the basket if quantity of the product equals to 1', async () => {
135 | (useProductsInBasket as jest.Mock).mockImplementation(() =>
136 | favoritedProducts.map(favoritedProduct => {
137 | // set first product quantity to 1
138 | if (favoritedProduct.product.id === 1) {
139 | return {
140 | ...favoritedProduct,
141 | product: favoritedProduct.product,
142 | quantity: 1,
143 | };
144 | }
145 | return favoritedProduct;
146 | }),
147 | );
148 |
149 | render(component, {wrapper: createReactQueryWrapper});
150 |
151 | fireEvent.press(screen.getByTestId(`decrease-quantity-btn-1`));
152 |
153 | expect(removeProductFromBasketMock).toHaveBeenCalledWith(
154 | favoritedProducts[0].product.id,
155 | );
156 | });
157 |
158 | it('should decrease the quantity of the product if its greater than 1', async () => {
159 | (useProductsInBasket as jest.Mock).mockImplementation(() =>
160 | favoritedProducts.map(favoritedProduct => {
161 | // set first product quantity to 2
162 | if (favoritedProduct.product.id === 1) {
163 | return {
164 | ...favoritedProduct,
165 | product: favoritedProduct.product,
166 | quantity: 2,
167 | };
168 | }
169 | return favoritedProduct;
170 | }),
171 | );
172 |
173 | render(component, {wrapper: createReactQueryWrapper});
174 |
175 | fireEvent.press(screen.getByTestId(`decrease-quantity-btn-1`));
176 |
177 | expect(decreaseProductQuantityInBasketMock).toHaveBeenCalledWith(
178 | favoritedProducts[0].product.id,
179 | );
180 | });
181 | });
182 |
--------------------------------------------------------------------------------
/src/screens/__tests__/product-list.test.tsx:
--------------------------------------------------------------------------------
1 | import {NavigationContainer} from '@react-navigation/native';
2 | import {renderHook} from '@testing-library/react-hooks';
3 | import {fireEvent, render, screen} from '@testing-library/react-native';
4 | import React from 'react';
5 | import {setupGetAllProductsFailedHandler} from '../../../__mocks__/msw/handlers';
6 | import {useGetAllProducts} from '../../api/product';
7 | import ProductStack from '../../navigation/product-stack';
8 | import {RouteNames} from '../../navigation/route-names';
9 | import {useProductStore} from '../../store/product';
10 | import {createReactQueryWrapper} from '../../utils/testing';
11 | import ProductListScreen from '../product-list';
12 |
13 | // We render the whole app stack instead of rendering just the screen
14 | // because we need access to the react-navigation's header, which wouldn't
15 | // be possible if we just rendered the screen.
16 | const rootAppComponent = (
17 |
18 |
19 |
20 | );
21 | const navigateMock = jest.fn();
22 | const navigation = {navigate: navigateMock} as any;
23 | const route = jest.fn() as any;
24 |
25 | const component = ;
26 |
27 | describe('Product list screen', () => {
28 | it('should display loading indicator initially', async () => {
29 | // We render the component and expect to see a loading indicator
30 | render(component, {wrapper: createReactQueryWrapper});
31 | expect(screen.queryByTestId(`screen-loader`)).toBeTruthy();
32 |
33 | // We render the product list using useGetAllProducts hook and wait until the products are loaded
34 | const {result, waitFor} = renderHook(() => useGetAllProducts(), {
35 | wrapper: createReactQueryWrapper,
36 | });
37 | await waitFor(() => result.current.isSuccess);
38 |
39 | // We expect the loading indicator to disappear after the products are loaded
40 | expect(screen.queryByTestId(`screen-loader`)).not.toBeTruthy();
41 | });
42 |
43 | it('should display product list data correctly', async () => {
44 | // Render the component and wait for it to load
45 | render(component, {wrapper: createReactQueryWrapper});
46 |
47 | // Check that no product card is rendered before fetching data
48 | expect(screen.queryByTestId(`product-list-card-1`)).not.toBeTruthy();
49 |
50 | // Fetch the product data
51 | const {result, waitFor} = renderHook(() => useGetAllProducts(), {
52 | wrapper: createReactQueryWrapper,
53 | });
54 |
55 | // Wait for the data to be fetched successfully
56 | await waitFor(() => result.current.isSuccess);
57 |
58 | // Check that each product card is rendered for each product in the data
59 | for (const {id} of result.current.data!) {
60 | expect(screen.queryByTestId(`product-list-card-${id}`)).toBeTruthy();
61 | }
62 | });
63 |
64 | it('should display error text in case get all products query fails', async () => {
65 | // Set up the mock handler for GET requests to the /products endpoint that returns an error response
66 | setupGetAllProductsFailedHandler();
67 |
68 | // Render the ProductListScreen component wrapped in the React Query wrapper
69 | render(component, {wrapper: createReactQueryWrapper});
70 |
71 | // Set up a mock React hook that calls the useGetAllProducts hook from the API module
72 | const {result, waitFor} = renderHook(() => useGetAllProducts(), {
73 | wrapper: createReactQueryWrapper,
74 | });
75 |
76 | // Wait for the useGetAllProducts hook to throw an error
77 | await waitFor(() => result.current.isError);
78 |
79 | // Assert that the "An error occurred" text is displayed on the screen
80 | expect(screen.getByText(`An error occurred`)).toBeTruthy();
81 | });
82 |
83 | it('should call navigation action on pressing the first product item', async () => {
84 | // Render the ProductListScreen component along with react-query wrapper
85 | render(component, {wrapper: createReactQueryWrapper});
86 |
87 | // Render the useGetAllProducts hook with react-query wrapper to fetch data
88 | const {result, waitFor} = renderHook(() => useGetAllProducts(), {
89 | wrapper: createReactQueryWrapper,
90 | });
91 |
92 | // Wait for the data to be fetched
93 | await waitFor(() => result.current.isSuccess);
94 |
95 | // Find the first product card in the list and simulate a press event on it
96 | const firstProductItem = screen.getByTestId(`product-list-card-1`);
97 | fireEvent.press(firstProductItem);
98 |
99 | // Expect that the navigation function is called with the correct route name and params
100 | expect(navigateMock).toHaveBeenCalledWith(RouteNames.productDetail, {
101 | id: 1,
102 | });
103 | });
104 |
105 | it('should add/remove product item correctly on pressing product items basket icon', async () => {
106 | // We render the entire app stack and use the createReactQueryWrapper as a
107 | // wrapper for the render function to set up the React Query Provider.
108 | render(rootAppComponent, {
109 | wrapper: createReactQueryWrapper,
110 | });
111 |
112 | // We use the renderHook function to invoke the useGetAllProducts hook which
113 | // fetches the data.
114 | const {result, waitFor} = renderHook(() => useGetAllProducts(), {
115 | wrapper: createReactQueryWrapper,
116 | });
117 |
118 | // We use the renderHook function to get access to the useProductStore hook
119 | // which we will use to check that the products in the basket were added/removed correctly.
120 | const {result: productStore} = renderHook(() => useProductStore(), {
121 | wrapper: createReactQueryWrapper,
122 | });
123 |
124 | // We wait for the useGetAllProducts hook to complete fetching the data before proceeding
125 | // with the test.
126 | await waitFor(() => result.current.isSuccess);
127 |
128 | // We get the basket button for the first product item using the getByTestId function.
129 | const firstProductItemBasketButton = screen.getByTestId(`basket-button-1`);
130 |
131 | // We click the basket button for the first product item.
132 | fireEvent.press(firstProductItemBasketButton);
133 |
134 | // We check that the basket icon quantity text is present using the getByTestId function.
135 | expect(screen.getByTestId('basket-icon-quantity-text-1')).toBeTruthy();
136 |
137 | // We check that the products in the basket have been added correctly using the productStore.
138 | expect(productStore.current.productsInBasket).toHaveLength(1);
139 | expect(productStore.current.productsInBasket[0].quantity).toBe(1);
140 | expect(productStore.current.productsInBasket[0].product).toMatchObject(
141 | result.current.data![0],
142 | );
143 |
144 | // We click the basket button for the first product item again to remove it from the basket.
145 | fireEvent.press(firstProductItemBasketButton);
146 |
147 | // We check that the basket icon quantity text is not present.
148 | expect(
149 | screen.queryByTestId('basket-icon-quantity-text-1'),
150 | ).not.toBeTruthy();
151 |
152 | // We check that the products in the basket have been removed correctly using the productStore.
153 | expect(productStore.current.productsInBasket).toHaveLength(0);
154 | });
155 | });
156 |
--------------------------------------------------------------------------------
/android/app/build.gradle:
--------------------------------------------------------------------------------
1 | apply plugin: "com.android.application"
2 | apply plugin: "com.facebook.react"
3 |
4 | import com.android.build.OutputFile
5 |
6 | /**
7 | * This is the configuration block to customize your React Native Android app.
8 | * By default you don't need to apply any configuration, just uncomment the lines you need.
9 | */
10 | react {
11 | /* Folders */
12 | // The root of your project, i.e. where "package.json" lives. Default is '..'
13 | // root = file("../")
14 | // The folder where the react-native NPM package is. Default is ../node_modules/react-native
15 | // reactNativeDir = file("../node_modules/react-native")
16 | // The folder where the react-native Codegen package is. Default is ../node_modules/react-native-codegen
17 | // codegenDir = file("../node_modules/react-native-codegen")
18 | // The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
19 | // cliFile = file("../node_modules/react-native/cli.js")
20 |
21 | /* Variants */
22 | // The list of variants to that are debuggable. For those we're going to
23 | // skip the bundling of the JS bundle and the assets. By default is just 'debug'.
24 | // If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
25 | // debuggableVariants = ["liteDebug", "prodDebug"]
26 |
27 | /* Bundling */
28 | // A list containing the node command and its flags. Default is just 'node'.
29 | // nodeExecutableAndArgs = ["node"]
30 | //
31 | // The command to run when bundling. By default is 'bundle'
32 | // bundleCommand = "ram-bundle"
33 | //
34 | // The path to the CLI configuration file. Default is empty.
35 | // bundleConfig = file(../rn-cli.config.js)
36 | //
37 | // The name of the generated asset file containing your JS bundle
38 | // bundleAssetName = "MyApplication.android.bundle"
39 | //
40 | // The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
41 | // entryFile = file("../js/MyApplication.android.js")
42 | //
43 | // A list of extra flags to pass to the 'bundle' commands.
44 | // See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
45 | // extraPackagerArgs = []
46 |
47 | /* Hermes Commands */
48 | // The hermes compiler command to run. By default it is 'hermesc'
49 | // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
50 | //
51 | // The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
52 | // hermesFlags = ["-O", "-output-source-map"]
53 | }
54 |
55 | /**
56 | * Set this to true to create four separate APKs instead of one,
57 | * one for each native architecture. This is useful if you don't
58 | * use App Bundles (https://developer.android.com/guide/app-bundle/)
59 | * and want to have separate APKs to upload to the Play Store.
60 | */
61 | def enableSeparateBuildPerCPUArchitecture = false
62 |
63 | /**
64 | * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
65 | */
66 | def enableProguardInReleaseBuilds = false
67 |
68 | /**
69 | * The preferred build flavor of JavaScriptCore (JSC)
70 | *
71 | * For example, to use the international variant, you can use:
72 | * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
73 | *
74 | * The international variant includes ICU i18n library and necessary data
75 | * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
76 | * give correct results when using with locales other than en-US. Note that
77 | * this variant is about 6MiB larger per architecture than default.
78 | */
79 | def jscFlavor = 'org.webkit:android-jsc:+'
80 |
81 | /**
82 | * Private function to get the list of Native Architectures you want to build.
83 | * This reads the value from reactNativeArchitectures in your gradle.properties
84 | * file and works together with the --active-arch-only flag of react-native run-android.
85 | */
86 | def reactNativeArchitectures() {
87 | def value = project.getProperties().get("reactNativeArchitectures")
88 | return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
89 | }
90 |
91 | android {
92 | ndkVersion rootProject.ext.ndkVersion
93 |
94 | compileSdkVersion rootProject.ext.compileSdkVersion
95 |
96 | namespace "com.reactnativezustandrq"
97 | defaultConfig {
98 | applicationId "com.reactnativezustandrq"
99 | minSdkVersion rootProject.ext.minSdkVersion
100 | targetSdkVersion rootProject.ext.targetSdkVersion
101 | versionCode 1
102 | versionName "1.0"
103 | testBuildType System.getProperty('testBuildType', 'debug')
104 | testInstrumentationRunner 'androidx.test.runner.AndroidJUnitRunner'
105 | }
106 |
107 | splits {
108 | abi {
109 | reset()
110 | enable enableSeparateBuildPerCPUArchitecture
111 | universalApk false // If true, also generate a universal APK
112 | include (*reactNativeArchitectures())
113 | }
114 | }
115 | signingConfigs {
116 | debug {
117 | storeFile file('debug.keystore')
118 | storePassword 'android'
119 | keyAlias 'androiddebugkey'
120 | keyPassword 'android'
121 | }
122 | }
123 | buildTypes {
124 | debug {
125 | signingConfig signingConfigs.debug
126 | }
127 | release {
128 | // Caution! In production, you need to generate your own keystore file.
129 | // see https://reactnative.dev/docs/signed-apk-android.
130 | signingConfig signingConfigs.debug
131 | minifyEnabled enableProguardInReleaseBuilds
132 | proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
133 | proguardFile "${rootProject.projectDir}/../node_modules/detox/android/detox/proguard-rules-app.pro"
134 |
135 | }
136 | }
137 |
138 | // applicationVariants are e.g. debug, release
139 | applicationVariants.all { variant ->
140 | variant.outputs.each { output ->
141 | // For each separate APK per architecture, set a unique version code as described here:
142 | // https://developer.android.com/studio/build/configure-apk-splits.html
143 | // Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc.
144 | def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
145 | def abi = output.getFilter(OutputFile.ABI)
146 | if (abi != null) { // null for the universal-debug, universal-release variants
147 | output.versionCodeOverride =
148 | defaultConfig.versionCode * 1000 + versionCodes.get(abi)
149 | }
150 |
151 | }
152 | }
153 | }
154 |
155 | dependencies {
156 | androidTestImplementation('com.wix:detox:+')
157 | implementation 'androidx.appcompat:appcompat:1.1.0'
158 | // The version of react-native is set by the React Native Gradle Plugin
159 | implementation("com.facebook.react:react-android")
160 |
161 | implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.0.0")
162 |
163 | debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}")
164 | debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
165 | exclude group:'com.squareup.okhttp3', module:'okhttp'
166 | }
167 |
168 | debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}")
169 | if (hermesEnabled.toBoolean()) {
170 | implementation("com.facebook.react:hermes-android")
171 | } else {
172 | implementation jscFlavor
173 | }
174 | }
175 |
176 | apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
177 | apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
178 |
179 |
--------------------------------------------------------------------------------
/android/gradlew:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 |
3 | #
4 | # Copyright © 2015-2021 the original authors.
5 | #
6 | # Licensed under the Apache License, Version 2.0 (the "License");
7 | # you may not use this file except in compliance with the License.
8 | # You may obtain a copy of the License at
9 | #
10 | # https://www.apache.org/licenses/LICENSE-2.0
11 | #
12 | # Unless required by applicable law or agreed to in writing, software
13 | # distributed under the License is distributed on an "AS IS" BASIS,
14 | # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15 | # See the License for the specific language governing permissions and
16 | # limitations under the License.
17 | #
18 |
19 | ##############################################################################
20 | #
21 | # Gradle start up script for POSIX generated by Gradle.
22 | #
23 | # Important for running:
24 | #
25 | # (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
26 | # noncompliant, but you have some other compliant shell such as ksh or
27 | # bash, then to run this script, type that shell name before the whole
28 | # command line, like:
29 | #
30 | # ksh Gradle
31 | #
32 | # Busybox and similar reduced shells will NOT work, because this script
33 | # requires all of these POSIX shell features:
34 | # * functions;
35 | # * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
36 | # «${var#prefix}», «${var%suffix}», and «$( cmd )»;
37 | # * compound commands having a testable exit status, especially «case»;
38 | # * various built-in commands including «command», «set», and «ulimit».
39 | #
40 | # Important for patching:
41 | #
42 | # (2) This script targets any POSIX shell, so it avoids extensions provided
43 | # by Bash, Ksh, etc; in particular arrays are avoided.
44 | #
45 | # The "traditional" practice of packing multiple parameters into a
46 | # space-separated string is a well documented source of bugs and security
47 | # problems, so this is (mostly) avoided, by progressively accumulating
48 | # options in "$@", and eventually passing that to Java.
49 | #
50 | # Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
51 | # and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
52 | # see the in-line comments for details.
53 | #
54 | # There are tweaks for specific operating systems such as AIX, CygWin,
55 | # Darwin, MinGW, and NonStop.
56 | #
57 | # (3) This script is generated from the Groovy template
58 | # https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
59 | # within the Gradle project.
60 | #
61 | # You can find Gradle at https://github.com/gradle/gradle/.
62 | #
63 | ##############################################################################
64 |
65 | # Attempt to set APP_HOME
66 |
67 | # Resolve links: $0 may be a link
68 | app_path=$0
69 |
70 | # Need this for daisy-chained symlinks.
71 | while
72 | APP_HOME=${app_path%"${app_path##*/}"} # leaves a trailing /; empty if no leading path
73 | [ -h "$app_path" ]
74 | do
75 | ls=$( ls -ld "$app_path" )
76 | link=${ls#*' -> '}
77 | case $link in #(
78 | /*) app_path=$link ;; #(
79 | *) app_path=$APP_HOME$link ;;
80 | esac
81 | done
82 |
83 | APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
84 |
85 | APP_NAME="Gradle"
86 | APP_BASE_NAME=${0##*/}
87 |
88 | # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
89 | DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
90 |
91 | # Use the maximum available, or set MAX_FD != -1 to use that value.
92 | MAX_FD=maximum
93 |
94 | warn () {
95 | echo "$*"
96 | } >&2
97 |
98 | die () {
99 | echo
100 | echo "$*"
101 | echo
102 | exit 1
103 | } >&2
104 |
105 | # OS specific support (must be 'true' or 'false').
106 | cygwin=false
107 | msys=false
108 | darwin=false
109 | nonstop=false
110 | case "$( uname )" in #(
111 | CYGWIN* ) cygwin=true ;; #(
112 | Darwin* ) darwin=true ;; #(
113 | MSYS* | MINGW* ) msys=true ;; #(
114 | NONSTOP* ) nonstop=true ;;
115 | esac
116 |
117 | CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
118 |
119 |
120 | # Determine the Java command to use to start the JVM.
121 | if [ -n "$JAVA_HOME" ] ; then
122 | if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
123 | # IBM's JDK on AIX uses strange locations for the executables
124 | JAVACMD=$JAVA_HOME/jre/sh/java
125 | else
126 | JAVACMD=$JAVA_HOME/bin/java
127 | fi
128 | if [ ! -x "$JAVACMD" ] ; then
129 | die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
130 |
131 | Please set the JAVA_HOME variable in your environment to match the
132 | location of your Java installation."
133 | fi
134 | else
135 | JAVACMD=java
136 | which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
137 |
138 | Please set the JAVA_HOME variable in your environment to match the
139 | location of your Java installation."
140 | fi
141 |
142 | # Increase the maximum file descriptors if we can.
143 | if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
144 | case $MAX_FD in #(
145 | max*)
146 | MAX_FD=$( ulimit -H -n ) ||
147 | warn "Could not query maximum file descriptor limit"
148 | esac
149 | case $MAX_FD in #(
150 | '' | soft) :;; #(
151 | *)
152 | ulimit -n "$MAX_FD" ||
153 | warn "Could not set maximum file descriptor limit to $MAX_FD"
154 | esac
155 | fi
156 |
157 | # Collect all arguments for the java command, stacking in reverse order:
158 | # * args from the command line
159 | # * the main class name
160 | # * -classpath
161 | # * -D...appname settings
162 | # * --module-path (only if needed)
163 | # * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
164 |
165 | # For Cygwin or MSYS, switch paths to Windows format before running java
166 | if "$cygwin" || "$msys" ; then
167 | APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
168 | CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
169 |
170 | JAVACMD=$( cygpath --unix "$JAVACMD" )
171 |
172 | # Now convert the arguments - kludge to limit ourselves to /bin/sh
173 | for arg do
174 | if
175 | case $arg in #(
176 | -*) false ;; # don't mess with options #(
177 | /?*) t=${arg#/} t=/${t%%/*} # looks like a POSIX filepath
178 | [ -e "$t" ] ;; #(
179 | *) false ;;
180 | esac
181 | then
182 | arg=$( cygpath --path --ignore --mixed "$arg" )
183 | fi
184 | # Roll the args list around exactly as many times as the number of
185 | # args, so each arg winds up back in the position where it started, but
186 | # possibly modified.
187 | #
188 | # NB: a `for` loop captures its iteration list before it begins, so
189 | # changing the positional parameters here affects neither the number of
190 | # iterations, nor the values presented in `arg`.
191 | shift # remove old arg
192 | set -- "$@" "$arg" # push replacement arg
193 | done
194 | fi
195 |
196 | # Collect all arguments for the java command;
197 | # * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of
198 | # shell script including quotes and variable substitutions, so put them in
199 | # double quotes to make sure that they get re-expanded; and
200 | # * put everything else in single quotes, so that it's not re-expanded.
201 |
202 | set -- \
203 | "-Dorg.gradle.appname=$APP_BASE_NAME" \
204 | -classpath "$CLASSPATH" \
205 | org.gradle.wrapper.GradleWrapperMain \
206 | "$@"
207 |
208 | # Use "xargs" to parse quoted args.
209 | #
210 | # With -n1 it outputs one arg per line, with the quotes and backslashes removed.
211 | #
212 | # In Bash we could simply go:
213 | #
214 | # readarray ARGS < <( xargs -n1 <<<"$var" ) &&
215 | # set -- "${ARGS[@]}" "$@"
216 | #
217 | # but POSIX shell has neither arrays nor command substitution, so instead we
218 | # post-process each arg (as a line of input to sed) to backslash-escape any
219 | # character that might be a shell metacharacter, then use eval to reverse
220 | # that process (while maintaining the separation between arguments), and wrap
221 | # the whole thing up as a single "set" statement.
222 | #
223 | # This will of course break if any of these variables contains a newline or
224 | # an unmatched quote.
225 | #
226 |
227 | eval "set -- $(
228 | printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
229 | xargs -n1 |
230 | sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
231 | tr '\n' ' '
232 | )" '"$@"'
233 |
234 | exec "$JAVACMD" "$@"
235 |
--------------------------------------------------------------------------------
/src/screens/__tests__/product-detail.test.tsx:
--------------------------------------------------------------------------------
1 | import {renderHook} from '@testing-library/react-hooks';
2 | import {fireEvent, render, screen} from '@testing-library/react-native';
3 | import React from 'react';
4 | import {ProductDetailScreen} from '..';
5 | import {setupGetProductByIdFailedHandler} from '../../../__mocks__/msw/handlers';
6 | import {useGetProductById} from '../../api/product';
7 | import {RouteNames} from '../../navigation/route-names';
8 | import {useProductInBasketQuantityById} from '../../store/product';
9 | import {cutString} from '../../utils/cut-string';
10 | import {getPriceText} from '../../utils/get-price-text';
11 | import {createReactQueryWrapper} from '../../utils/testing';
12 |
13 | const increaseProductQuantityInBasketMock = jest.fn();
14 | const decreaseProductQuantityInBasketMock = jest.fn();
15 | const addProductToBasketMock = jest.fn();
16 | const removeProductFromBasketMock = jest.fn();
17 |
18 | jest.mock('../../store/product', () => ({
19 | useProductActions: () => ({
20 | increaseProductQuantityInBasket: increaseProductQuantityInBasketMock,
21 | decreaseProductQuantityInBasket: decreaseProductQuantityInBasketMock,
22 | addProductToBasket: addProductToBasketMock,
23 | removeProductFromBasket: removeProductFromBasketMock,
24 | }),
25 | useProductInBasketQuantityById: jest.fn(() => undefined),
26 | }));
27 |
28 | const navigateMock = jest.fn();
29 | const setOptionsMock = jest.fn();
30 | const navigation = {navigate: navigateMock, setOptions: setOptionsMock} as any;
31 | const productId = 1;
32 | const route = {params: {id: productId}} as any;
33 |
34 | const component = ;
35 |
36 | describe('Product detail screen', () => {
37 | it('should display loading indicator on mount', async () => {
38 | render(component, {wrapper: createReactQueryWrapper});
39 |
40 | expect(screen.queryByTestId(`screen-loader`)).toBeTruthy();
41 |
42 | const {result, waitFor} = renderHook(() => useGetProductById(productId), {
43 | wrapper: createReactQueryWrapper,
44 | });
45 |
46 | await waitFor(() => result.current.isSuccess);
47 | });
48 |
49 | it('should display product detail data correctly, and should set header title based on api data', async () => {
50 | // we need to render whole app stack in order to be able to get header title
51 | render(component, {
52 | wrapper: createReactQueryWrapper,
53 | });
54 |
55 | const {result, waitFor: waitForHook} = renderHook(
56 | () => useGetProductById(productId),
57 | {
58 | wrapper: createReactQueryWrapper,
59 | },
60 | );
61 |
62 | await waitForHook(() => result.current.isSuccess);
63 |
64 | expect(setOptionsMock).toHaveBeenCalledWith({
65 | headerTitle: cutString(result.current.data!.title),
66 | });
67 |
68 | expect(screen.getByTestId(`product-detail-scroll-view`)).toBeTruthy();
69 |
70 | expect(screen.getByTestId('product-detail-image').props.source.uri).toBe(
71 | result.current.data!.image,
72 | );
73 |
74 | expect(screen.getByText(result.current.data!.title)).toBeTruthy();
75 |
76 | expect(screen.getByText(result.current.data!.description)).toBeTruthy();
77 | });
78 |
79 | it('should display error text in case get all products query fails', async () => {
80 | setupGetProductByIdFailedHandler();
81 |
82 | render(component, {wrapper: createReactQueryWrapper});
83 |
84 | const {result, waitFor} = renderHook(() => useGetProductById(productId), {
85 | wrapper: createReactQueryWrapper,
86 | });
87 |
88 | await waitFor(() => result.current.isError);
89 |
90 | expect(screen.getByText(`An error occurred`)).toBeTruthy();
91 | });
92 |
93 | it('should display price and quantity of the item correctly', async () => {
94 | render(component, {
95 | wrapper: createReactQueryWrapper,
96 | });
97 |
98 | const {result, waitFor: waitForHook} = renderHook(
99 | () => useGetProductById(productId),
100 | {
101 | wrapper: createReactQueryWrapper,
102 | },
103 | );
104 |
105 | await waitForHook(() => result.current.isSuccess);
106 |
107 | expect(screen.getByTestId(`product-detail-price`).props.children).toBe(
108 | getPriceText(result.current.data!.price),
109 | );
110 |
111 | expect(
112 | screen.getByTestId(
113 | `quantity-toggler-value-${result.current.data?.id.toString()}`,
114 | ).props.children,
115 | ).toBe('0');
116 | });
117 |
118 | it('should have decrease quantity button disabled and should call addFavoriteProduct function in case product has not been added to basket yet', async () => {
119 | render(component, {
120 | wrapper: createReactQueryWrapper,
121 | });
122 |
123 | const {result, waitFor: waitForHook} = renderHook(
124 | () => useGetProductById(productId),
125 | {
126 | wrapper: createReactQueryWrapper,
127 | },
128 | );
129 |
130 | await waitForHook(() => result.current.isSuccess);
131 |
132 | const increaseBtn = screen.getByTestId(
133 | `increase-quantity-btn-${result.current.data?.id.toString()}`,
134 | );
135 | const decreaseBtn = screen.getByTestId(
136 | `decrease-quantity-btn-${result.current.data?.id.toString()}`,
137 | );
138 |
139 | fireEvent.press(decreaseBtn);
140 |
141 | // decrease quantity button should be disabled if quantity equals to 0
142 | expect(decreaseProductQuantityInBasketMock).not.toHaveBeenCalled();
143 |
144 | fireEvent.press(increaseBtn);
145 |
146 | expect(addProductToBasketMock).toHaveBeenCalledWith(result.current.data!);
147 | });
148 |
149 | it('should increase quantity on pressing increase button in case product has already been added to basket', async () => {
150 | // product has been added to the basket
151 | (useProductInBasketQuantityById as jest.Mock).mockImplementation(() => 1);
152 |
153 | render(component, {
154 | wrapper: createReactQueryWrapper,
155 | });
156 |
157 | const {result, waitFor: waitForHook} = renderHook(
158 | () => useGetProductById(productId),
159 | {
160 | wrapper: createReactQueryWrapper,
161 | },
162 | );
163 |
164 | await waitForHook(() => result.current.isSuccess);
165 |
166 | const increaseBtn = screen.getByTestId(
167 | `increase-quantity-btn-${result.current.data?.id.toString()}`,
168 | );
169 |
170 | fireEvent.press(increaseBtn);
171 |
172 | expect(increaseProductQuantityInBasketMock).toHaveBeenCalledWith(
173 | result.current.data!.id,
174 | );
175 | });
176 |
177 | it('should call remove favorited product on pressing decrease button in case product has already been added to basket and its quantity equals to 1', async () => {
178 | // product has been added to the basket
179 | (useProductInBasketQuantityById as jest.Mock).mockImplementation(() => 1);
180 |
181 | render(component, {
182 | wrapper: createReactQueryWrapper,
183 | });
184 |
185 | const {result, waitFor: waitForHook} = renderHook(
186 | () => useGetProductById(productId),
187 | {
188 | wrapper: createReactQueryWrapper,
189 | },
190 | );
191 |
192 | await waitForHook(() => result.current.isSuccess);
193 |
194 | const decreaseBtn = screen.getByTestId(
195 | `decrease-quantity-btn-${result.current.data?.id.toString()}`,
196 | );
197 |
198 | fireEvent.press(decreaseBtn);
199 |
200 | expect(removeProductFromBasketMock).toHaveBeenCalledWith(
201 | result.current.data!.id,
202 | );
203 | });
204 |
205 | it('should call decrease favorited product on pressing decrease button in case product has already been added to basket and its quantity greater than 1', async () => {
206 | // product has been added to the basket and has quantity greater than 1
207 | (useProductInBasketQuantityById as jest.Mock).mockImplementation(() => 2);
208 |
209 | render(component, {
210 | wrapper: createReactQueryWrapper,
211 | });
212 |
213 | const {result, waitFor: waitForHook} = renderHook(
214 | () => useGetProductById(productId),
215 | {
216 | wrapper: createReactQueryWrapper,
217 | },
218 | );
219 |
220 | await waitForHook(() => result.current.isSuccess);
221 |
222 | const decreaseBtn = screen.getByTestId(
223 | `decrease-quantity-btn-${result.current.data?.id.toString()}`,
224 | );
225 |
226 | fireEvent.press(decreaseBtn);
227 |
228 | expect(decreaseProductQuantityInBasketMock).toHaveBeenCalledWith(
229 | result.current.data!.id,
230 | );
231 | });
232 |
233 | it('should call navigation function with correct params on pressing Go To Basket button', async () => {
234 | render(component, {
235 | wrapper: createReactQueryWrapper,
236 | });
237 |
238 | const {result, waitFor: waitForHook} = renderHook(
239 | () => useGetProductById(productId),
240 | {
241 | wrapper: createReactQueryWrapper,
242 | },
243 | );
244 |
245 | await waitForHook(() => result.current.isSuccess);
246 |
247 | const goToBasketBtn = screen.getByText('Go to basket');
248 |
249 | fireEvent.press(goToBasketBtn);
250 |
251 | expect(navigateMock).toHaveBeenCalledWith(RouteNames.basket);
252 | });
253 | });
254 |
--------------------------------------------------------------------------------
/__mocks__/msw/mock-data.ts:
--------------------------------------------------------------------------------
1 | export const GET_ALL_PRODUCTS_MOCK_RESPONSE = [
2 | {
3 | id: 1,
4 | title: 'Fjallraven - Foldsack No. 1 Backpack, Fits 15 Laptops',
5 | price: 109.95,
6 | description:
7 | 'Your perfect pack for everyday use and walks in the forest. Stash your laptop (up to 15 inches) in the padded sleeve, your everyday',
8 | category: "men's clothing",
9 | image: 'https://fakestoreapi.com/img/81fPKd-2AYL._AC_SL1500_.jpg',
10 | rating: {
11 | rate: 3.9,
12 | count: 120,
13 | },
14 | },
15 | {
16 | id: 2,
17 | title: 'Mens Casual Premium Slim Fit T-Shirts ',
18 | price: 22.3,
19 | description:
20 | 'Slim-fitting style, contrast raglan long sleeve, three-button henley placket, light weight & soft fabric for breathable and comfortable wearing. And Solid stitched shirts with round neck made for durability and a great fit for casual fashion wear and diehard baseball fans. The Henley style round neckline includes a three-button placket.',
21 | category: "men's clothing",
22 | image:
23 | 'https://fakestoreapi.com/img/71-3HjGNDUL._AC_SY879._SX._UX._SY._UY_.jpg',
24 | rating: {
25 | rate: 4.1,
26 | count: 259,
27 | },
28 | },
29 | {
30 | id: 3,
31 | title: 'Mens Cotton Jacket',
32 | price: 55.99,
33 | description:
34 | 'great outerwear jackets for Spring/Autumn/Winter, suitable for many occasions, such as working, hiking, camping, mountain/rock climbing, cycling, traveling or other outdoors. Good gift choice for you or your family member. A warm hearted love to Father, husband or son in this thanksgiving or Christmas Day.',
35 | category: "men's clothing",
36 | image: 'https://fakestoreapi.com/img/71li-ujtlUL._AC_UX679_.jpg',
37 | rating: {
38 | rate: 4.7,
39 | count: 500,
40 | },
41 | },
42 | {
43 | id: 4,
44 | title: 'Mens Casual Slim Fit',
45 | price: 15.99,
46 | description:
47 | 'The color could be slightly different between on the screen and in practice. / Please note that body builds vary by person, therefore, detailed size information should be reviewed below on the product description.',
48 | category: "men's clothing",
49 | image: 'https://fakestoreapi.com/img/71YXzeOuslL._AC_UY879_.jpg',
50 | rating: {
51 | rate: 2.1,
52 | count: 430,
53 | },
54 | },
55 | {
56 | id: 5,
57 | title:
58 | "John Hardy Women's Legends Naga Gold & Silver Dragon Station Chain Bracelet",
59 | price: 695,
60 | description:
61 | "From our Legends Collection, the Naga was inspired by the mythical water dragon that protects the ocean's pearl. Wear facing inward to be bestowed with love and abundance, or outward for protection.",
62 | category: 'jewelery',
63 | image: 'https://fakestoreapi.com/img/71pWzhdJNwL._AC_UL640_QL65_ML3_.jpg',
64 | rating: {
65 | rate: 4.6,
66 | count: 400,
67 | },
68 | },
69 | {
70 | id: 6,
71 | title: 'Solid Gold Petite Micropave ',
72 | price: 168,
73 | description:
74 | 'Satisfaction Guaranteed. Return or exchange any order within 30 days.Designed and sold by Hafeez Center in the United States. Satisfaction Guaranteed. Return or exchange any order within 30 days.',
75 | category: 'jewelery',
76 | image: 'https://fakestoreapi.com/img/61sbMiUnoGL._AC_UL640_QL65_ML3_.jpg',
77 | rating: {
78 | rate: 3.9,
79 | count: 70,
80 | },
81 | },
82 | {
83 | id: 7,
84 | title: 'White Gold Plated Princess',
85 | price: 9.99,
86 | description:
87 | "Classic Created Wedding Engagement Solitaire Diamond Promise Ring for Her. Gifts to spoil your love more for Engagement, Wedding, Anniversary, Valentine's Day...",
88 | category: 'jewelery',
89 | image: 'https://fakestoreapi.com/img/71YAIFU48IL._AC_UL640_QL65_ML3_.jpg',
90 | rating: {
91 | rate: 3,
92 | count: 400,
93 | },
94 | },
95 | {
96 | id: 8,
97 | title: 'Pierced Owl Rose Gold Plated Stainless Steel Double',
98 | price: 10.99,
99 | description:
100 | 'Rose Gold Plated Double Flared Tunnel Plug Earrings. Made of 316L Stainless Steel',
101 | category: 'jewelery',
102 | image: 'https://fakestoreapi.com/img/51UDEzMJVpL._AC_UL640_QL65_ML3_.jpg',
103 | rating: {
104 | rate: 1.9,
105 | count: 100,
106 | },
107 | },
108 | {
109 | id: 9,
110 | title: 'WD 2TB Elements Portable External Hard Drive - USB 3.0 ',
111 | price: 64,
112 | description:
113 | 'USB 3.0 and USB 2.0 Compatibility Fast data transfers Improve PC Performance High Capacity; Compatibility Formatted NTFS for Windows 10, Windows 8.1, Windows 7; Reformatting may be required for other operating systems; Compatibility may vary depending on user’s hardware configuration and operating system',
114 | category: 'electronics',
115 | image: 'https://fakestoreapi.com/img/61IBBVJvSDL._AC_SY879_.jpg',
116 | rating: {
117 | rate: 3.3,
118 | count: 203,
119 | },
120 | },
121 | {
122 | id: 10,
123 | title: 'SanDisk SSD PLUS 1TB Internal SSD - SATA III 6 Gb/s',
124 | price: 109,
125 | description:
126 | 'Easy upgrade for faster boot up, shutdown, application load and response (As compared to 5400 RPM SATA 2.5” hard drive; Based on published specifications and internal benchmarking tests using PCMark vantage scores) Boosts burst write performance, making it ideal for typical PC workloads The perfect balance of performance and reliability Read/write speeds of up to 535MB/s/450MB/s (Based on internal testing; Performance may vary depending upon drive capacity, host device, OS and application.)',
127 | category: 'electronics',
128 | image: 'https://fakestoreapi.com/img/61U7T1koQqL._AC_SX679_.jpg',
129 | rating: {
130 | rate: 2.9,
131 | count: 470,
132 | },
133 | },
134 | {
135 | id: 11,
136 | title:
137 | 'Silicon Power 256GB SSD 3D NAND A55 SLC Cache Performance Boost SATA III 2.5',
138 | price: 109,
139 | description:
140 | '3D NAND flash are applied to deliver high transfer speeds Remarkable transfer speeds that enable faster bootup and improved overall system performance. The advanced SLC Cache Technology allows performance boost and longer lifespan 7mm slim design suitable for Ultrabooks and Ultra-slim notebooks. Supports TRIM command, Garbage Collection technology, RAID, and ECC (Error Checking & Correction) to provide the optimized performance and enhanced reliability.',
141 | category: 'electronics',
142 | image: 'https://fakestoreapi.com/img/71kWymZ+c+L._AC_SX679_.jpg',
143 | rating: {
144 | rate: 4.8,
145 | count: 319,
146 | },
147 | },
148 | {
149 | id: 12,
150 | title:
151 | 'WD 4TB Gaming Drive Works with Playstation 4 Portable External Hard Drive',
152 | price: 114,
153 | description:
154 | "Expand your PS4 gaming experience, Play anywhere Fast and easy, setup Sleek design with high capacity, 3-year manufacturer's limited warranty",
155 | category: 'electronics',
156 | image: 'https://fakestoreapi.com/img/61mtL65D4cL._AC_SX679_.jpg',
157 | rating: {
158 | rate: 4.8,
159 | count: 400,
160 | },
161 | },
162 | {
163 | id: 13,
164 | title: 'Acer SB220Q bi 21.5 inches Full HD (1920 x 1080) IPS Ultra-Thin',
165 | price: 599,
166 | description:
167 | '21. 5 inches Full HD (1920 x 1080) widescreen IPS display And Radeon free Sync technology. No compatibility for VESA Mount Refresh Rate: 75Hz - Using HDMI port Zero-frame design | ultra-thin | 4ms response time | IPS panel Aspect ratio - 16: 9. Color Supported - 16. 7 million colors. Brightness - 250 nit Tilt angle -5 degree to 15 degree. Horizontal viewing angle-178 degree. Vertical viewing angle-178 degree 75 hertz',
168 | category: 'electronics',
169 | image: 'https://fakestoreapi.com/img/81QpkIctqPL._AC_SX679_.jpg',
170 | rating: {
171 | rate: 2.9,
172 | count: 250,
173 | },
174 | },
175 | {
176 | id: 14,
177 | title:
178 | 'Samsung 49-Inch CHG90 144Hz Curved Gaming Monitor (LC49HG90DMNXZA) – Super Ultrawide Screen QLED ',
179 | price: 999.99,
180 | description:
181 | '49 INCH SUPER ULTRAWIDE 32:9 CURVED GAMING MONITOR with dual 27 inch screen side by side QUANTUM DOT (QLED) TECHNOLOGY, HDR support and factory calibration provides stunningly realistic and accurate color and contrast 144HZ HIGH REFRESH RATE and 1ms ultra fast response time work to eliminate motion blur, ghosting, and reduce input lag',
182 | category: 'electronics',
183 | image: 'https://fakestoreapi.com/img/81Zt42ioCgL._AC_SX679_.jpg',
184 | rating: {
185 | rate: 2.2,
186 | count: 140,
187 | },
188 | },
189 | {
190 | id: 15,
191 | title: "BIYLACLESEN Women's 3-in-1 Snowboard Jacket Winter Coats",
192 | price: 56.99,
193 | description:
194 | 'Note:The Jackets is US standard size, Please choose size as your usual wear Material: 100% Polyester; Detachable Liner Fabric: Warm Fleece. Detachable Functional Liner: Skin Friendly, Lightweigt and Warm.Stand Collar Liner jacket, keep you warm in cold weather. Zippered Pockets: 2 Zippered Hand Pockets, 2 Zippered Pockets on Chest (enough to keep cards or keys)and 1 Hidden Pocket Inside.Zippered Hand Pockets and Hidden Pocket keep your things secure. Humanized Design: Adjustable and Detachable Hood and Adjustable cuff to prevent the wind and water,for a comfortable fit. 3 in 1 Detachable Design provide more convenience, you can separate the coat and inner as needed, or wear it together. It is suitable for different season and help you adapt to different climates',
195 | category: "women's clothing",
196 | image: 'https://fakestoreapi.com/img/51Y5NI-I5jL._AC_UX679_.jpg',
197 | rating: {
198 | rate: 2.6,
199 | count: 235,
200 | },
201 | },
202 | {
203 | id: 16,
204 | title:
205 | "Lock and Love Women's Removable Hooded Faux Leather Moto Biker Jacket",
206 | price: 29.95,
207 | description:
208 | '100% POLYURETHANE(shell) 100% POLYESTER(lining) 75% POLYESTER 25% COTTON (SWEATER), Faux leather material for style and comfort / 2 pockets of front, 2-For-One Hooded denim style faux leather jacket, Button detail on waist / Detail stitching at sides, HAND WASH ONLY / DO NOT BLEACH / LINE DRY / DO NOT IRON',
209 | category: "women's clothing",
210 | image: 'https://fakestoreapi.com/img/81XH0e8fefL._AC_UY879_.jpg',
211 | rating: {
212 | rate: 2.9,
213 | count: 340,
214 | },
215 | },
216 | {
217 | id: 17,
218 | title: 'Rain Jacket Women Windbreaker Striped Climbing Raincoats',
219 | price: 39.99,
220 | description:
221 | "Lightweight perfet for trip or casual wear---Long sleeve with hooded, adjustable drawstring waist design. Button and zipper front closure raincoat, fully stripes Lined and The Raincoat has 2 side pockets are a good size to hold all kinds of things, it covers the hips, and the hood is generous but doesn't overdo it.Attached Cotton Lined Hood with Adjustable Drawstrings give it a real styled look.",
222 | category: "women's clothing",
223 | image: 'https://fakestoreapi.com/img/71HblAHs5xL._AC_UY879_-2.jpg',
224 | rating: {
225 | rate: 3.8,
226 | count: 679,
227 | },
228 | },
229 | {
230 | id: 18,
231 | title: "MBJ Women's Solid Short Sleeve Boat Neck V ",
232 | price: 9.85,
233 | description:
234 | '95% RAYON 5% SPANDEX, Made in USA or Imported, Do Not Bleach, Lightweight fabric with great stretch for comfort, Ribbed on sleeves and neckline / Double stitching on bottom hem',
235 | category: "women's clothing",
236 | image: 'https://fakestoreapi.com/img/71z3kpMAYsL._AC_UY879_.jpg',
237 | rating: {
238 | rate: 4.7,
239 | count: 130,
240 | },
241 | },
242 | {
243 | id: 19,
244 | title: "Opna Women's Short Sleeve Moisture",
245 | price: 7.95,
246 | description:
247 | '100% Polyester, Machine wash, 100% cationic polyester interlock, Machine Wash & Pre Shrunk for a Great Fit, Lightweight, roomy and highly breathable with moisture wicking fabric which helps to keep moisture away, Soft Lightweight Fabric with comfortable V-neck collar and a slimmer fit, delivers a sleek, more feminine silhouette and Added Comfort',
248 | category: "women's clothing",
249 | image: 'https://fakestoreapi.com/img/51eg55uWmdL._AC_UX679_.jpg',
250 | rating: {
251 | rate: 4.5,
252 | count: 146,
253 | },
254 | },
255 | {
256 | id: 20,
257 | title: 'DANVOUY Womens T Shirt Casual Cotton Short',
258 | price: 12.99,
259 | description:
260 | '95%Cotton,5%Spandex, Features: Casual, Short Sleeve, Letter Print,V-Neck,Fashion Tees, The fabric is soft and has some stretch., Occasion: Casual/Office/Beach/School/Home/Street. Season: Spring,Summer,Autumn,Winter.',
261 | category: "women's clothing",
262 | image: 'https://fakestoreapi.com/img/61pHAEJ4NML._AC_UX679_.jpg',
263 | rating: {
264 | rate: 3.6,
265 | count: 145,
266 | },
267 | },
268 | ];
269 |
270 | export const GET_PRODUCT_BY_ID_MOCK_RESPONSE = {
271 | id: 1,
272 | title: 'Fjallraven - Foldsack No. 1 Backpack, Fits 15 Laptops',
273 | price: 109.95,
274 | description:
275 | 'Your perfect pack for everyday use and walks in the forest. Stash your laptop (up to 15 inches) in the padded sleeve, your everyday',
276 | category: "men's clothing",
277 | image: 'https://fakestoreapi.com/img/81fPKd-2AYL._AC_SL1500_.jpg',
278 | rating: {
279 | rate: 3.9,
280 | count: 120,
281 | },
282 | };
283 |
--------------------------------------------------------------------------------
/ios/Podfile.lock:
--------------------------------------------------------------------------------
1 | PODS:
2 | - boost (1.76.0)
3 | - CocoaAsyncSocket (7.6.5)
4 | - DoubleConversion (1.1.6)
5 | - FBLazyVector (0.71.2)
6 | - FBReactNativeSpec (0.71.2):
7 | - RCT-Folly (= 2021.07.22.00)
8 | - RCTRequired (= 0.71.2)
9 | - RCTTypeSafety (= 0.71.2)
10 | - React-Core (= 0.71.2)
11 | - React-jsi (= 0.71.2)
12 | - ReactCommon/turbomodule/core (= 0.71.2)
13 | - Flipper (0.125.0):
14 | - Flipper-Folly (~> 2.6)
15 | - Flipper-RSocket (~> 1.4)
16 | - Flipper-Boost-iOSX (1.76.0.1.11)
17 | - Flipper-DoubleConversion (3.2.0.1)
18 | - Flipper-Fmt (7.1.7)
19 | - Flipper-Folly (2.6.10):
20 | - Flipper-Boost-iOSX
21 | - Flipper-DoubleConversion
22 | - Flipper-Fmt (= 7.1.7)
23 | - Flipper-Glog
24 | - libevent (~> 2.1.12)
25 | - OpenSSL-Universal (= 1.1.1100)
26 | - Flipper-Glog (0.5.0.5)
27 | - Flipper-PeerTalk (0.0.4)
28 | - Flipper-RSocket (1.4.3):
29 | - Flipper-Folly (~> 2.6)
30 | - FlipperKit (0.125.0):
31 | - FlipperKit/Core (= 0.125.0)
32 | - FlipperKit/Core (0.125.0):
33 | - Flipper (~> 0.125.0)
34 | - FlipperKit/CppBridge
35 | - FlipperKit/FBCxxFollyDynamicConvert
36 | - FlipperKit/FBDefines
37 | - FlipperKit/FKPortForwarding
38 | - SocketRocket (~> 0.6.0)
39 | - FlipperKit/CppBridge (0.125.0):
40 | - Flipper (~> 0.125.0)
41 | - FlipperKit/FBCxxFollyDynamicConvert (0.125.0):
42 | - Flipper-Folly (~> 2.6)
43 | - FlipperKit/FBDefines (0.125.0)
44 | - FlipperKit/FKPortForwarding (0.125.0):
45 | - CocoaAsyncSocket (~> 7.6)
46 | - Flipper-PeerTalk (~> 0.0.4)
47 | - FlipperKit/FlipperKitHighlightOverlay (0.125.0)
48 | - FlipperKit/FlipperKitLayoutHelpers (0.125.0):
49 | - FlipperKit/Core
50 | - FlipperKit/FlipperKitHighlightOverlay
51 | - FlipperKit/FlipperKitLayoutTextSearchable
52 | - FlipperKit/FlipperKitLayoutIOSDescriptors (0.125.0):
53 | - FlipperKit/Core
54 | - FlipperKit/FlipperKitHighlightOverlay
55 | - FlipperKit/FlipperKitLayoutHelpers
56 | - YogaKit (~> 1.18)
57 | - FlipperKit/FlipperKitLayoutPlugin (0.125.0):
58 | - FlipperKit/Core
59 | - FlipperKit/FlipperKitHighlightOverlay
60 | - FlipperKit/FlipperKitLayoutHelpers
61 | - FlipperKit/FlipperKitLayoutIOSDescriptors
62 | - FlipperKit/FlipperKitLayoutTextSearchable
63 | - YogaKit (~> 1.18)
64 | - FlipperKit/FlipperKitLayoutTextSearchable (0.125.0)
65 | - FlipperKit/FlipperKitNetworkPlugin (0.125.0):
66 | - FlipperKit/Core
67 | - FlipperKit/FlipperKitReactPlugin (0.125.0):
68 | - FlipperKit/Core
69 | - FlipperKit/FlipperKitUserDefaultsPlugin (0.125.0):
70 | - FlipperKit/Core
71 | - FlipperKit/SKIOSNetworkPlugin (0.125.0):
72 | - FlipperKit/Core
73 | - FlipperKit/FlipperKitNetworkPlugin
74 | - fmt (6.2.1)
75 | - glog (0.3.5)
76 | - hermes-engine (0.71.2):
77 | - hermes-engine/Pre-built (= 0.71.2)
78 | - hermes-engine/Pre-built (0.71.2)
79 | - libevent (2.1.12)
80 | - OpenSSL-Universal (1.1.1100)
81 | - RCT-Folly (2021.07.22.00):
82 | - boost
83 | - DoubleConversion
84 | - fmt (~> 6.2.1)
85 | - glog
86 | - RCT-Folly/Default (= 2021.07.22.00)
87 | - RCT-Folly/Default (2021.07.22.00):
88 | - boost
89 | - DoubleConversion
90 | - fmt (~> 6.2.1)
91 | - glog
92 | - RCT-Folly/Futures (2021.07.22.00):
93 | - boost
94 | - DoubleConversion
95 | - fmt (~> 6.2.1)
96 | - glog
97 | - libevent
98 | - RCTRequired (0.71.2)
99 | - RCTTypeSafety (0.71.2):
100 | - FBLazyVector (= 0.71.2)
101 | - RCTRequired (= 0.71.2)
102 | - React-Core (= 0.71.2)
103 | - React (0.71.2):
104 | - React-Core (= 0.71.2)
105 | - React-Core/DevSupport (= 0.71.2)
106 | - React-Core/RCTWebSocket (= 0.71.2)
107 | - React-RCTActionSheet (= 0.71.2)
108 | - React-RCTAnimation (= 0.71.2)
109 | - React-RCTBlob (= 0.71.2)
110 | - React-RCTImage (= 0.71.2)
111 | - React-RCTLinking (= 0.71.2)
112 | - React-RCTNetwork (= 0.71.2)
113 | - React-RCTSettings (= 0.71.2)
114 | - React-RCTText (= 0.71.2)
115 | - React-RCTVibration (= 0.71.2)
116 | - React-callinvoker (0.71.2)
117 | - React-Codegen (0.71.2):
118 | - FBReactNativeSpec
119 | - hermes-engine
120 | - RCT-Folly
121 | - RCTRequired
122 | - RCTTypeSafety
123 | - React-Core
124 | - React-jsi
125 | - React-jsiexecutor
126 | - ReactCommon/turbomodule/bridging
127 | - ReactCommon/turbomodule/core
128 | - React-Core (0.71.2):
129 | - glog
130 | - hermes-engine
131 | - RCT-Folly (= 2021.07.22.00)
132 | - React-Core/Default (= 0.71.2)
133 | - React-cxxreact (= 0.71.2)
134 | - React-hermes
135 | - React-jsi (= 0.71.2)
136 | - React-jsiexecutor (= 0.71.2)
137 | - React-perflogger (= 0.71.2)
138 | - Yoga
139 | - React-Core/CoreModulesHeaders (0.71.2):
140 | - glog
141 | - hermes-engine
142 | - RCT-Folly (= 2021.07.22.00)
143 | - React-Core/Default
144 | - React-cxxreact (= 0.71.2)
145 | - React-hermes
146 | - React-jsi (= 0.71.2)
147 | - React-jsiexecutor (= 0.71.2)
148 | - React-perflogger (= 0.71.2)
149 | - Yoga
150 | - React-Core/Default (0.71.2):
151 | - glog
152 | - hermes-engine
153 | - RCT-Folly (= 2021.07.22.00)
154 | - React-cxxreact (= 0.71.2)
155 | - React-hermes
156 | - React-jsi (= 0.71.2)
157 | - React-jsiexecutor (= 0.71.2)
158 | - React-perflogger (= 0.71.2)
159 | - Yoga
160 | - React-Core/DevSupport (0.71.2):
161 | - glog
162 | - hermes-engine
163 | - RCT-Folly (= 2021.07.22.00)
164 | - React-Core/Default (= 0.71.2)
165 | - React-Core/RCTWebSocket (= 0.71.2)
166 | - React-cxxreact (= 0.71.2)
167 | - React-hermes
168 | - React-jsi (= 0.71.2)
169 | - React-jsiexecutor (= 0.71.2)
170 | - React-jsinspector (= 0.71.2)
171 | - React-perflogger (= 0.71.2)
172 | - Yoga
173 | - React-Core/RCTActionSheetHeaders (0.71.2):
174 | - glog
175 | - hermes-engine
176 | - RCT-Folly (= 2021.07.22.00)
177 | - React-Core/Default
178 | - React-cxxreact (= 0.71.2)
179 | - React-hermes
180 | - React-jsi (= 0.71.2)
181 | - React-jsiexecutor (= 0.71.2)
182 | - React-perflogger (= 0.71.2)
183 | - Yoga
184 | - React-Core/RCTAnimationHeaders (0.71.2):
185 | - glog
186 | - hermes-engine
187 | - RCT-Folly (= 2021.07.22.00)
188 | - React-Core/Default
189 | - React-cxxreact (= 0.71.2)
190 | - React-hermes
191 | - React-jsi (= 0.71.2)
192 | - React-jsiexecutor (= 0.71.2)
193 | - React-perflogger (= 0.71.2)
194 | - Yoga
195 | - React-Core/RCTBlobHeaders (0.71.2):
196 | - glog
197 | - hermes-engine
198 | - RCT-Folly (= 2021.07.22.00)
199 | - React-Core/Default
200 | - React-cxxreact (= 0.71.2)
201 | - React-hermes
202 | - React-jsi (= 0.71.2)
203 | - React-jsiexecutor (= 0.71.2)
204 | - React-perflogger (= 0.71.2)
205 | - Yoga
206 | - React-Core/RCTImageHeaders (0.71.2):
207 | - glog
208 | - hermes-engine
209 | - RCT-Folly (= 2021.07.22.00)
210 | - React-Core/Default
211 | - React-cxxreact (= 0.71.2)
212 | - React-hermes
213 | - React-jsi (= 0.71.2)
214 | - React-jsiexecutor (= 0.71.2)
215 | - React-perflogger (= 0.71.2)
216 | - Yoga
217 | - React-Core/RCTLinkingHeaders (0.71.2):
218 | - glog
219 | - hermes-engine
220 | - RCT-Folly (= 2021.07.22.00)
221 | - React-Core/Default
222 | - React-cxxreact (= 0.71.2)
223 | - React-hermes
224 | - React-jsi (= 0.71.2)
225 | - React-jsiexecutor (= 0.71.2)
226 | - React-perflogger (= 0.71.2)
227 | - Yoga
228 | - React-Core/RCTNetworkHeaders (0.71.2):
229 | - glog
230 | - hermes-engine
231 | - RCT-Folly (= 2021.07.22.00)
232 | - React-Core/Default
233 | - React-cxxreact (= 0.71.2)
234 | - React-hermes
235 | - React-jsi (= 0.71.2)
236 | - React-jsiexecutor (= 0.71.2)
237 | - React-perflogger (= 0.71.2)
238 | - Yoga
239 | - React-Core/RCTSettingsHeaders (0.71.2):
240 | - glog
241 | - hermes-engine
242 | - RCT-Folly (= 2021.07.22.00)
243 | - React-Core/Default
244 | - React-cxxreact (= 0.71.2)
245 | - React-hermes
246 | - React-jsi (= 0.71.2)
247 | - React-jsiexecutor (= 0.71.2)
248 | - React-perflogger (= 0.71.2)
249 | - Yoga
250 | - React-Core/RCTTextHeaders (0.71.2):
251 | - glog
252 | - hermes-engine
253 | - RCT-Folly (= 2021.07.22.00)
254 | - React-Core/Default
255 | - React-cxxreact (= 0.71.2)
256 | - React-hermes
257 | - React-jsi (= 0.71.2)
258 | - React-jsiexecutor (= 0.71.2)
259 | - React-perflogger (= 0.71.2)
260 | - Yoga
261 | - React-Core/RCTVibrationHeaders (0.71.2):
262 | - glog
263 | - hermes-engine
264 | - RCT-Folly (= 2021.07.22.00)
265 | - React-Core/Default
266 | - React-cxxreact (= 0.71.2)
267 | - React-hermes
268 | - React-jsi (= 0.71.2)
269 | - React-jsiexecutor (= 0.71.2)
270 | - React-perflogger (= 0.71.2)
271 | - Yoga
272 | - React-Core/RCTWebSocket (0.71.2):
273 | - glog
274 | - hermes-engine
275 | - RCT-Folly (= 2021.07.22.00)
276 | - React-Core/Default (= 0.71.2)
277 | - React-cxxreact (= 0.71.2)
278 | - React-hermes
279 | - React-jsi (= 0.71.2)
280 | - React-jsiexecutor (= 0.71.2)
281 | - React-perflogger (= 0.71.2)
282 | - Yoga
283 | - React-CoreModules (0.71.2):
284 | - RCT-Folly (= 2021.07.22.00)
285 | - RCTTypeSafety (= 0.71.2)
286 | - React-Codegen (= 0.71.2)
287 | - React-Core/CoreModulesHeaders (= 0.71.2)
288 | - React-jsi (= 0.71.2)
289 | - React-RCTBlob
290 | - React-RCTImage (= 0.71.2)
291 | - ReactCommon/turbomodule/core (= 0.71.2)
292 | - React-cxxreact (0.71.2):
293 | - boost (= 1.76.0)
294 | - DoubleConversion
295 | - glog
296 | - hermes-engine
297 | - RCT-Folly (= 2021.07.22.00)
298 | - React-callinvoker (= 0.71.2)
299 | - React-jsi (= 0.71.2)
300 | - React-jsinspector (= 0.71.2)
301 | - React-logger (= 0.71.2)
302 | - React-perflogger (= 0.71.2)
303 | - React-runtimeexecutor (= 0.71.2)
304 | - React-hermes (0.71.2):
305 | - DoubleConversion
306 | - glog
307 | - hermes-engine
308 | - RCT-Folly (= 2021.07.22.00)
309 | - RCT-Folly/Futures (= 2021.07.22.00)
310 | - React-cxxreact (= 0.71.2)
311 | - React-jsi
312 | - React-jsiexecutor (= 0.71.2)
313 | - React-jsinspector (= 0.71.2)
314 | - React-perflogger (= 0.71.2)
315 | - React-jsi (0.71.2):
316 | - boost (= 1.76.0)
317 | - DoubleConversion
318 | - glog
319 | - hermes-engine
320 | - RCT-Folly (= 2021.07.22.00)
321 | - React-jsiexecutor (0.71.2):
322 | - DoubleConversion
323 | - glog
324 | - hermes-engine
325 | - RCT-Folly (= 2021.07.22.00)
326 | - React-cxxreact (= 0.71.2)
327 | - React-jsi (= 0.71.2)
328 | - React-perflogger (= 0.71.2)
329 | - React-jsinspector (0.71.2)
330 | - React-logger (0.71.2):
331 | - glog
332 | - react-native-safe-area-context (4.5.0):
333 | - RCT-Folly
334 | - RCTRequired
335 | - RCTTypeSafety
336 | - React-Core
337 | - ReactCommon/turbomodule/core
338 | - React-perflogger (0.71.2)
339 | - React-RCTActionSheet (0.71.2):
340 | - React-Core/RCTActionSheetHeaders (= 0.71.2)
341 | - React-RCTAnimation (0.71.2):
342 | - RCT-Folly (= 2021.07.22.00)
343 | - RCTTypeSafety (= 0.71.2)
344 | - React-Codegen (= 0.71.2)
345 | - React-Core/RCTAnimationHeaders (= 0.71.2)
346 | - React-jsi (= 0.71.2)
347 | - ReactCommon/turbomodule/core (= 0.71.2)
348 | - React-RCTAppDelegate (0.71.2):
349 | - RCT-Folly
350 | - RCTRequired
351 | - RCTTypeSafety
352 | - React-Core
353 | - ReactCommon/turbomodule/core
354 | - React-RCTBlob (0.71.2):
355 | - hermes-engine
356 | - RCT-Folly (= 2021.07.22.00)
357 | - React-Codegen (= 0.71.2)
358 | - React-Core/RCTBlobHeaders (= 0.71.2)
359 | - React-Core/RCTWebSocket (= 0.71.2)
360 | - React-jsi (= 0.71.2)
361 | - React-RCTNetwork (= 0.71.2)
362 | - ReactCommon/turbomodule/core (= 0.71.2)
363 | - React-RCTImage (0.71.2):
364 | - RCT-Folly (= 2021.07.22.00)
365 | - RCTTypeSafety (= 0.71.2)
366 | - React-Codegen (= 0.71.2)
367 | - React-Core/RCTImageHeaders (= 0.71.2)
368 | - React-jsi (= 0.71.2)
369 | - React-RCTNetwork (= 0.71.2)
370 | - ReactCommon/turbomodule/core (= 0.71.2)
371 | - React-RCTLinking (0.71.2):
372 | - React-Codegen (= 0.71.2)
373 | - React-Core/RCTLinkingHeaders (= 0.71.2)
374 | - React-jsi (= 0.71.2)
375 | - ReactCommon/turbomodule/core (= 0.71.2)
376 | - React-RCTNetwork (0.71.2):
377 | - RCT-Folly (= 2021.07.22.00)
378 | - RCTTypeSafety (= 0.71.2)
379 | - React-Codegen (= 0.71.2)
380 | - React-Core/RCTNetworkHeaders (= 0.71.2)
381 | - React-jsi (= 0.71.2)
382 | - ReactCommon/turbomodule/core (= 0.71.2)
383 | - React-RCTSettings (0.71.2):
384 | - RCT-Folly (= 2021.07.22.00)
385 | - RCTTypeSafety (= 0.71.2)
386 | - React-Codegen (= 0.71.2)
387 | - React-Core/RCTSettingsHeaders (= 0.71.2)
388 | - React-jsi (= 0.71.2)
389 | - ReactCommon/turbomodule/core (= 0.71.2)
390 | - React-RCTText (0.71.2):
391 | - React-Core/RCTTextHeaders (= 0.71.2)
392 | - React-RCTVibration (0.71.2):
393 | - RCT-Folly (= 2021.07.22.00)
394 | - React-Codegen (= 0.71.2)
395 | - React-Core/RCTVibrationHeaders (= 0.71.2)
396 | - React-jsi (= 0.71.2)
397 | - ReactCommon/turbomodule/core (= 0.71.2)
398 | - React-runtimeexecutor (0.71.2):
399 | - React-jsi (= 0.71.2)
400 | - ReactCommon/turbomodule/bridging (0.71.2):
401 | - DoubleConversion
402 | - glog
403 | - hermes-engine
404 | - RCT-Folly (= 2021.07.22.00)
405 | - React-callinvoker (= 0.71.2)
406 | - React-Core (= 0.71.2)
407 | - React-cxxreact (= 0.71.2)
408 | - React-jsi (= 0.71.2)
409 | - React-logger (= 0.71.2)
410 | - React-perflogger (= 0.71.2)
411 | - ReactCommon/turbomodule/core (0.71.2):
412 | - DoubleConversion
413 | - glog
414 | - hermes-engine
415 | - RCT-Folly (= 2021.07.22.00)
416 | - React-callinvoker (= 0.71.2)
417 | - React-Core (= 0.71.2)
418 | - React-cxxreact (= 0.71.2)
419 | - React-jsi (= 0.71.2)
420 | - React-logger (= 0.71.2)
421 | - React-perflogger (= 0.71.2)
422 | - RNGestureHandler (2.9.0):
423 | - React-Core
424 | - RNScreens (3.19.0):
425 | - React-Core
426 | - React-RCTImage
427 | - SocketRocket (0.6.0)
428 | - Yoga (1.14.0)
429 | - YogaKit (1.18.1):
430 | - Yoga (~> 1.14)
431 |
432 | DEPENDENCIES:
433 | - boost (from `../node_modules/react-native/third-party-podspecs/boost.podspec`)
434 | - DoubleConversion (from `../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`)
435 | - FBLazyVector (from `../node_modules/react-native/Libraries/FBLazyVector`)
436 | - FBReactNativeSpec (from `../node_modules/react-native/React/FBReactNativeSpec`)
437 | - Flipper (= 0.125.0)
438 | - Flipper-Boost-iOSX (= 1.76.0.1.11)
439 | - Flipper-DoubleConversion (= 3.2.0.1)
440 | - Flipper-Fmt (= 7.1.7)
441 | - Flipper-Folly (= 2.6.10)
442 | - Flipper-Glog (= 0.5.0.5)
443 | - Flipper-PeerTalk (= 0.0.4)
444 | - Flipper-RSocket (= 1.4.3)
445 | - FlipperKit (= 0.125.0)
446 | - FlipperKit/Core (= 0.125.0)
447 | - FlipperKit/CppBridge (= 0.125.0)
448 | - FlipperKit/FBCxxFollyDynamicConvert (= 0.125.0)
449 | - FlipperKit/FBDefines (= 0.125.0)
450 | - FlipperKit/FKPortForwarding (= 0.125.0)
451 | - FlipperKit/FlipperKitHighlightOverlay (= 0.125.0)
452 | - FlipperKit/FlipperKitLayoutPlugin (= 0.125.0)
453 | - FlipperKit/FlipperKitLayoutTextSearchable (= 0.125.0)
454 | - FlipperKit/FlipperKitNetworkPlugin (= 0.125.0)
455 | - FlipperKit/FlipperKitReactPlugin (= 0.125.0)
456 | - FlipperKit/FlipperKitUserDefaultsPlugin (= 0.125.0)
457 | - FlipperKit/SKIOSNetworkPlugin (= 0.125.0)
458 | - glog (from `../node_modules/react-native/third-party-podspecs/glog.podspec`)
459 | - hermes-engine (from `../node_modules/react-native/sdks/hermes-engine/hermes-engine.podspec`)
460 | - libevent (~> 2.1.12)
461 | - OpenSSL-Universal (= 1.1.1100)
462 | - RCT-Folly (from `../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec`)
463 | - RCTRequired (from `../node_modules/react-native/Libraries/RCTRequired`)
464 | - RCTTypeSafety (from `../node_modules/react-native/Libraries/TypeSafety`)
465 | - React (from `../node_modules/react-native/`)
466 | - React-callinvoker (from `../node_modules/react-native/ReactCommon/callinvoker`)
467 | - React-Codegen (from `build/generated/ios`)
468 | - React-Core (from `../node_modules/react-native/`)
469 | - React-Core/DevSupport (from `../node_modules/react-native/`)
470 | - React-Core/RCTWebSocket (from `../node_modules/react-native/`)
471 | - React-CoreModules (from `../node_modules/react-native/React/CoreModules`)
472 | - React-cxxreact (from `../node_modules/react-native/ReactCommon/cxxreact`)
473 | - React-hermes (from `../node_modules/react-native/ReactCommon/hermes`)
474 | - React-jsi (from `../node_modules/react-native/ReactCommon/jsi`)
475 | - React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
476 | - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
477 | - React-logger (from `../node_modules/react-native/ReactCommon/logger`)
478 | - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
479 | - React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`)
480 | - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`)
481 | - React-RCTAnimation (from `../node_modules/react-native/Libraries/NativeAnimation`)
482 | - React-RCTAppDelegate (from `../node_modules/react-native/Libraries/AppDelegate`)
483 | - React-RCTBlob (from `../node_modules/react-native/Libraries/Blob`)
484 | - React-RCTImage (from `../node_modules/react-native/Libraries/Image`)
485 | - React-RCTLinking (from `../node_modules/react-native/Libraries/LinkingIOS`)
486 | - React-RCTNetwork (from `../node_modules/react-native/Libraries/Network`)
487 | - React-RCTSettings (from `../node_modules/react-native/Libraries/Settings`)
488 | - React-RCTText (from `../node_modules/react-native/Libraries/Text`)
489 | - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
490 | - React-runtimeexecutor (from `../node_modules/react-native/ReactCommon/runtimeexecutor`)
491 | - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
492 | - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
493 | - RNScreens (from `../node_modules/react-native-screens`)
494 | - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
495 |
496 | SPEC REPOS:
497 | trunk:
498 | - CocoaAsyncSocket
499 | - Flipper
500 | - Flipper-Boost-iOSX
501 | - Flipper-DoubleConversion
502 | - Flipper-Fmt
503 | - Flipper-Folly
504 | - Flipper-Glog
505 | - Flipper-PeerTalk
506 | - Flipper-RSocket
507 | - FlipperKit
508 | - fmt
509 | - libevent
510 | - OpenSSL-Universal
511 | - SocketRocket
512 | - YogaKit
513 |
514 | EXTERNAL SOURCES:
515 | boost:
516 | :podspec: "../node_modules/react-native/third-party-podspecs/boost.podspec"
517 | DoubleConversion:
518 | :podspec: "../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec"
519 | FBLazyVector:
520 | :path: "../node_modules/react-native/Libraries/FBLazyVector"
521 | FBReactNativeSpec:
522 | :path: "../node_modules/react-native/React/FBReactNativeSpec"
523 | glog:
524 | :podspec: "../node_modules/react-native/third-party-podspecs/glog.podspec"
525 | hermes-engine:
526 | :podspec: "../node_modules/react-native/sdks/hermes-engine/hermes-engine.podspec"
527 | RCT-Folly:
528 | :podspec: "../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec"
529 | RCTRequired:
530 | :path: "../node_modules/react-native/Libraries/RCTRequired"
531 | RCTTypeSafety:
532 | :path: "../node_modules/react-native/Libraries/TypeSafety"
533 | React:
534 | :path: "../node_modules/react-native/"
535 | React-callinvoker:
536 | :path: "../node_modules/react-native/ReactCommon/callinvoker"
537 | React-Codegen:
538 | :path: build/generated/ios
539 | React-Core:
540 | :path: "../node_modules/react-native/"
541 | React-CoreModules:
542 | :path: "../node_modules/react-native/React/CoreModules"
543 | React-cxxreact:
544 | :path: "../node_modules/react-native/ReactCommon/cxxreact"
545 | React-hermes:
546 | :path: "../node_modules/react-native/ReactCommon/hermes"
547 | React-jsi:
548 | :path: "../node_modules/react-native/ReactCommon/jsi"
549 | React-jsiexecutor:
550 | :path: "../node_modules/react-native/ReactCommon/jsiexecutor"
551 | React-jsinspector:
552 | :path: "../node_modules/react-native/ReactCommon/jsinspector"
553 | React-logger:
554 | :path: "../node_modules/react-native/ReactCommon/logger"
555 | react-native-safe-area-context:
556 | :path: "../node_modules/react-native-safe-area-context"
557 | React-perflogger:
558 | :path: "../node_modules/react-native/ReactCommon/reactperflogger"
559 | React-RCTActionSheet:
560 | :path: "../node_modules/react-native/Libraries/ActionSheetIOS"
561 | React-RCTAnimation:
562 | :path: "../node_modules/react-native/Libraries/NativeAnimation"
563 | React-RCTAppDelegate:
564 | :path: "../node_modules/react-native/Libraries/AppDelegate"
565 | React-RCTBlob:
566 | :path: "../node_modules/react-native/Libraries/Blob"
567 | React-RCTImage:
568 | :path: "../node_modules/react-native/Libraries/Image"
569 | React-RCTLinking:
570 | :path: "../node_modules/react-native/Libraries/LinkingIOS"
571 | React-RCTNetwork:
572 | :path: "../node_modules/react-native/Libraries/Network"
573 | React-RCTSettings:
574 | :path: "../node_modules/react-native/Libraries/Settings"
575 | React-RCTText:
576 | :path: "../node_modules/react-native/Libraries/Text"
577 | React-RCTVibration:
578 | :path: "../node_modules/react-native/Libraries/Vibration"
579 | React-runtimeexecutor:
580 | :path: "../node_modules/react-native/ReactCommon/runtimeexecutor"
581 | ReactCommon:
582 | :path: "../node_modules/react-native/ReactCommon"
583 | RNGestureHandler:
584 | :path: "../node_modules/react-native-gesture-handler"
585 | RNScreens:
586 | :path: "../node_modules/react-native-screens"
587 | Yoga:
588 | :path: "../node_modules/react-native/ReactCommon/yoga"
589 |
590 | SPEC CHECKSUMS:
591 | boost: 57d2868c099736d80fcd648bf211b4431e51a558
592 | CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
593 | DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
594 | FBLazyVector: d58428b28fe1f5070fe993495b0e2eaf701d3820
595 | FBReactNativeSpec: 225fb0f0ab00493ce0731f954da3658638d9b191
596 | Flipper: 26fc4b7382499f1281eb8cb921e5c3ad6de91fe0
597 | Flipper-Boost-iOSX: fd1e2b8cbef7e662a122412d7ac5f5bea715403c
598 | Flipper-DoubleConversion: 2dc99b02f658daf147069aad9dbd29d8feb06d30
599 | Flipper-Fmt: 60cbdd92fc254826e61d669a5d87ef7015396a9b
600 | Flipper-Folly: 584845625005ff068a6ebf41f857f468decd26b3
601 | Flipper-Glog: 70c50ce58ddaf67dc35180db05f191692570f446
602 | Flipper-PeerTalk: 116d8f857dc6ef55c7a5a75ea3ceaafe878aadc9
603 | Flipper-RSocket: d9d9ade67cbecf6ac10730304bf5607266dd2541
604 | FlipperKit: cbdee19bdd4e7f05472a66ce290f1b729ba3cb86
605 | fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
606 | glog: 04b94705f318337d7ead9e6d17c019bd9b1f6b1b
607 | hermes-engine: 6351580c827b3b03e5f25aadcf989f582d0b0a86
608 | libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
609 | OpenSSL-Universal: ebc357f1e6bc71fa463ccb2fe676756aff50e88c
610 | RCT-Folly: 424b8c9a7a0b9ab2886ffe9c3b041ef628fd4fb1
611 | RCTRequired: c154ebcfbf41d6fef86c52674fc1aa08837ff538
612 | RCTTypeSafety: 3063e5a1e5b1dc2cbeda5c8f8926c0ad1a6b0871
613 | React: 0a1a36e8e81cfaac244ed88b97f23ab56e5434f0
614 | React-callinvoker: 679a09fbfe1a8bbf0c8588b588bf3ef85e7e4922
615 | React-Codegen: 78f8966839f22b54d3303a6aca2679bce5723c3f
616 | React-Core: 679e5ff1eb0e3122463976d0b2049bebcb7b33d6
617 | React-CoreModules: 06cbf15185e6daf9fb3aec02c963f4807bd794b3
618 | React-cxxreact: 645dc75c9deba4c15698b1b5902236d6a766461f
619 | React-hermes: bc7bcfeaaa7cb98dc9f9252f2f3eca66f06f01e2
620 | React-jsi: 82625f9f1f8d7abf716d897612a9ea06ecf6db6e
621 | React-jsiexecutor: c7e028406112db456ac3cf5720d266bc7bc20938
622 | React-jsinspector: ea8101acf525ec08b2d87ddf0637d45f8e3b4148
623 | React-logger: 97987f46779d8dd24656474ad0c43a5b459f31d6
624 | react-native-safe-area-context: 39c2d8be3328df5d437ac1700f4f3a4f75716acc
625 | React-perflogger: c7ccda3d1d1da837f7ff4e54e816022a6803ee87
626 | React-RCTActionSheet: 01c125aebbad462a24228f68c584c7a921d6c28e
627 | React-RCTAnimation: 5277a9440acffc4a5b7baa6ae3880fe467277ae6
628 | React-RCTAppDelegate: 3977201606125157aa94872b4171ca316478939b
629 | React-RCTBlob: 8e15fc9091d8947f406ba706f11505b38b1b5e40
630 | React-RCTImage: 65319acfe82b85219b2d410725a593abe19ac795
631 | React-RCTLinking: a5fc2b9d7a346d6e7d34de8093bb5d1064042508
632 | React-RCTNetwork: 5d1efcd01ca7f08ebf286d68be544f747a5d315a
633 | React-RCTSettings: fa760b0add819ac3ad73b06715f9547316acdf20
634 | React-RCTText: 05c244b135d75d4395eb35c012949a5326f8ab70
635 | React-RCTVibration: 0af3babdeee1b2d052811a2f86977d1e1c81ebd1
636 | React-runtimeexecutor: 4bf9a9086d27f74065fce1dddac274aa95216952
637 | ReactCommon: f697c0ac52e999aa818e43e2b6f277787c735e2d
638 | RNGestureHandler: 071d7a9ad81e8b83fe7663b303d132406a7d8f39
639 | RNScreens: ea4cd3a853063cda19a4e3c28d2e52180c80f4eb
640 | SocketRocket: fccef3f9c5cedea1353a9ef6ada904fde10d6608
641 | Yoga: 5b0304b3dbef2b52e078052138e23a19c7dacaef
642 | YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
643 |
644 | PODFILE CHECKSUM: 68ecd9fd2234bdcaf3ffaf9aedc6e34cda522714
645 |
646 | COCOAPODS: 1.11.3
647 |
--------------------------------------------------------------------------------