prettier/docs

tkhq · Dec 5, 2023 · b3fc41d · b3fc41d
1 parent 7a89d56
commit b3fc41d
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 77 deletions.
diff --git a/README.md b/README.md
@@ -6,14 +6,15 @@ API Docs: https://docs.turnkey.com/
 
 ## Packages
 
-| Package                                                   | NPM                                                                                                                                       | Description                                                           | Changelog                                            |
-| --------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- | ---------------------------------------------------- |
-| [`@turnkey/ethers`](/packages/ethers)                     | [![npm](https://img.shields.io/npm/v/@turnkey/ethers?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/ethers)                     | Turnkey Signer for Ethers                                             | [CHANGELOG](/packages/ethers/CHANGELOG.md)           |
-| [`@turnkey/viem`](/packages/viem)                         | [![npm](https://img.shields.io/npm/v/@turnkey/viem?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/viem)                         | (Experimental) Turnkey Helpers to work with Viem                      | [CHANGELOG](/packages/viem/CHANGELOG.md)             |
-| [`@turnkey/cosmjs`](/packages/cosmjs)                     | [![npm](https://img.shields.io/npm/v/@turnkey/cosmjs?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/cosmjs)                     | (Experimental) Turnkey Cosmos Signer for CosmJS                       | [CHANGELOG](/packages/cosmjs/CHANGELOG.md)           |
-| [`@turnkey/http`](/packages/http)                         | [![npm](https://img.shields.io/npm/v/@turnkey/http?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/http)                         | Lower-level, fully typed HTTP client for interacting with Turnkey API | [CHANGELOG](/packages/http/CHANGELOG.md)             |
-| [`@turnkey/api-key-stamper`](/packages/api-key-stamper)   | [![npm](https://img.shields.io/npm/v/@turnkey/api-key-stamper?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/api-key-stamper)   | Provide API key signatures over Turnkey requests                      | [CHANGELOG](/packages/api-key-stamper/CHANGELOG.md)  |
-| [`@turnkey/webauthn-stamper`](/packages/webauthn-stamper) | [![npm](https://img.shields.io/npm/v/@turnkey/webauthn-stamper?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/webauthn-stamper) | Provide Webauthn signatures over Turnkey requests                     | [CHANGELOG](/packages/webauthn-stamper/CHANGELOG.md) |
+| Package                                                   | NPM                                                                                                                                       | Description                                                             | Changelog                                            |
+| --------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- | ---------------------------------------------------- |
+| [`@turnkey/ethers`](/packages/ethers)                     | [![npm](https://img.shields.io/npm/v/@turnkey/ethers?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/ethers)                     | Turnkey Signer for Ethers                                               | [CHANGELOG](/packages/ethers/CHANGELOG.md)           |
+| [`@turnkey/viem`](/packages/viem)                         | [![npm](https://img.shields.io/npm/v/@turnkey/viem?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/viem)                         | (Experimental) Turnkey Helpers to work with Viem                        | [CHANGELOG](/packages/viem/CHANGELOG.md)             |
+| [`@turnkey/cosmjs`](/packages/cosmjs)                     | [![npm](https://img.shields.io/npm/v/@turnkey/cosmjs?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/cosmjs)                     | (Experimental) Turnkey Cosmos Signer for CosmJS                         | [CHANGELOG](/packages/cosmjs/CHANGELOG.md)           |
+| [`@turnkey/http`](/packages/http)                         | [![npm](https://img.shields.io/npm/v/@turnkey/http?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/http)                         | Lower-level, fully typed HTTP client for interacting with Turnkey API   | [CHANGELOG](/packages/http/CHANGELOG.md)             |
+| [`@turnkey/api-key-stamper`](/packages/api-key-stamper)   | [![npm](https://img.shields.io/npm/v/@turnkey/api-key-stamper?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/api-key-stamper)   | Provide API key signatures over Turnkey requests                        | [CHANGELOG](/packages/api-key-stamper/CHANGELOG.md)  |
+| [`@turnkey/iframe-stamper`](/packages/iframe-stamper)     | [![npm](https://img.shields.io/npm/v/@turnkey/iframe-stamper?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/iframe-stamper)     | Provide API key signatures over Turnkey requests within iframe contexts | [CHANGELOG](/packages/iframe-stamper/CHANGELOG.md)   |
+| [`@turnkey/webauthn-stamper`](/packages/webauthn-stamper) | [![npm](https://img.shields.io/npm/v/@turnkey/webauthn-stamper?color=%234C48FF)](https://www.npmjs.com/package/@turnkey/webauthn-stamper) | Provide Webauthn signatures over Turnkey requests                       | [CHANGELOG](/packages/webauthn-stamper/CHANGELOG.md) |
 
 ## Code Examples
 
@@ -24,6 +25,9 @@ API Docs: https://docs.turnkey.com/
 | [`demo-ethers-passkeys`](https://github.com/tkhq/demo-ethers-passkeys) | A NextJS app that demonstrates how to use `@turnkey/ethers` to build a passkey-powered application                          |
 | [`demo-viem-passkeys`](https://github.com/tkhq/demo-viem-passkeys)     | A NextJS app that demonstrates how to use `@turnkey/viem` to build a passkey-powered application                            |
 | [`deployer`](/examples/deployer/)                                      | Compile and deploy a smart contract                                                                                         |
+| [`email-auth`](/examples/email-auth/)                                  | A NextJS app demonstrating a complete email auth flow                                                                       |
+| [`email-recovery`](/examples/email-recovery/)                          | A NextJS app demonstrating a complete email recovery flow                                                                   |
+| [`wallet-export`](/examples/wallet-export/)                            | A NextJS app demonstrating a complete wallet export flow                                                                    |
 | [`rebalancer`](/examples/rebalancer/)                                  | A demo application which showcases an example of how to use Turnkey for managing multiple types of keys & users             |
 | [`sweeper`](/examples/sweeper/)                                        | Sweep funds from one address to a different address                                                                         |
 | [`trading-runner`](/examples/trading-runner/)                          | A sample application demonstrating a trading operation, using various private keys, users, and policies, powered by Uniswap |

diff --git a/examples/email-auth/README.md b/examples/email-auth/README.md
@@ -6,7 +6,7 @@ This example shows a complete email auth flow. It contains a NextJS app with:
 - a backend application
 
 The overall flow for email auth is outlined below:
-![Email auth flow diagram](./auth.png)
+![Email auth flow diagram](./email_auth_steps.png)
 
 This example contains an example auth page as well as a stub API endpoint for "your business" (where the email is resolved into an organization ID). The creation of the hidden iframe is abstracted by our `@turnkey/iframe-stamper` package. For more information on email auth, [check out our documentation](https://docs.turnkey.com/getting-started/email-auth).
 
@@ -44,7 +44,7 @@ Now open `.env.local` and add the missing environment variables:
 - `API_PRIVATE_KEY`
 - `NEXT_PUBLIC_ORGANIZATION_ID`
 - `NEXT_PUBLIC_BASE_URL` (the `NEXT_PUBLIC` prefix makes the env variable accessible to the frontend app)
-- `NEXT_PUBLIC_RECOVERY_IFRAME_URL`
+- `NEXT_PUBLIC_AUTH_IFRAME_URL`
 
 ### 3/ Running the app
 

diff --git a/examples/email-auth/email_auth_steps.png b/examples/email-auth/email_auth_steps.png
diff --git a/examples/email-auth/email_recovery_steps.png b/examples/email-auth/email_recovery_steps.png
diff --git a/examples/email-auth/src/pages/index.tsx b/examples/email-auth/src/pages/index.tsx
@@ -54,15 +54,12 @@ const base64UrlEncode = (challenge: ArrayBuffer): string => {
 };
 
 export default function AuthPage() {
-  const [authResponse, setAuthResponse] =
-    useState<AuthResponse | null>(null);
+  const [authResponse, setAuthResponse] = useState<AuthResponse | null>(null);
   const [iframeStamper, setIframeStamper] = useState<IframeStamper | null>(
     null
   );
-  const {
-    register: authFormRegister,
-    handleSubmit: authFormSubmit,
-  } = useForm<AuthFormData>();
+  const { register: authFormRegister, handleSubmit: authFormSubmit } =
+    useForm<AuthFormData>();
   const {
     register: injectCredentialsFormRegister,
     handleSubmit: injectCredentialsFormSubmit,
@@ -131,10 +128,8 @@ export default function AuthPage() {
     const walletId = refineNonNull(wallet.walletId);
     const address = refineNonNull(wallet.addresses[0]);
 
-    // // Instead of simply alerting, redirect the user to your app's login page.
-    alert(
-      `SUCCESS! Wallet and new address created: ${address} `
-    );
+    // Instead of simply alerting, redirect the user to your app's login page.
+    alert(`SUCCESS! Wallet and new address created: ${address} `);
   };
 
   return (
@@ -162,64 +157,57 @@ export default function AuthPage() {
 
       {!iframeStamper && <p>Loading...</p>}
 
-      {iframeStamper &&
-        iframeStamper.publicKey() &&
-        authResponse === null && (
-          <form
-            className={styles.form}
-            onSubmit={authFormSubmit(auth)}
-          >
-            <label className={styles.label}>
-              Email
-              <input
-                className={styles.input}
-                {...authFormRegister("email")}
-                placeholder="Email"
-              />
-            </label>
-            <label className={styles.label}>
-              Encryption Target from iframe:
-              <br />
-              <code title={iframeStamper.publicKey()!}>
-                {iframeStamper.publicKey()!.substring(0, 30)}...
-              </code>
-            </label>
-
+      {iframeStamper && iframeStamper.publicKey() && authResponse === null && (
+        <form className={styles.form} onSubmit={authFormSubmit(auth)}>
+          <label className={styles.label}>
+            Email
+            <input
+              className={styles.input}
+              {...authFormRegister("email")}
+              placeholder="Email"
+            />
+          </label>
+          <label className={styles.label}>
+            Encryption Target from iframe:
+            <br />
+            <code title={iframeStamper.publicKey()!}>
+              {iframeStamper.publicKey()!.substring(0, 30)}...
+            </code>
+          </label>
+
+          <input className={styles.button} type="submit" value="Auth" />
+        </form>
+      )}
+
+      {iframeStamper && iframeStamper.publicKey() && authResponse !== null && (
+        <form
+          className={styles.form}
+          onSubmit={injectCredentialsFormSubmit(injectCredentials)}
+        >
+          <label className={styles.label}>
+            Auth Bundle
+            <input
+              className={styles.input}
+              {...injectCredentialsFormRegister("authBundle")}
+              placeholder="Paste your auth bundle here"
+            />
+          </label>
+          <label className={styles.label}>
+            New wallet name
             <input
-              className={styles.button}
-              type="submit"
-              value="Auth"
+              className={styles.input}
+              {...injectCredentialsFormRegister("walletName")}
+              placeholder="Wallet name"
             />
-          </form>
-        )}
-
-      {iframeStamper &&
-        iframeStamper.publicKey() &&
-        authResponse !== null && (
-          <form
-            className={styles.form}
-            onSubmit={injectCredentialsFormSubmit(injectCredentials)}
-          >
-            <label className={styles.label}>
-              Auth Bundle
-              <input
-                className={styles.input}
-                {...injectCredentialsFormRegister("authBundle")}
-                placeholder="Paste your auth bundle here"
-              />
-            </label>
-            <label className={styles.label}>
-              New wallet name
-              <input
-                className={styles.input}
-                {...injectCredentialsFormRegister("walletName")}
-                placeholder="Wallet name"
-              />
-            </label>
-
-            <input className={styles.button} type="submit" value="Create Wallet" />
-          </form>
-        )}
+          </label>
+
+          <input
+            className={styles.button}
+            type="submit"
+            value="Create Wallet"
+          />
+        </form>
+      )}
     </main>
   );
 }

diff --git a/packages/iframe-stamper/src/index.ts b/packages/iframe-stamper/src/index.ts
@@ -138,7 +138,7 @@ export class IframeStamper {
     return new Promise((resolve, reject) => {
       this.iframe.contentWindow?.postMessage(
         {
-          type: IframeEventType.InjectAuthBundle,
+          type: IframeEventType.InjectRecoveryBundle,
           value: bundle,
         },
         "*"