useUpdateWalletEncryption

const {
  updateWalletEncryption,
  updateWalletEncryptionAsync,
  data,
  isLoading,
  isError,
  error,
  isSuccess,
  reset,
} = useUpdateWalletEncryption();

import { useUpdateWalletEncryption } from "@chipi-stack/chipi-react";
import { usePasskeySetup } from "@chipi-stack/chipi-passkey/hooks";
import { useAuth } from "@clerk/nextjs";

export function RotatePasskey({ wallet, userId }: {
  wallet: WalletData;
  userId: string;
}) {
  const { getToken } = useAuth();
  const { setupPasskey } = usePasskeySetup();
  const {
    updateWalletEncryptionAsync,
    isLoading,
    isSuccess,
    error,
  } = useUpdateWalletEncryption();

  const handleRotate = async () => {
    const bearerToken = await getToken();
    if (!bearerToken) return;

    try {
      // Create a new passkey (triggers biometric prompt). setupPasskey needs
      // userId + userName and returns an object — destructure encryptKey.
      const { encryptKey: newEncryptKey } = await setupPasskey(userId, userName);

      // Re-encrypt the private key client-side with the new key. There is no
      // `wallet.privateKey` — decrypt `wallet.encryptedPrivateKey` with the OLD
      // key first to recover the plaintext, then re-encrypt with the new one.
      // Keep plaintext key material in-memory only — never log or persist it.
      const plaintextKey = decrypt(wallet.encryptedPrivateKey, oldEncryptKey);
      const newEncryptedPrivateKey = encrypt(
        plaintextKey,
        newEncryptKey
      );

      await updateWalletEncryptionAsync({
        externalUserId: userId,
        newEncryptedPrivateKey,
        publicKey: wallet.publicKey,
        bearerToken,
      });

      alert("Passkey rotated successfully!");
    } catch (err) {
      console.error("Failed to rotate passkey:", err);
    }
  };

  return (
    <div>
      <button onClick={handleRotate} disabled={isLoading}>
        {isLoading ? "Updating..." : "Rotate Passkey"}
      </button>
      {isSuccess && <p>Encryption updated.</p>}
      {error && <p>Error: {error.message}</p>}
    </div>
  );
}