Change Password

package com.example.sessiontest

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.input.KeyboardOptions
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.unit.dp
import androidx.lifecycle.ViewModel
import androidx.lifecycle.viewModelScope
import androidx.lifecycle.viewmodel.compose.viewModel
import kotlinx.coroutines.launch
import so.prelude.android.auth.*
import java.net.URL

private const val APP_ID = "YOUR_APP_ID"

enum class CpView { Login, Logged, StepUpOtp, NewPassword, Done }

class ChangePasswordViewModel(ctx: android.content.Context) : ViewModel() {
    val client = PreludeAuthClient(
        context = ctx,
        baseUrl = URL("https://$APP_ID.session.prelude.dev"),
    )

    var view by mutableStateOf(CpView.Login); private set
    var error by mutableStateOf<String?>(null); private set
    private var challenge: PreludeStepUpChallenge? = null

    fun login(email: String, password: String) {
        error = null
        viewModelScope.launch {
            try {
                client.loginWithPassword(
                    LoginWithPasswordOptions(identifier = email, password = password),
                )
                view = CpView.Logged
            } catch (e: PreludeAuthError) { error = e.message }
        }
    }

    fun startChangePassword() {
        error = null
        viewModelScope.launch {
            try {
                val c = client.requestStepUp("prld:pwd:write")
                if (c.status == PreludeStepUpStatus.BLOCKED) {
                    error = "Couldn't change your password — please try again later."
                    return@launch
                }
                if (c.currentStep in setOf("verify_email", "verify_sms")) {
                    client.sendStepUpOTP(c)
                }
                challenge = c
                view = CpView.StepUpOtp
            } catch (e: PreludeAuthError) { error = e.message }
        }
    }

    fun submitOtp(code: String) {
        val c = challenge ?: return
        error = null
        viewModelScope.launch {
            try {
                val next = client.submitStepUpOTP(c, code)
                if (next != null) {
                    challenge = next  // unusual: more than one step
                } else {
                    view = CpView.NewPassword  // scope granted
                }
            } catch (e: PreludeAuthError.InvalidOTPCode) { error = "Wrong code." }
            catch (e: PreludeAuthError) { error = e.message }
        }
    }

    fun savePassword(newPassword: String) {
        error = null
        viewModelScope.launch {
            try {
                client.changePassword(RedactedString(newPassword))
                view = CpView.Done
            } catch (e: PreludeAuthError) { error = e.message }
        }
    }
}

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MaterialTheme {
                Surface {
                    val vm: ChangePasswordViewModel = viewModel(factory = viewModelFactory(applicationContext))
                    var email by remember { mutableStateOf("") }
                    var password by remember { mutableStateOf("") }
                    var otp by remember { mutableStateOf("") }
                    var newPassword by remember { mutableStateOf("") }

                    Column(Modifier.fillMaxSize().padding(24.dp)) {
                        Text("Change Password Demo", style = MaterialTheme.typography.titleMedium)
                        Spacer(Modifier.height(12.dp))
                        vm.error?.let {
                            Text(it, color = MaterialTheme.colorScheme.error)
                            Spacer(Modifier.height(8.dp))
                        }
                        when (vm.view) {
                            CpView.Login -> {
                                OutlinedTextField(email, { email = it },
                                    label = { Text("user@example.com") },
                                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Email),
                                    modifier = Modifier.fillMaxWidth())
                                Spacer(Modifier.height(8.dp))
                                OutlinedTextField(password, { password = it },
                                    label = { Text("Current password") },
                                    visualTransformation = PasswordVisualTransformation(),
                                    modifier = Modifier.fillMaxWidth())
                                Spacer(Modifier.height(12.dp))
                                Button(onClick = { vm.login(email, password) }) { Text("Log in") }
                            }
                            CpView.Logged -> {
                                Text("Logged in.")
                                Spacer(Modifier.height(8.dp))
                                Button(onClick = { vm.startChangePassword() }) {
                                    Text("Change password")
                                }
                            }
                            CpView.StepUpOtp -> {
                                Text("Enter the code we just sent you.")
                                OutlinedTextField(otp, { otp = it },
                                    label = { Text("OTP code") },
                                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
                                    modifier = Modifier.fillMaxWidth())
                                Spacer(Modifier.height(8.dp))
                                Button(onClick = { vm.submitOtp(otp) }) { Text("Verify") }
                            }
                            CpView.NewPassword -> {
                                Text("Choose a new password.")
                                OutlinedTextField(newPassword, { newPassword = it },
                                    label = { Text("New password") },
                                    visualTransformation = PasswordVisualTransformation(),
                                    modifier = Modifier.fillMaxWidth())
                                Spacer(Modifier.height(8.dp))
                                Button(onClick = { vm.savePassword(newPassword) }) { Text("Save") }
                            }
                            CpView.Done -> {
                                Text("Password updated.", style = MaterialTheme.typography.titleSmall)
                                Text("`prld:pwd:write` has been consumed.",
                                    style = MaterialTheme.typography.bodySmall)
                            }
                        }
                    }
                }
            }
        }
    }
}

