feat: show registration with code in storybook

ory · Sep 15, 2023 · 7c32444 · 7c32444
1 parent 3eb3abe
commit 7c32444
Show file tree

Hide file tree

Showing 2 changed files with 186 additions and 0 deletions.
diff --git a/src/stories/Ory/Auth.stories.tsx b/src/stories/Ory/Auth.stories.tsx
@@ -13,13 +13,15 @@ import loginFlowRefresh from "./login-flow-refresh.json"
 import loginFlow from "./login-flow.json"
 import loginFlowCodeOne from "./login-flow-code-1.json"
 import loginFlowCodeTwo from "./login-flow-code-2.json"
+
 import loginFlowHydra from "./login-flow-hydra.json"
 
 import loginFlowError from "./login-flow-error.json"
 import loginFlowUiError from "./login-flow-ui-error.json"
 
 import registrationFlowWebAuthn from "./register-flow-webauthn.json"
 import registrationFlow from "./register-flow.json"
+import registrationFlowCode from "./register-flow-code.json"
 
 import recoveryFlow from "./recovery-flow.json"
 
@@ -206,6 +208,12 @@ RecoveryAuthCardWithoutAdditionalProps.args = {
   flowType: "recovery",
 }
 
+export const RegistrationAuthCardFlowCode = Template.bind({})
+RegistrationAuthCardFlowCode.args = {
+  flow: registrationFlowCode as RegistrationFlow,
+  flowType: "registration",
+}
+
 export const VerificationAuthCard = Template.bind({})
 
 VerificationAuthCard.args = {

diff --git a/src/stories/Ory/register-flow-code.json b/src/stories/Ory/register-flow-code.json
@@ -0,0 +1,178 @@
+{
+  "id": "4028e642-a1a2-4ab7-b8b8-0b8683216f16",
+  "type": "browser",
+  "expires_at": "2023-09-15T06:51:15.085031Z",
+  "issued_at": "2023-09-15T06:21:15.085031Z",
+  "request_url": "https://example.com/self-service/registration/browser?return_to=",
+  "ui": {
+    "action": "https://example.com/self-service/registration?flow=4028e642-a1a2-4ab7-b8b8-0b8683216f16",
+    "method": "POST",
+    "nodes": [
+      {
+        "type": "input",
+        "group": "default",
+        "attributes": {
+          "name": "traits.email",
+          "type": "email",
+          "required": true,
+          "autocomplete": "email",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1070002,
+            "text": "E-Mail",
+            "type": "info",
+            "context": {
+              "title": "E-Mail"
+            }
+          }
+        }
+      },
+      {
+        "type": "input",
+        "group": "default",
+        "attributes": {
+          "name": "csrf_token",
+          "type": "hidden",
+          "value": "AYWGaOmwWvetqDidhkfq2nJxD9IFITJ4Czi6MPbRLO5LCNKhJpvX8TF5XsF2L7Sk0YNhAbPYFCiwPbdL8P3lxw==",
+          "required": true,
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {}
+      },
+      {
+        "type": "input",
+        "group": "webauthn",
+        "attributes": {
+          "name": "webauthn_register_displayname",
+          "type": "text",
+          "value": "",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1050013,
+            "text": "Name of the security key",
+            "type": "info"
+          }
+        }
+      },
+      {
+        "type": "input",
+        "group": "webauthn",
+        "attributes": {
+          "name": "webauthn_register",
+          "type": "hidden",
+          "value": "",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {}
+      },
+      {
+        "type": "input",
+        "group": "webauthn",
+        "attributes": {
+          "name": "webauthn_register_trigger",
+          "type": "button",
+          "value": "",
+          "disabled": false,
+          "onclick": "window.__oryWebAuthnRegistration({\"publicKey\":{\"rp\":{\"name\":\"Test\",\"id\":\"example.com\"},\"user\":{\"name\":\"Test\",\"displayName\":\"Test\",\"id\":\"rhD-u3guQBaDPkwrIbBISQ\"},\"challenge\":\"PwDL5hQ-H9fsxdurVLe5gisJ8-\",\"pubKeyCredParams\":[{\"type\":\"public-key\",\"alg\":-7},{\"type\":\"public-key\",\"alg\":-35},{\"type\":\"public-key\",\"alg\":-36},{\"type\":\"public-key\",\"alg\":-257},{\"type\":\"public-key\",\"alg\":-258},{\"type\":\"public-key\",\"alg\":-259},{\"type\":\"public-key\",\"alg\":-37},{\"type\":\"public-key\",\"alg\":-38},{\"type\":\"public-key\",\"alg\":-39},{\"type\":\"public-key\",\"alg\":-8}],\"timeout\":300000,\"authenticatorSelection\":{\"requireResidentKey\":false,\"userVerification\":\"discouraged\"}}})",
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1040004,
+            "text": "Sign up with security key",
+            "type": "info"
+          }
+        }
+      },
+      {
+        "type": "script",
+        "group": "webauthn",
+        "attributes": {
+          "src": "https://example.com/.well-known/ory/webauthn.js",
+          "async": true,
+          "referrerpolicy": "no-referrer",
+          "crossorigin": "anonymous",
+          "integrity": "sha512-RI23aG5lwYTo7zknGdc++eHUMimUWhkyFzrGid6HkVSdUSjdESPtM3KufXGq/lo4Ut0jI9mDiZeT8tHoSvaHvg==",
+          "type": "text/javascript",
+          "id": "webauthn_script",
+          "nonce": "94a13785-1ae3-4560-8a87-09d24f7b36bb",
+          "node_type": "script"
+        },
+        "messages": [],
+        "meta": {}
+      },
+      {
+        "type": "input",
+        "group": "code",
+        "attributes": {
+          "name": "method",
+          "type": "submit",
+          "value": "code",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1040006,
+            "text": "Sign up with code",
+            "type": "info"
+          }
+        }
+      },
+      {
+        "type": "input",
+        "group": "password",
+        "attributes": {
+          "name": "password",
+          "type": "password",
+          "required": true,
+          "autocomplete": "new-password",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1070001,
+            "text": "Password",
+            "type": "info"
+          }
+        }
+      },
+      {
+        "type": "input",
+        "group": "password",
+        "attributes": {
+          "name": "method",
+          "type": "submit",
+          "value": "password",
+          "disabled": false,
+          "node_type": "input"
+        },
+        "messages": [],
+        "meta": {
+          "label": {
+            "id": 1040001,
+            "text": "Sign up",
+            "type": "info"
+          }
+        }
+      }
+    ]
+  },
+  "state": "choose_method"
+}