> ## Documentation Index
> Fetch the complete documentation index at: https://learn.social.plus/llms.txt
> Use this file to discover all available pages before exploring further.

# Notification Tray Items

> Query notification tray items and mark individual items as seen.

Notification tray items are paginated notification records for the signed-in user. Use this API to render an in-app notification tray and then mark individual items as seen when the user opens or views them.

## Parameters

| Operation      | Parameter                     | Required | Platforms                | Description                                                            |
| -------------- | ----------------------------- | -------- | ------------------------ | ---------------------------------------------------------------------- |
| Query items    | `limit` / pagination handle   | No       | TypeScript, iOS, Android | Page-size and pagination controls where supported by the platform.     |
| Mark item seen | Item ID                       | Yes      | TypeScript               | Notification item ID to pass into `markItemsSeen`.                     |
| Mark item seen | `lastSeenAt`                  | Yes      | TypeScript               | ISO timestamp for when the item was seen.                              |
| Mark item seen | Notification tray item object | Yes      | iOS, Android             | Item returned by the tray item query; call `markSeen()` on the object. |

## Query Items

Query notification tray items for the signed-in user, keeping the pagination handle while the tray screen is active.

<CodeGroup>
  ```typescript TypeScript theme={null}
  import { notificationTray } from '@amityco/ts-sdk';

  let loadNextPage: (() => void) | undefined;
  let canLoadMore = false;

  const unsubscribe = notificationTray.getNotificationTrayItems(
    { limit: 20 },
    ({ data: items, onNextPage, hasNextPage, loading, error }) => {
      if (loading) return;
      if (error) {
        handleError(error);
        return;
      }

      renderResults(items);
      loadNextPage = onNextPage;
      canLoadMore = hasNextPage;
    },
  );

  function loadMoreNotificationItems() {
    if (canLoadMore) {
      loadNextPage?.();
    }
  }

  unsubscribe();
  ```

  ```swift iOS theme={null}
  token = client.notificationTray
      .getNotificationTrayItems()
      .observe { collection, error in
          if let error {
              handleError(error)
              return
          }

          showSuccessMessage(collection.snapshots.count)
      }
  ```

  ```kotlin Android theme={null}
  AmityCoreClient.notificationTray()
      .getNotificationTrayItems()
      .subscribe(
          { pagingData: PagingData<AmityNotificationTrayItem> -> showSuccessMessage(pagingData) },
          { error -> handleGeneralError(error) }
      )
  ```
</CodeGroup>

## Mark an Item Seen

Mark an individual notification item seen after the user opens or views that item.

<CodeGroup>
  ```typescript TypeScript theme={null}
  import { notificationTray } from '@amityco/ts-sdk';

  async function markNotificationItemSeen(notificationId: string) {
    await notificationTray.markItemsSeen([
      {
        id: notificationId,
        lastSeenAt: new Date().toISOString(),
      },
    ]);
  }
  ```

  ```swift iOS theme={null}
  token = client.notificationTray
      .getNotificationTrayItems()
      .observe { collection, error in
          if let error {
              handleError(error)
              return
          }

          guard let firstItem = collection.snapshots.first else { return }

          Task { @MainActor in
              do {
                  try await firstItem.markSeen()
              } catch {
                  handleError(error)
              }
          }
      }
  ```

  ```kotlin Android theme={null}
  fun markNotificationItemSeen(item: AmityNotificationTrayItem) {
      item.markSeen()
          .subscribe(
              { showSuccessMessage("seen") },
              { error -> handleGeneralError(error) }
          )
  }
  ```
</CodeGroup>

## Notes

* TypeScript marks one or more items by ID through `markItemsSeen`.
* iOS and Android expose `markSeen()` on the `AmityNotificationTrayItem` model returned by the tray item query.
* Use the platform-specific item ID field when routing from a tray item to a target screen: TypeScript `_id`, iOS `notificationId`, and Android `getId()`.
* Dispose live collection subscriptions or notification tokens when the notification tray screen is destroyed.

## Related Topics

<CardGroup cols={2}>
  <Card title="Notification Tray Status" href="./notification-tray-status" icon="check">
    Manage overall notification tray seen status.
  </Card>

  <Card title="Notification Events" href="./notification-events-reference" icon="bolt">
    Reference action and category values returned on tray items.
  </Card>
</CardGroup>
