fix: registration via code and verification/recovery card stretches

.eslintrc.js

@@ -2,31 +2,5 @@
 // SPDX-License-Identifier: Apache-2.0
 
 module.exports = {
-  env: {
-    browser: true,
-    es6: true,
-    node: true,
-  },
-  extends: [
-    "eslint:recommended",
-    "plugin:react/recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:react/jsx-runtime",
-    "plugin:storybook/recommended",
-  ],
-  overrides: [],
-  parser: "@typescript-eslint/parser",
-  parserOptions: {
-    tsconfigRootDir: "./",
-    ecmaVersion: 2021,
-    sourceType: "module",
-    ecmaFeatures: {
-      jsx: true,
-    },
-  },
-  plugins: ["react", "@typescript-eslint", "eslint-plugin-tsdoc", "formatjs"],
-  rules: {
-    "tsdoc/syntax": "warn",
-    "formatjs/no-offset": "error",
-  },
+  extends: ["semistandard", "plugins:playwright/recommended"],
 }

examples/nextjs-spa/package.json

@@ -20,12 +20,12 @@
     "next": "13.4.13",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "typescript": "4.9.4"
+    "typescript": "5.2.2"
   },
   "devDependencies": {
     "@ory/elements": "*",
     "@ory/elements-test": "*",
-    "autoprefixer": "10.4.2",
-    "@playwright/test": "1.32.1"
+    "@playwright/test": "1.38.0",
+    "autoprefixer": "10.4.2"
   }
 }

examples/nextjs-spa/playwright.config.ts

@@ -77,7 +77,7 @@ export default defineConfig({
       env: {
         NEXT_PUBLIC_ORY_SDK_URL: "http://localhost:4000",
       },
-      command: "npm run dev -- --port 3100",
+      command: "npm run build && npm run start -- --port 3100",
       timeout: 120 * 1000,
       port: 3100,
       reuseExistingServer: !process.env.CI,

examples/nextjs-spa/src/pages/recovery.tsx

@@ -20,7 +20,7 @@ import { SetUriFlow } from "@/pkg/helpers"
 import { NextPageWithLayout } from "./_app"
 
 const Recovery: NextPageWithLayout = () => {
-  const [flow, setFlow] = useState<RecoveryFlow>()
+  const [flow, setFlow] = useState<RecoveryFlow | null>()
 
   // Get flow information from the URL
   const router = useRouter()
@@ -84,8 +84,10 @@ const Recovery: NextPageWithLayout = () => {
         updateRecoveryFlowBody: values,
       })
       .then(({ data }) => {
+        // reset the form data completely
+        setFlow(null)
         // Form submission was successful, show the message to the user!
-        setFlow(data)
+        getFlow(data.id)
       })
       .catch(handleError)
 

examples/nextjs-spa/src/pages/verification.tsx

@@ -81,8 +81,10 @@ const Verification: NextPageWithLayout = () => {
         updateVerificationFlowBody: values,
       })
       .then(({ data }) => {
+        // reset the input fields
+        setFlow(null)
         // Form submission was successful, show the message to the user!
-        setFlow(data)
+        getFlow(data.id)
       })
       .catch(handleError)
 

examples/preact-spa/package.json

@@ -17,11 +17,11 @@
   "devDependencies": {
     "@ory/elements-preact": "*",
     "@ory/elements-test": "*",
-    "@playwright/test": "1.32.1",
     "@preact/preset-vite": "2.5.0",
     "eslint": "8.32.0",
     "eslint-config-preact": "1.3.0",
-    "typescript": "4.9.4",
+    "typescript": "5.2.2",
+    "@playwright/test": "1.38.0",
     "vite": "4.0.5"
   },
   "eslintConfig": {

examples/preact-spa/src/recovery.tsx

@@ -42,7 +42,8 @@ export const Recovery = () => {
       })
       .then(({ data: flow }) => {
         // Form submission was successful, show the message to the user!
-        setFlow(flow)
+        setFlow(null)
+        getFlow(flow.id)
       })
       .catch(sdkErrorHandler)
   }

examples/preact-spa/src/verification.tsx

@@ -42,7 +42,8 @@ export const Verification = () => {
         updateVerificationFlowBody: body,
       })
       .then(({ data: flow }) => {
-        setFlow(flow)
+        setFlow(null)
+        getFlow(flow.id)
       })
       .catch(sdkErrorHandler)
   }

examples/react-spa/package.json

@@ -18,7 +18,7 @@
   "devDependencies": {
     "@ory/elements": "*",
     "@ory/elements-test": "*",
-    "@playwright/test": "1.32.1",
+    "@playwright/test": "1.38.0",
     "@types/react": "18.2.14",
     "@types/react-dom": "18.2.6",
     "@typescript-eslint/eslint-plugin": "5.49.0",
@@ -29,7 +29,7 @@
     "eslint-plugin-n": "15.6.1",
     "eslint-plugin-promise": "6.1.1",
     "eslint-plugin-react": "7.32.2",
-    "typescript": "5.1.6",
+    "typescript": "5.2.2",
     "vite": "4.4.2"
   }
 }

examples/react-spa/src/Recovery.tsx

@@ -44,7 +44,8 @@ export const Recovery = () => {
       .updateRecoveryFlow({ flow: flow.id, updateRecoveryFlowBody: body })
       .then(({ data: flow }) => {
         // Form submission was successful, show the message to the user!
-        setFlow(flow)
+        setFlow(null)
+        getFlow(flow.id)
       })
       .catch(sdkErrorHandler)
   }

examples/react-spa/src/Verification.tsx

@@ -49,7 +49,8 @@ export const Verification = (): JSX.Element => {
         updateVerificationFlowBody: body,
       })
       .then(({ data: flow }) => {
-        setFlow(flow)
+        setFlow(null)
+        getFlow(flow.id)
       })
       .catch(sdkErrorHandler)
   }