Expo with Custom Auth

npx expo install @chipi-stack/chipi-expo

EXPO_PUBLIC_CHIPI_API_PUBLIC_KEY=your_chipi_api_public_key

// App.tsx

import { ChipiProvider } from "@chipi-stack/chipi-expo";

export default function App() {
  return (
    <YourAuthProvider>
      <ChipiProvider
        config={{
          apiPublicKey: process.env.EXPO_PUBLIC_CHIPI_API_PUBLIC_KEY || "",
        }}
      >
        <YourApp />
      </ChipiProvider>
    </YourAuthProvider>
  );
}

// components/CreateWallet.tsx

import { useState } from "react";
import { View, TextInput, TouchableOpacity, Text } from "react-native";
import { useCreateWallet } from "@chipi-stack/chipi-expo";

// Replace with your auth provider's token method
async function getBearerToken(): Promise<string> {
  // Auth0: const { getAccessTokenSilently } = useAuth0();
  // Cognito: const session = await Auth.currentSession();
  // Okta: const { authState } = useOktaAuth();
  return "your-jwt-token";
}

export default function CreateWallet() {
  const { createWalletAsync, isLoading } = useCreateWallet();
  const [encryptKey, setEncryptKey] = useState("");

  const handleCreateWallet = async () => {
    const bearerToken = await getBearerToken();

    const response = await createWalletAsync({
      params: { encryptKey },
      bearerToken,
    });

    console.log("Wallet created:", response.publicKey);
  };

  return (
    <View style={{ padding: 16, gap: 12 }}>
      <TextInput
        secureTextEntry
        placeholder="Enter encryption key"
        value={encryptKey}
        onChangeText={setEncryptKey}
        style={{ borderWidth: 1, borderColor: "#ccc", padding: 8, borderRadius: 4 }}
      />
      <TouchableOpacity
        onPress={handleCreateWallet}
        disabled={isLoading}
        style={{ backgroundColor: "#3b82f6", padding: 12, borderRadius: 4, opacity: isLoading ? 0.5 : 1 }}
      >
        <Text style={{ color: "white", textAlign: "center" }}>
          {isLoading ? "Creating..." : "Create Wallet"}
        </Text>
      </TouchableOpacity>
    </View>
  );
}