awslabs / aws-mobile-appsync-sdk-js

JavaScript library files for Offline, Sync, Sigv4. includes support for React Native
Apache License 2.0
921 stars 267 forks source link

My application is crashing at the time of mutation #403

Open rahulbhankar786 opened 5 years ago

rahulbhankar786 commented 5 years ago

Hi Team Appsync, I am working on a mobile application where i need to store 20000 records in my mobile cache. fetching is great while am fetching data from multiple tables(no error while while fetching).

` class Assets extends React.PureComponent { componentDidUpdate = async (prevProps) => { const {nextTokenForAssets, loadingAssets, networkStatusAssets, loadMoreAssets } = this.props /**

const GetAsset = compose( graphql(GetAssetsList, { name: 'AssetsList', options: (ownProps) => { return { fetchPolicy: 'cache-and-network', variables: { limit: 100, nextToken: ' ', PLANT_ID: ownProps.userPlantId ? ownProps.userPlantId : ' ', PACKAGE_ID: ownProps.userPackageId ? ownProps.userPackageId : ' ' } } }, props: ({ ownProps, AssetsList }) => { return ({ listAssets: AssetsList.listASSETS ? AssetsList.listASSETS.items : [], nextTokenForAssets: AssetsList.listASSETS ? AssetsList.listASSETS.nextToken : ' ', loadingAssets: AssetsList.loading, networkStatusAssets: AssetsList.networkStatus, errorInAssetList: AssetsList.error, loadMoreAssets: () => { AssetsList.fetchMore({ variables: { limit: 100, nextToken: AssetsList.listASSETS ? AssetsList.listASSETS.nextToken : ' ', PLANT_ID: ownProps.userPlantId ? ownProps.userPlantId : ' ', PACKAGE_ID: ownProps.userPackageId ? ownProps.userPackageId : ' ' }, updateQuery: (prevResult, { fetchMoreResult }) => { const newList = fetchMoreResult.listASSETS ? fetchMoreResult.listASSETS.items :[] const prevList = prevResult.listASSETS ? prevResult.listASSETS.items : [] const newItems = [ ...newList, ...prevList ]

                        const newData = {
                            ...prevResult.listASSETS,
                            items: newItems,
                            nextToken: fetchMoreResult.listASSETS ? fetchMoreResult.listASSETS.nextToken : ' '
                        }
                        const finalData = {
                            ...prevResult,
                            listASSETS: newData
                        }
                        return finalData
                    }
                })
            }
        })
    }
})

)(Assets) export default GetAsset `

but main problem with me while i am trying to mutate this data. my application got crash i dont know why . no error is throwing whereas i put try catch block everywhere

pls suggest me i have some option for that

  1. it can be memory issue( i dont think so because i have update phone with 3GB ram and 32GB ROM)
  2. It can be resolver issue ( no because i made updation without update function it working perfectely)

here my mutation code -

`import UpdateAsset from '../gqlQueries/UpdateAsset' import GetAssetsList from '../gqlQueries/GetAssetsList' import Toast from '../components/Toast'

export default async (asset, client, variables ) => { try { const result = await client.mutate({ mutation: UpdateAsset, variables: asset, update: (cache, { data: { updateASSETS } }) => { const query = GetAssetsList // Read query from cache const data = cache.readQuery({ query, variables })
// Add newly created item to the cache copy let filterData = data.listASSETS.items.find(item => item.ASSETS_ID === updateASSETS.ASSETS_ID) let newData = { ...filterData, ASSETS_NAME : updateASSETS.ASSETS_NAME, ASSETS_SHORT_DESCRIPTION : updateASSETS.ASSETS_SHORT_DESCRIPTION, ASSETS_LASTMODIFIEDDATE : updateASSETS.ASSETS_LASTMODIFIEDDATE, ASSETS_UNABLE_TO_LOCATE : updateASSETS.ASSETS_UNABLE_TO_LOCATE, ASSETS_AUDIT_COMPLETED : updateASSETS.ASSETS_AUDIT_COMPLETED, CLASSIFICATION_ID : updateASSETS.CLASSIFICATION_ID, ASSETS_PARENT_ASSET_ID : updateASSETS.ASSETS_PARENT_ASSET_ID, ASSETS_PARENT_ASSET_NAME : updateASSETS.ASSETS_PARENT_ASSET_NAME, ASSETS_LASTMODIFIEDBY_ID : updateASSETS.ASSETS_LASTMODIFIEDBY_ID, ASSETS_LASTMODIFIEDBY_NAME : updateASSETS.ASSETS_LASTMODIFIEDBY_NAME, ASSETS_LATEST_AUDIT: updateASSETS.ASSETS_LATEST_AUDIT, ASSETS_LATEST_AUDITOR: updateASSETS.ASSETS_LATEST_AUDITOR } data.listASSETS.items = data.listASSETS.items.filter(item => item.ASSETS_ID !== updateASSETS.ASSETS_ID)
data.listASSETS.items.unshift(newData)
//Overwrite the cache with the new results cache.writeQuery({ query, variables, data }) }, optimisticResponse: () => ({ updateASSETS: { ...asset, __typename: 'ASSETS' } }), }) } catch (error) { Toast('Error: '+ error) } }`

manueliglesias commented 5 years ago

Hi @rahulbhankar786

This might be related to the storage mechanism used in your app (AsyncStorage by default in react-native)

Can you try using a different storage engine? docs(search for Custom storage engine)

e.g. redux-persist-filesystem-storage (react-native, to mitigate storage size limitations in android (rt2zz/redux-persist#199, rt2zz/redux-persist#284))