{
  "name": "wallet-integrations-oauthrestoreform",
  "type": "registry:component",
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "components/wallet-integrations/OAuthRestoreForm.tsx",
      "type": "registry:component",
      "content": "\"use client\";\nimport type React from \"react\";\nimport { useState } from \"react\";\nimport type { OAuthProvider } from \"../../lib/types.js\";\nimport { cn } from \"../../lib/utils.js\";\nimport { ErrorDisplay } from \"../ui-components/ErrorDisplay.js\";\nimport { LoadingButton } from \"../ui-components/LoadingButton.js\";\nimport { PasswordInput } from \"../ui-components/PasswordInput.js\";\nimport { WarningCard } from \"../ui-components/WarningCard.js\";\nimport { Alert, AlertDescription, AlertTitle } from \"../ui/alert.js\";\n\nexport interface OAuthRestoreFormProps {\n\tprovider: OAuthProvider;\n\tencryptedBackup: string;\n\tonSuccess: (decryptedBackup: string) => void;\n\tonError?: (error: Error) => void;\n\tclassName?: string;\n}\n\nexport function OAuthRestoreForm({\n\tprovider,\n\tencryptedBackup,\n\tonSuccess,\n\tonError,\n\tclassName = \"\",\n}: OAuthRestoreFormProps) {\n\tconst [password, setPassword] = useState(\"\");\n\tconst [loading, setLoading] = useState(false);\n\tconst [error, setError] = useState(\"\");\n\n\tconst providerInfo: Record<string, { name: string; icon: React.ReactNode }> =\n\t\t{\n\t\t\tgoogle: {\n\t\t\t\tname: \"Google\",\n\t\t\t\ticon: (\n\t\t\t\t\t<svg\n\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\taria-label=\"Google icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<title>Google</title>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"#4285F4\"\n\t\t\t\t\t\t\td=\"M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"#34A853\"\n\t\t\t\t\t\t\td=\"M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"#FBBC05\"\n\t\t\t\t\t\t\td=\"M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"#EA4335\"\n\t\t\t\t\t\t\td=\"M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</svg>\n\t\t\t\t),\n\t\t\t},\n\t\t\tgithub: {\n\t\t\t\tname: \"GitHub\",\n\t\t\t\ticon: (\n\t\t\t\t\t<svg\n\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\taria-label=\"GitHub icon\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<title>GitHub</title>\n\t\t\t\t\t\t<path d=\"M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.30.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t),\n\t\t\t},\n\t\t\ttwitter: {\n\t\t\t\tname: \"X\",\n\t\t\t\ticon: (\n\t\t\t\t\t<svg width=\"20\" height=\"20\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n\t\t\t\t\t\t<title>X (Twitter)</title>\n\t\t\t\t\t\t<path d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\" />\n\t\t\t\t\t</svg>\n\t\t\t\t),\n\t\t\t},\n\t\t};\n\n\tconst info = providerInfo[provider] || { name: provider, icon: null };\n\n\tconst handleSubmit = async (e: React.FormEvent) => {\n\t\te.preventDefault();\n\t\tsetLoading(true);\n\t\tsetError(\"\");\n\n\t\ttry {\n\t\t\t// Import decryption function\n\t\t\tconst { decryptBackup } = await import(\"bitcoin-backup\");\n\n\t\t\t// Try to decrypt the backup\n\t\t\tconst decrypted = await decryptBackup(encryptedBackup, password);\n\n\t\t\tif (!decrypted) {\n\t\t\t\tthrow new Error(\"Invalid backup format\");\n\t\t\t}\n\n\t\t\t// Success - pass the decrypted backup as string\n\t\t\tonSuccess(JSON.stringify(decrypted));\n\t\t} catch (err) {\n\t\t\tconsole.error(\"Decryption error:\", err);\n\t\t\tconst errorMessage =\n\t\t\t\terr instanceof Error && err.message.includes(\"Invalid passphrase\")\n\t\t\t\t\t? \"Incorrect password. Please try again.\"\n\t\t\t\t\t: \"Failed to decrypt backup. Please check your password.\";\n\t\t\tsetError(errorMessage);\n\t\t\tonError?.(new Error(errorMessage));\n\t\t} finally {\n\t\t\tsetLoading(false);\n\t\t}\n\t};\n\n\treturn (\n\t\t<div className={cn(\"flex flex-col gap-6\", className)}>\n\t\t\t<div className=\"flex flex-col items-center gap-4\">\n\t\t\t\t<div className=\"flex justify-center\">{info.icon}</div>\n\t\t\t\t<h1 className=\"text-3xl font-bold text-center\">Welcome Back!</h1>\n\t\t\t\t<p className=\"text-muted-foreground text-center\">\n\t\t\t\t\tWe found your backup linked to {info.name}\n\t\t\t\t</p>\n\t\t\t</div>\n\n\t\t\t<Alert className=\"border-green-200 bg-green-50\">\n\t\t\t\t<svg\n\t\t\t\t\twidth=\"16\"\n\t\t\t\t\theight=\"16\"\n\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\tviewBox=\"0 0 20 20\"\n\t\t\t\t\tclassName=\"text-green-600\"\n\t\t\t\t>\n\t\t\t\t\t<title>Check Circle</title>\n\t\t\t\t\t<path\n\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\td=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t/>\n\t\t\t\t</svg>\n\t\t\t\t<AlertTitle className=\"font-medium\">Backup Found</AlertTitle>\n\t\t\t\t<AlertDescription>\n\t\t\t\t\tYour encrypted backup was successfully retrieved from {info.name}.\n\t\t\t\t\tEnter your password to decrypt it.\n\t\t\t\t</AlertDescription>\n\t\t\t</Alert>\n\n\t\t\t<ErrorDisplay error={error} />\n\n\t\t\t<form onSubmit={handleSubmit}>\n\t\t\t\t<div className=\"flex flex-col gap-4\">\n\t\t\t\t\t<PasswordInput\n\t\t\t\t\t\tlabel=\"Backup Password\"\n\t\t\t\t\t\tvalue={password}\n\t\t\t\t\t\tonChange={setPassword}\n\t\t\t\t\t\tplaceholder=\"Enter your backup password\"\n\t\t\t\t\t\tdisabled={loading}\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t/>\n\n\t\t\t\t\t<LoadingButton\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\tdisabled={!password}\n\t\t\t\t\t\tloading={loading}\n\t\t\t\t\t\tloadingText=\"Decrypting...\"\n\t\t\t\t\t\tclassName=\"w-full\"\n\t\t\t\t\t>\n\t\t\t\t\t\tUnlock Wallet\n\t\t\t\t\t</LoadingButton>\n\t\t\t\t</div>\n\t\t\t</form>\n\n\t\t\t<WarningCard message=\"If you've forgotten your password, you'll need to use your recovery phrase to restore your wallet.\" />\n\t\t</div>\n\t);\n}\n",
      "target": "<%- config.aliases.components %>/oauthrestoreform.tsx"
    }
  ]
}