# salla-loyalty-points-history (https://docs.salla.dev/twilight/react/web-components/salla-loyalty-points-history)



{/* Generated by scripts/sync-web-components.mjs from the components docs.json. Do not edit by hand. */}

Customer account table of loyalty point transactions, with the current points balance on top. Use it on a loyalty or account page for a signed-in customer.
It takes no props. It loads the first page from `/balance/points` when the page is ready, and shows a "Load more" button while more pages are available. When there are no transactions it shows an empty state.
Each row shows points, date, expiry date, note and status.

## Use it [#use-it]

In HTML or JSX, use the tag `<salla-loyalty-points-history>` with the **Attribute** names below. In React, the wrapper takes the **Property** names (camelCase).

```tsx
import { SallaLoyaltyPointsHistory } from '@salla.sa/twilight-components-react/loyalty-points-history';
```

## Example [#example]

```tsx
import { SallaLoyaltyPointsHistory } from '@salla.sa/twilight-components-react/loyalty-points-history';

export function Example() {
  return (
    <SallaLoyaltyPointsHistory />
  );
}
```

```html
<salla-loyalty-points-history></salla-loyalty-points-history>
```

## Related [#related]

Renders: [`<salla-loading>`](https://docs.salla.dev/twilight/react/web-components/salla-loading), [`<salla-button>`](https://docs.salla.dev/twilight/react/web-components/salla-button).