Authentication
TheuseCustomer hook provides full authentication lifecycle management.
Hook API
function useCustomer(): {
customer: unknown | null; // full customer profile
loading: boolean;
error: Error | null;
login: (email: string, password: string) => Promise<void>;
logout: () => Promise<void>;
createAccount: (input: {
email: string;
password: string;
firstName?: string;
lastName?: string;
phone?: string;
acceptsMarketing?: boolean;
}) => Promise<void>;
recoverPassword: (email: string) => Promise<void>;
refetch: () => Promise<void>;
}
Login
import { useCustomer } from 'react-native-stackfront-sdk';
function LoginScreen() {
const { login, loading, error } = useCustomer();
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
const handleLogin = async () => {
try {
await login(email, password);
// On success: token is stored, customer data is fetched,
// cart buyer identity is linked, and 'login' event is tracked
navigateToHome();
} catch {
// error state is set automatically
}
};
return (
<View>
<Input value={email} onChangeText={setEmail} placeholder="Email" />
<Input value={password} onChangeText={setPassword} placeholder="Password" secureTextEntry />
{error && <Text style={errorText}>{error.message}</Text>}
<Button title="Log In" onPress={handleLogin} disabled={loading} />
</View>
);
}
Register
const { createAccount, loading, error } = useCustomer();
const handleRegister = async () => {
try {
await createAccount({
email: 'user@example.com',
password: 'securePassword123',
firstName: 'Jane',
lastName: 'Doe',
acceptsMarketing: true,
});
// 'account_created' event is tracked automatically
navigateToLogin();
} catch {
// handle errors
}
};
Registration creates the customer but does NOT log them in. Call login separately after registration.
Logout
const { logout } = useCustomer();
const handleLogout = async () => {
await logout();
// Token is deleted from Shopify and cleared locally
// 'logout' event is tracked
// customer data resets to null
};
Password Recovery
const { recoverPassword } = useCustomer();
await recoverPassword('user@example.com');
// Shopify sends a password reset email
Service API
For imperative access:const { customer } = useStackfront();
await customer.login({ email, password });
await customer.logout();
await customer.create({ email, password, firstName });
await customer.getCustomer();
await customer.recoverPassword(email);
customer.setAccessToken(token);
customer.getAccessToken(); // returns string | null