Components
ElvixDeactivate
ElvixDeactivate
State-aware Instagram-style temporary deactivation wizard with OTP gate for deactivate and one-click reactivate.
app/account/[app]/deactivate/page.tsx
"use client";import { ElvixDeactivate } from "@elvix.is/sdk/react";export function DeactivatePane({appId,appName,inactive,inactivatedBy,}: {appId: string;appName: string;inactive: boolean;inactivatedBy: string | null;}) {return (<ElvixDeactivateappId={appId}appName={appName}inactive={inactive}inactivatedBy={inactivatedBy}/>);}
Props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
appId | string | optional | provider app | App scope for the membership being paused or resumed. Accepts EITHER your public clientId OR the internal Application.id. Defaults to the <ElvixProvider> app. |
appName | string | optional | provider app name | Display name used in the warn and confirm copy. |
inactive | boolean | optional | membership flag from context | Drives flow selection. false runs warn1, warn2, otp, done. true collapses to a single reactivate confirm pane (no OTP). |
inactivatedBy | string | null | optional | null | Who paused the membership last. Surfaced in the reactivate pane copy. |
onSuccess | (state: "active" | "inactive") => void | optional | (none) | Fires BEFORE the in-frame done pane. If your callback unmounts the SDK (e.g. navigates), the done pane is skipped. |
onFail | (error: string) => void | optional | (none) | Notification hook. Always fires alongside the in-frame error pane. |
onResult | (r: ElvixDeactivateResult) => void | optional | (none) | Unified discriminated-union callback. On success r.state is the new membership state; on failure r.error plus optional r.message. |
Deactivate revokes the user's sessions for this app as part of the OTP-gated transition. Reactivate is benign and intentionally has no OTP. Don't wrap the reactivate pane in your own confirm dialog: the SDK already paints the single confirm step inside the frame.
onSuccess fires BEFORE the SDK transitions to its done pane. If your callback unmounts the component (for example by navigating), the done pane is skipped and the host wins. Leave the callback empty to keep the in-frame done pane.