> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-v6-beta2-flutter-uikit.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Login Listener

> Receive real-time updates for login and logout events using the LoginListener class in CometChat React Native SDK.

<Info>
  **Quick Reference** - Register a login listener:

  ```javascript theme={null}
  CometChat.addLoginListener(
    "UNIQUE_LISTENER_ID",
    new CometChat.LoginListener({
      loginSuccess: (e) => console.log("Logged in", e),
      loginFailure: (e) => console.log("Login failed", e),
      logoutSuccess: () => console.log("Logged out"),
      logoutFailure: (e) => console.log("Logout failed", e),
    })
  );
  ```
</Info>

The CometChat SDK provides you with real-time updates for the `login` and `logout` events. This can be achieved using the `LoginListener` class. LoginListener provides the following 4 methods:

| Delegate Method      | Information                                                                                                                                                      |
| -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| loginSuccess(event)  | Informs you that the login was successful and provides you with a user object containing the data for the user that logged in.                                   |
| loginFailure(event)  | Informs you about the failure while logging in the user and provides you with the reason for the failure wrapped in an object of the `CometChatException` class. |
| logoutSuccess()      | Informs you about the user being logged out successfully.                                                                                                        |
| logoutFailure(event) | Informs you about the failure while logging out the user. The reason for the failure can be obtained from the object of the `CometChatException` class.          |

## Add Login Listener

To add the `LoginListener`, use the `addLoginListener()` method provided by the SDK. It takes a unique identifier for the listener and an instance of the `LoginListener` class.

<Tabs>
  <Tab title="JavaScript">
    ```javascript theme={null}
    var listenerID = "UNIQUE_LISTENER_ID";

    CometChat.addLoginListener(
      listenerID,
      new CometChat.LoginListener({
        loginSuccess: (e) => {
          console.log("LoginListener :: loginSuccess", e);
        },
        loginFailure: (e) => {
          console.log("LoginListener :: loginFailure", e);
        },
        logoutSuccess: () => {
          console.log("LoginListener :: logoutSuccess");
        },
        logoutFailure: (e) => {
          console.log("LoginListener :: logoutFailure", e);
        },
      })
    );
    ```
  </Tab>

  <Tab title="TypeScript">
    ```typescript theme={null}
    var listenerID: string = "UNIQUE_LISTENER_ID";

    CometChat.addLoginListener(
      listenerID,
      new CometChat.LoginListener({
        loginSuccess: (user: CometChat.User) => {
          console.log("LoginListener :: loginSuccess", user);
        },
        loginFailure: (error: CometChat.CometChatException) => {
          console.log("LoginListener :: loginFailure", error);
        },
        logoutSuccess: () => {
          console.log("LoginListener :: logoutSuccess");
        },
        logoutFailure: (error: CometChat.CometChatException) => {
          console.log("LoginListener :: logoutFailure", error);
        },
      })
    );
    ```
  </Tab>
</Tabs>

## Remove Login Listener

To stop receiving events related to login and logout, use the `removeLoginListener()` method and pass the ID of the listener that needs to be removed.

<Tabs>
  <Tab title="JavaScript">
    ```javascript theme={null}
    var listenerID = "UNIQUE_LISTENER_ID";
    CometChat.removeLoginListener(listenerID);
    ```
  </Tab>

  <Tab title="TypeScript">
    ```typescript theme={null}
    var listenerID: string = "UNIQUE_LISTENER_ID";
    CometChat.removeLoginListener(listenerID);
    ```
  </Tab>
</Tabs>

<Warning>
  **Listener Cleanup:** Always remove your login listeners when they are no longer needed (e.g., when a component unmounts) to prevent memory leaks and unexpected behavior. Use `removeLoginListener()` with the same listener ID you used when adding it.
</Warning>

<AccordionGroup>
  <Accordion title="Best Practices">
    * Use unique, descriptive listener IDs to avoid conflicts (e.g., `"login-screen-listener"`)
    * Add listeners in component mount lifecycle and remove them on unmount
    * Handle all four events to provide a complete user experience
    * Use `loginFailure` to display user-friendly error messages
  </Accordion>

  <Accordion title="Troubleshooting">
    * **Listener not firing:** Ensure the listener was added before the login/logout event occurs
    * **Duplicate events:** Check that you're not adding the same listener multiple times without removing it first
    * **Memory leaks:** Verify that `removeLoginListener()` is called when the component unmounts
  </Accordion>
</AccordionGroup>

## Next Steps

<CardGroup cols={2}>
  <Card title="Authentication Overview" icon="lock" href="/sdk/react-native/authentication-overview">
    Learn about login methods and session management
  </Card>

  <Card title="User Presence" icon="circle-dot" href="/sdk/react-native/user-presence">
    Track real-time online/offline status of users
  </Card>

  <Card title="Connection Listener" icon="wifi" href="/sdk/react-native/managing-web-sockets-connections-manually">
    Monitor and manage WebSocket connection status
  </Card>

  <Card title="Send Messages" icon="paper-plane" href="/sdk/react-native/messaging">
    Start sending text, media, and custom messages
  </Card>
</CardGroup>