Skip to content
ThinkWork ThinkWork

Install & Setup

The fastest path from zero to “I can see my threads” in a React Native or Expo app.

1. Install

Section titled “1. Install”
Terminal window
pnpm add @thinkwork/react-native-sdk@beta
pnpm add amazon-cognito-identity-js expo-crypto expo-secure-store expo-web-browser graphql urql

The second line is the peer dependencies the SDK needs. You install them once; you won’t think about them again.

2. Wrap your app in the provider

Section titled “2. Wrap your app in the provider”

Find your app’s root component and wrap it:

import { ThinkworkProvider } from "@thinkwork/react-native-sdk";


export default function App() {
  return (
    <ThinkworkProvider config={config}>
      <YourAppScreens />
    </ThinkworkProvider>
  );
}

Everything inside that provider can call ThinkWork hooks. Anything outside can’t.

3. Fill in the config

Section titled “3. Fill in the config”

The config object tells the SDK which ThinkWork deployment to talk to:

const config = {
  graphqlUrl: process.env.EXPO_PUBLIC_THINKWORK_GRAPHQL_URL!,
  graphqlWsUrl: process.env.EXPO_PUBLIC_THINKWORK_GRAPHQL_WS_URL,
  cognito: {
    userPoolId: process.env.EXPO_PUBLIC_COGNITO_USER_POOL_ID!,
    userPoolClientId: process.env.EXPO_PUBLIC_COGNITO_CLIENT_ID!,
    region: "us-east-1",
    hostedUiDomain: process.env.EXPO_PUBLIC_COGNITO_HOSTED_UI_DOMAIN,
  },
  oauthRedirectUri: "myapp://oauth/callback",
};

Get these values from whoever runs your ThinkWork deployment — they fall out of the Terraform outputs. Store them as EXPO_PUBLIC_* env vars in your Expo config.

About the redirect URI: myapp:// is your app’s deep‑link scheme. In app.config.js, set scheme: "myapp" (or whatever you’re using) to match. This is how Google sign‑in knows how to come back to your app after the user authenticates.

4. Make sure your scheme is allowed

Section titled “4. Make sure your scheme is allowed”

Your deep‑link scheme has to be on the allowed list of the ThinkWork Cognito client. Today this means adding it to the mobile_callback_urls Terraform variable; in 0.3.0 this becomes a runtime setting that customer admins configure from the UI. Check with whoever runs your ThinkWork stage.

5. Sanity check

Section titled “5. Sanity check”

Drop this anywhere inside the provider to confirm everything is wired:

import { useThinkworkAuth } from "@thinkwork/react-native-sdk";


function AuthCheck() {
  const { status, user } = useThinkworkAuth();
  if (status === "unknown") return <Text>Loading…</Text>;
  if (status === "signed-out") return <Text>Not signed in</Text>;
  return <Text>Signed in as {user?.email}</Text>;
}

If you see “Not signed in” appear, the provider mounted and Cognito is reachable. You’re done with setup.

6. What next

Section titled “6. What next”