# autoRefresh

> Why JS: reloading a list on an interval, and pausing while the tab is hidden, needs a timer and the Page Visibility API.

```ts
import { autoRefresh } from "@sdxc/ui/app";
```

Runs a RefreshSchedule while the host `<time>` is in the document, counted from the
host's own `datetime`. It pauses while the page is hidden, catches up with one reload when
shown, sets `data-paused` meanwhile, and rewrites the host's `datetime` and text after each reload.

## Signature

```ts
autoRefresh(options: AutoRefreshTimer.Options): MixinDescriptor<HTMLTimeElement>
```

## Parameters

| Parameter | Type | Description |
| --- | --- | --- |
| `options` | `AutoRefreshTimer.Options` |  |

## Examples

```tsx
<time dateTime={iso} mix={[autoRefresh({ every: 30_000, reload: () => handle.frames.top.reload() })]}>{text}</time>
```

## Used with it

The events, constants and types its module publishes, each imported from `@sdxc/ui/app` too.

### AutoRefreshTimer.Options

Configuration for autoRefresh, read when the host is inserted.

#### Members

| Member | Type | Description |
| --- | --- | --- |
| `every` | `number` | Milliseconds between reloads; 0 or less leaves the host as rendered. |
| `reload` | `() => Promise<unknown>` | Reloads the frame or page the list lives in. |
| `locale?` | `string` | Locale the refreshed time is written in. Defaults to the runtime's. |