Skip to content

Persistence and show-once

A first-run tour should fire once and never nag again. Guideway handles this with a showOnce flag plus a storage adapter you provide.

Pass a storage adapter to the provider. It matches the shape of AsyncStorage and MMKV, and accepts sync or async implementations - pass whatever your app already uses.

import AsyncStorage from '@react-native-async-storage/async-storage';
<TourProvider tours={tours} storage={AsyncStorage}>{/* ... */}</TourProvider>

Set showOnce: true on the tour. The first unseen showOnce tour auto-starts when the provider mounts.

const tours = [
{
id: 'welcome',
showOnce: true,
steps: [
{ id: 'inbox', title: 'Your inbox', body: 'Everything lands here.' },
{ id: 'compose', title: 'Compose', body: 'Start a new message.' },
],
},
];

The tour is marked seen up front, so it shows exactly once even if the app is killed mid-tour. Without a storage adapter, showOnce is a no-op.

To let a tour run again - a “replay the tour” button, for example - clear its seen flag with reset(tourId) from the controller:

const { reset } = useTour();
<Button title="Replay tour" onPress={() => reset('welcome')} />

Guideway also exports clearSeen(tourId, storage, prefix?) and seenKey(tourId, prefix?) for use outside a component.

Persisted flags are stored under guideway:seen:<tourId>. Change the prefix with storageKeyPrefix:

<TourProvider tours={tours} storage={AsyncStorage} storageKeyPrefix="myapp:onboarding:" />