Zuno Store

Technical documentation for the Zuno Store feature. For a general overview, see the Zuno Store guide.

File Structure

src/
├── app/(app)/(tabs)/shop/
│   ├── _layout.tsx                # Stack layout with SHOW_SHOP_CONTENT guard
│   ├── shop-introduction.tsx      # Re-exports ShopIntroduction component
│   └── shop-unavailable.tsx       # Re-exports ShopUnavailable component
├── app/(non-auth)/(tabs)/shop/
│   ├── _layout.tsx                # Stack layout with SHOW_SHOP_CONTENT guard (identical to auth)
│   ├── shop-introduction.tsx      # Re-exports ShopIntroduction component
│   └── shop-unavailable.tsx       # Re-exports ShopUnavailable component
├── app/
│   └── shop-webview.tsx           # WebView — shared root-level route (auth and non-auth)
├── components/shop/
│   ├── MenuDropdown/              # Dropdown menu component
│   │   ├── MenuDropdown.tsx
│   │   └── index.tsx
│   ├── ShopIntroduction/          # Introduction screen component
│   │   ├── ShopIntroduction.tsx
│   │   └── index.ts
│   └── ShopUnavailable/           # Unavailable screen component
│       ├── ShopUnavailable.tsx
│       └── index.ts
├── types/posthog/
│   └── flags.ts                   # Feature flag enum definitions
└── utils/posthog/
    └── usePostHogFlags.ts         # PostHog hooks for flags

Feature Flags

Both flags are defined in src/types/posthog/flags.ts:

export enum PostHogFlags {
  HIDE_SHOP_NAV = 'hide-shop-nav',
  SHOW_SHOP_CONTENT = 'show-shop-content',
}

HIDE_SHOP_NAV

Controls visibility of the Store tab in main navigation.

• Located in src/app/(app)/(tabs)/_layout.tsx
• Uses <Tabs.Protected> guard with the useIsShopTabDisabled() hook
• When true, the Store tab is hidden from the tab bar

const isShopTabDisabled = useIsShopTabDisabled();

<Tabs.Protected guard={!isShopTabDisabled}>
  <Tabs.Screen name="shop" {...} />
</Tabs.Protected>

SHOW_SHOP_CONTENT

Controls whether users can shop or see a maintenance screen.

• Located in src/app/(app)/(tabs)/shop/index.tsx
• Redirects to shop-introduction or shop-unavailable based on flag value

const isShopContentEnabled = useIsShopContentEnabled();

return (
  <Redirect
    href={isShopContentEnabled ? '/shop/shop-introduction' : '/shop/shop-unavailable'}
  />
);

WebView

URL: https://zuno.store/?utm_source=zuno_app&utm_medium=mobile

The shop WebView (src/app/shop-webview.tsx) is a shared root-level route accessible from both auth and non-auth flows. It opens the Shopify-hosted store inside the app.

Navigation State Tracking

The WebView tracks navigation state for contextual UI updates:

onNavigationStateChange={(navState) => {
  setCanGoBack(navState.canGoBack);
  setCurrentUrl(navState.url);
  setPageTitle(navState.title || 'Zuno Store');
}}

Header

• Back — Goes to previous page in WebView history, or closes the WebView if on the first page
• Close — Exits the WebView. Only visible when there's history to go back to
• Page title — Current page title from the WebView, defaults to "Zuno Store"
• Domain — Static display of zuno.store
• Chat — Opens Intercom with contact intention ZUNO_STORE. Non-authenticated users get an anonymous Intercom session via loginUnidentifiedUser() before the space is presented
• More menu — Copy link to clipboard, or open in external browser

Session Persistence

sharedCookiesEnabled={true} uses the platform's shared cookie store, maintaining login state and cart between visits within the app.

Unavailable Screen

Displays when SHOW_SHOP_CONTENT is disabled. Shows a maintenance message and a "Contact us" button that opens Intercom with the ZUNO_STORE contact intention. Non-authenticated users get an anonymous Intercom session via loginUnidentifiedUser() before the space is presented.

Testing

Feature Flags

1. Shop tab hidden: Set HIDE_SHOP_NAV to true in PostHog — verify the tab disappears
2. Store unavailable: Set SHOW_SHOP_CONTENT to false — verify the unavailable screen appears
3. Store available: Set SHOW_SHOP_CONTENT to true — verify introduction screen appears and "Start shopping" opens the WebView

WebView

• Navigate to a product page, verify the close button appears
• Tap back — should go to previous page; tap close — should exit
• Tap ⋯ → "Copy link" — verify notification and correct URL
• Tap ⋯ → "Open in external browser" — verify it opens in Safari/Chrome
• Tap chat icon — verify Intercom opens with ZUNO_STORE intention