import 'package:flutter/material.dart';
import 'package:prelude_flutter_auth_sdk/prelude_flutter_auth_sdk.dart';

const appID = 'YOUR_APP_ID';

void main() => runApp(const MyApp());

enum _Screen { login, logged, stepUpOtp, newPassword, done }

class MyApp extends StatefulWidget {
  const MyApp({super.key});
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late final client = PreludeAuthClient(
    endpoint: Endpoint.custom('https://$appID.session.prelude.dev'),
  );

  final _email = TextEditingController();
  final _password = TextEditingController();
  final _otp = TextEditingController();
  final _newPassword = TextEditingController();

  _Screen _view = _Screen.login;
  StepUpChallenge? _challenge;
  String? _error;

  Future<void> _login() async {
    setState(() => _error = null);
    try {
      await client.loginWithPassword(
        LoginWithPasswordOptions(
          emailAddress: _email.text,
          password: _password.text,
        ),
      );
      setState(() => _view = _Screen.logged);
    } on PreludeAuthException catch (e) {
      setState(() => _error = e.message);
    }
  }

  Future<void> _startChangePassword() async {
    setState(() => _error = null);
    try {
      final c = await client.requestStepUp(scope: 'prld:pwd:write');
      if (c.status == StepUpStatus.blocked) {
        setState(() => _error = 'Couldn\'t change your password — please try again later.');
        return;
      }
      if (c.currentStep == 'verify_email' ||
          c.currentStep == 'verify_sms') {
        await client.sendStepUpOTP(c);
      }
      setState(() {
        _challenge = c;
        _view = _Screen.stepUpOtp;
      });
    } on PreludeAuthException catch (e) {
      setState(() => _error = e.message);
    }
  }

  Future<void> _submitOtp() async {
    final c = _challenge;
    if (c == null) return;
    setState(() => _error = null);
    try {
      final next = await client.submitStepUpOTP(c, _otp.text);
      if (next != null) {
        setState(() => _challenge = next); // unusual: more than one step
      } else {
        setState(() => _view = _Screen.newPassword); // scope granted
      }
    } on InvalidOTPCodeException {
      setState(() => _error = 'Wrong code.');
    } on PreludeAuthException catch (e) {
      setState(() => _error = e.message);
    }
  }

  Future<void> _savePassword() async {
    setState(() => _error = null);
    try {
      await client.changePassword(RedactedString(_newPassword.text));
      setState(() => _view = _Screen.done);
    } on PreludeAuthException catch (e) {
      setState(() => _error = e.message);
    }
  }

  @override
  void dispose() {
    _email.dispose();
    _password.dispose();
    _otp.dispose();
    _newPassword.dispose();
    client.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    Widget body;
    switch (_view) {
      case _Screen.login:
        body = Column(mainAxisSize: MainAxisSize.min, children: [
          TextField(
            controller: _email,
            keyboardType: TextInputType.emailAddress,
            decoration: const InputDecoration(labelText: 'user@example.com'),
          ),
          const SizedBox(height: 8),
          TextField(
            controller: _password,
            obscureText: true,
            decoration: const InputDecoration(labelText: 'Current password'),
          ),
          const SizedBox(height: 12),
          FilledButton(onPressed: _login, child: const Text('Log in')),
        ]);
      case _Screen.logged:
        body = Column(mainAxisSize: MainAxisSize.min, children: [
          const Text('Logged in.'),
          const SizedBox(height: 12),
          FilledButton(
            onPressed: _startChangePassword,
            child: const Text('Change password'),
          ),
        ]);
      case _Screen.stepUpOtp:
        body = Column(mainAxisSize: MainAxisSize.min, children: [
          const Text('Enter the code we just sent you.'),
          TextField(
            controller: _otp,
            keyboardType: TextInputType.number,
            decoration: const InputDecoration(labelText: 'OTP code'),
          ),
          const SizedBox(height: 12),
          FilledButton(onPressed: _submitOtp, child: const Text('Verify')),
        ]);
      case _Screen.newPassword:
        body = Column(mainAxisSize: MainAxisSize.min, children: [
          const Text('Choose a new password.'),
          TextField(
            controller: _newPassword,
            obscureText: true,
            decoration: const InputDecoration(labelText: 'New password'),
          ),
          const SizedBox(height: 12),
          FilledButton(onPressed: _savePassword, child: const Text('Save')),
        ]);
      case _Screen.done:
        body = Column(mainAxisSize: MainAxisSize.min, children: const [
          Text('Password updated.', style: TextStyle(fontSize: 18)),
          SizedBox(height: 8),
          Text('`prld:pwd:write` has been consumed.',
              style: TextStyle(color: Colors.grey)),
        ]);
    }

    return MaterialApp(
      home: Scaffold(
        body: Padding(
          padding: const EdgeInsets.all(24),
          child: Center(
            child: Column(mainAxisSize: MainAxisSize.min, children: [
              const Text('Change Password Demo', style: TextStyle(fontSize: 18)),
              const SizedBox(height: 12),
              if (_error != null) ...[
                Text(_error!, style: const TextStyle(color: Colors.red)),
                const SizedBox(height: 8),
              ],
              body,
            ]),
          ),
        ),
      ),
    );
  }
}

