Provider & Status
Share a PrivacyClient through React context and observe its lifecycle.
SecuredProvider
SecuredProvider places a PrivacyClient instance in React context for all descendant hooks.
import { SecuredProvider } from '@secured-ai/react'
import { PrivacyClient } from '@secured-ai/core'
const client = new PrivacyClient({
baseUrl: 'https://dev-api.securedai.com',
sdkAccessToken: import.meta.env.VITE_SECURED_SDK_ACCESS_TOKEN,
})
export function Providers({ children }: { children: React.ReactNode }) {
return <SecuredProvider client={client}>{children}</SecuredProvider>
}Props
interface SecuredProviderProps {
client: PrivacyClient
autoInitialize?: boolean
children: React.ReactNode
}| Prop | Type | Default | Notes |
|---|---|---|---|
client | PrivacyClient | required | Shared client instance used by all hooks |
autoInitialize | boolean | true | Calls client.initialize() on mount in the browser |
children | ReactNode | required | Provider contents |
Auto-initialization
With the default autoInitialize={true}, the provider initializes the client once after mount. This is usually the simplest setup for app-wide detection.
If you need to coordinate initialization with your own app state, disable it:
<SecuredProvider client={client} autoInitialize={false}>
<App />
</SecuredProvider>Then call client.initialize() yourself from app code.
usePrivacyClient()
Returns the raw PrivacyClient instance from context.
import { usePrivacyClient } from '@secured-ai/react'
function AdvancedSettings() {
const client = usePrivacyClient()
function addEmployeePattern() {
client.addPattern({
name: 'employee-id',
pattern: /\bEMP-\d{6}\b/g,
entityType: 'REFERENCE_ID',
confidence: 0.95,
})
}
return <button onClick={addEmployeePattern}>Add Pattern</button>
}This hook throws if it is used outside SecuredProvider.
usePrivacyStatus()
Returns the current provider snapshot:
interface PrivacyStatusSnapshot {
isReady: boolean
isFullyReady: boolean
initProgress: InitProgress
readyEngines: string[]
error: Error | null
}Typical usage:
import { usePrivacyStatus } from '@secured-ai/react'
function StatusBanner() {
const status = usePrivacyStatus()
if (status.error) return <p>Initialization failed: {status.error.message}</p>
if (!status.isReady) return <p>Preparing privacy engines…</p>
if (!status.isFullyReady) return <p>Ready. Additional engines are still warming up.</p>
return <p>All privacy engines are ready.</p>
}isReady vs isFullyReady
isReadymeans at least one configured engine is ready and hooks can safely call into the client.isFullyReadymeans every configured engine is ready, including slower semantic engines like HuggingFace or GLiNER when enabled.
readyEngines mirrors the concrete engine names that are currently ready on the client instance.
Session reactivity
SecuredProvider also maintains a lightweight session subscription layer for useSessions(). When hooks like useObfuscate() create a session, or when useSessions() clears one, subscribers re-render without polling.