Datastore.query returns undefined when user logs out and logs in again.React JS Amplify

[MeryAmun]

Before opening, please confirm:

• [X] I have searched for duplicate or closed issues and discussions.
• [X] I have read the guide for submitting bug reports.
• [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React

Amplify APIs

Authentication, DataStore

Amplify Version

v6

Amplify Categories

auth, storage

Backend

Amplify CLI

Environment information

``` System: OS: Windows 10 10.0.19045 CPU: (4) x64 AMD A6-5200 APU with Radeon(TM) HD Graphics Memory: 937.97 MB / 7.47 GB Binaries: Node: 20.10.0 - C:\Program Files\nodejs\node.EXE npm: 10.2.3 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Chromium (122.0.2365.80) Internet Explorer: 11.0.19041.3636 npmPackages: @aws-amplify/ui-react: ^6.1.4 => 6.1.5 @aws-amplify/ui-react-internal: undefined () @testing-library/jest-dom: ^5.16.4 => 5.17.0 @testing-library/react: ^13.2.0 => 13.4.0 @testing-library/user-event: ^13.5.0 => 13.5.0 @types/jest: ^29.5.12 => 29.5.12 @types/node: ^20.11.20 => 20.11.24 @types/react: ^18.2.58 => 18.2.62 @types/react-dom: ^18.2.19 => 18.2.19 antd: ^4.20.2 => 4.24.15 aws-amplify: ^6.0.17 => 6.0.18 aws-amplify/adapter-core: undefined () aws-amplify/analytics: undefined () aws-amplify/analytics/kinesis: undefined () aws-amplify/analytics/kinesis-firehose: undefined () aws-amplify/analytics/personalize: undefined () aws-amplify/analytics/pinpoint: undefined () aws-amplify/api: undefined () aws-amplify/api/server: undefined () aws-amplify/auth: undefined () aws-amplify/auth/cognito: undefined () aws-amplify/auth/cognito/server: undefined () aws-amplify/auth/enable-oauth-listener: undefined () aws-amplify/auth/server: undefined () aws-amplify/datastore: undefined () aws-amplify/in-app-messaging: undefined () aws-amplify/in-app-messaging/pinpoint: undefined () aws-amplify/push-notifications: undefined () aws-amplify/push-notifications/pinpoint: undefined () aws-amplify/storage: undefined () aws-amplify/storage/s3: undefined () aws-amplify/storage/s3/server: undefined () aws-amplify/storage/server: undefined () aws-amplify/utils: undefined () react: ^18.1.0 => 18.2.0 react-dom: ^18.1.0 => 18.2.0 react-google-places-autocomplete: ^3.3.4 => 3.4.0 react-router-dom: 6 => 6.22.2 react-scripts: 5.0.1 => 5.0.1 typescript: >2.0.0 => 5.3.3 web-vitals: ^2.1.4 => 2.1.4 npmGlobalPackages: create-expo-app: 2.1.1 create-react-app: 5.0.1 expo-cli: 6.3.10 firebase-tools: 13.0.2 serve: 14.2.1 ```

Describe the bug

Hello everyone , I have a React JS Amplify Web application and when i log in, the datastore.query queries data normally. But when i logout and login again, i must refresh the page before data can be displayed. Please i need help

Expected behavior

I expected that when I log out and log in again, the data from the datastore should display without me having to refresh the page

Reproduction steps

...

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

[chrisbonifacio]

Hi @MeryAmun 👋 thanks for raising this issue.

When the user logs in or out, we typically recommend clearing the local store in case other users login to the same device.

If in your case you can and/or want to leave the data in the local store, please disregard.

In any case, I'm curious how you might be doing things in your app. Can you share some code snippets such as your graphql schema, how you are configuring Amplify and/or DataStore, calling DataStore.query, as well as any error logs?

Another option would be if you could provide specific reproduction steps for us to follow to reproduce the issue internally, or even a small sample app that reproduces the issue.

[MeryAmun]

hello @chrisbonifacio thank you for your prompt response. Here is the code snippet for datastore query

useEffect(() => {

const removeListener = Hub.listen("datastore", async (capsule) => { const { payload: { event, data }, } = capsule;

console.log("DataStore event", event, data);

if (event === "ready") {
  const shops = await DataStore.query(Shop, Predicates.ALL);

  setShop(shops[0]);
  setLoading(false)
}

}); DataStore.start() return () => { removeListener(); }; }, []);

Also I wish to mention that I am using the withAuthenticator HOC

[cwomack]

@MeryAmun, can you clarify if you're running DataStore.stop() or DataStore.clear() on/before a user logs out? If they are not being called when a user logs out then I don't think a new ready event is going to be emitted from Hub after calling DataStore.start() because it has already started, which might cause the issue you're experiencing.

[cwomack]

Closing this issue as we have not heard back from you. If you are still experiencing this, please feel free to reply back and provide any information previously requested and we'd be happy to re-open the issue.

Thank you!