import {
  Endpoint,
  InvalidOTPCodeError,
  PreludeAuthClient,
  PreludeAuthError,
  RedactedString,
  StepUpChallenge,
} from "@prelude.so/react-native-auth-sdk";
import { useEffect, useRef, useState } from "react";
import { Button, Text, TextInput, View } from "react-native";

const APP_ID = "YOUR_APP_ID";

type Stage = "login" | "logged" | "stepUpOtp" | "newPassword" | "done";

export default function Home() {
  const clientRef = useRef<PreludeAuthClient | null>(null);
  const [stage, setStage] = useState<Stage>("login");
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [otp, setOtp] = useState("");
  const [newPassword, setNewPassword] = useState("");
  const challengeRef = useRef<StepUpChallenge | null>(null);
  const [error, setError] = useState<string | null>(null);

  useEffect(() => {
    const c = new PreludeAuthClient({
      endpoint: Endpoint.custom(`https://${APP_ID}.session.prelude.dev`),
    });
    clientRef.current = c;
    return () => { c.dispose().catch(() => {}); };
  }, []);

  async function run(fn: () => Promise<void>) {
    setError(null);
    try { await fn(); }
    catch (e) {
      if (e instanceof InvalidOTPCodeError) setError("Wrong code.");
      else if (e instanceof PreludeAuthError) setError(e.message);
      else setError(String(e));
    }
  }

  const login = () => run(async () => {
    await clientRef.current!.loginWithPassword({
      emailAddress: email,
      password: new RedactedString(password),
    });
    setStage("logged");
  });

  const startChangePassword = () => run(async () => {
    const c = await clientRef.current!.requestStepUp("prld:pwd:write");
    if (c.status === "block") {
      setError("Couldn't change your password — please try again later.");
      return;
    }
    if (c.currentStep === "verify_email" || c.currentStep === "verify_sms") {
      await clientRef.current!.sendStepUpOTP(c);
    }
    challengeRef.current = c;
    setStage("stepUpOtp");
  });

  const submitOtp = () => run(async () => {
    const c = challengeRef.current;
    if (!c) return;
    const next = await clientRef.current!.submitStepUpOTP(c, otp);
    if (next !== null) {
      if (next.currentStep === "verify_email" || next.currentStep === "verify_sms") {
        await clientRef.current!.sendStepUpOTP(next);
      }
      challengeRef.current = next;
    } else {
      setStage("newPassword");
    }
  });

  const savePassword = () => run(async () => {
    await clientRef.current!.changePassword(new RedactedString(newPassword));
    setStage("done");
  });

  return (
    <View style={{ padding: 24, gap: 8 }}>
      <Text style={{ fontSize: 18 }}>Change Password Demo</Text>
      {error && <Text style={{ color: "red" }}>{error}</Text>}
      {stage === "login" && (
        <>
          <TextInput
            placeholder="user@example.com"
            value={email}
            onChangeText={setEmail}
            autoCapitalize="none"
            keyboardType="email-address"
            style={{ borderWidth: 1, padding: 8 }}
          />
          <TextInput
            placeholder="Current password"
            value={password}
            onChangeText={setPassword}
            secureTextEntry
            style={{ borderWidth: 1, padding: 8 }}
          />
          <Button title="Log in" onPress={login} />
        </>
      )}
      {stage === "logged" && (
        <Button title="Change password" onPress={startChangePassword} />
      )}
      {stage === "stepUpOtp" && (
        <>
          <Text>Enter the code we just sent you.</Text>
          <TextInput
            placeholder="OTP code"
            value={otp}
            onChangeText={setOtp}
            keyboardType="number-pad"
            style={{ borderWidth: 1, padding: 8 }}
          />
          <Button title="Verify" onPress={submitOtp} />
        </>
      )}
      {stage === "newPassword" && (
        <>
          <Text>Choose a new password.</Text>
          <TextInput
            placeholder="New password"
            value={newPassword}
            onChangeText={setNewPassword}
            secureTextEntry
            style={{ borderWidth: 1, padding: 8 }}
          />
          <Button title="Save" onPress={savePassword} />
        </>
      )}
      {stage === "done" && (
        <>
          <Text style={{ fontWeight: "600" }}>Password updated.</Text>
          <Text>`prld:pwd:write` has been consumed.</Text>
        </>
      )}
    </View>
  );
}