diff --git a/examples/simple-form/src/components/Counter.astro b/examples/simple-form/src/components/Counter.astro new file mode 100644 index 0000000..8984249 --- /dev/null +++ b/examples/simple-form/src/components/Counter.astro @@ -0,0 +1,9 @@ +--- +import {BButton} from '@astro-utils/forms/forms.js'; + +function inc() { + Astro.locals.session.count ??= 0; + this.innerText = Astro.locals.session.count++; +} +--- +Counter diff --git a/examples/simple-form/src/pages/index.astro b/examples/simple-form/src/pages/index.astro index f74b00e..cd851f2 100644 --- a/examples/simple-form/src/pages/index.astro +++ b/examples/simple-form/src/pages/index.astro @@ -3,6 +3,7 @@ import Layout from '../layouts/Layout.astro'; import {BButton, Bind, BindForm, BInput, FormErrors} from '@astro-utils/forms/forms.js'; import {Button} from 'reactstrap'; import 'bootstrap/dist/css/bootstrap.css'; +import Counter from '../components/Counter.astro'; const form = Bind({age: 0, name: '', about: ''}); @@ -48,5 +49,6 @@ function makeBackgroundRed() { Submit + diff --git a/package-lock.json b/package-lock.json index 54a15fb..afd36d7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10385,11 +10385,6 @@ "dev": true, "license": "MIT" }, - "node_modules/promise-timeout": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/promise-timeout/-/promise-timeout-1.3.0.tgz", - "integrity": "sha512-5yANTE0tmi5++POym6OgtFmwfDvOXABD9oj/jLQr5GPEyuNEb7jH4wbbANJceJid49jwhi1RddxnhnEAb/doqg==" - }, "node_modules/prompts": { "version": "2.4.2", "license": "MIT", @@ -13518,7 +13513,6 @@ "csrf": "^3.1.0", "deepmerge": "^4.3.1", "jsonwebtoken": "^9.0.0", - "promise-timeout": "^1.3.0", "snappy": "^7.2.2", "superjson": "^2.2.1", "uuid": "^9.0.0", diff --git a/packages/forms/package.json b/packages/forms/package.json index 0065b87..5c85797 100644 --- a/packages/forms/package.json +++ b/packages/forms/package.json @@ -69,7 +69,6 @@ "csrf": "^3.1.0", "deepmerge": "^4.3.1", "jsonwebtoken": "^9.0.0", - "promise-timeout": "^1.3.0", "snappy": "^7.2.2", "superjson": "^2.2.1", "uuid": "^9.0.0", diff --git a/packages/forms/src/components/WebForms.astro b/packages/forms/src/components/WebForms.astro index bdc7a44..2ef2e16 100644 --- a/packages/forms/src/components/WebForms.astro +++ b/packages/forms/src/components/WebForms.astro @@ -1,7 +1,7 @@ --- import {asyncContext} from '@astro-utils/context'; import {createFormToken} from '../form-tools/csrf.js'; -const utils = Astro.locals.__formsInternalUtils; +import {getFormOptions} from '../settings.js'; export interface Props extends astroHTML.JSX.FormHTMLAttributes {} @@ -22,10 +22,8 @@ if (webFormsSettings.haveFileUpload) { props.enctype = 'multipart/form-data'; } -const useSession = utils?.FORM_OPTIONS.session?.cookieOptions?.maxAge; +const useSession = getFormOptions(Astro).session?.cookieOptions?.maxAge; const formRequestToken = useSession && (await createFormToken(Astro)); -await utils?.onWebFormClose?.(); - const clientScript = Astro.locals.forms.scriptToRun; --- diff --git a/packages/forms/src/middleware.ts b/packages/forms/src/middleware.ts index 7ee9c95..a257749 100644 --- a/packages/forms/src/middleware.ts +++ b/packages/forms/src/middleware.ts @@ -4,7 +4,6 @@ import {JWTSession} from './jwt-session.js'; import {FORM_OPTIONS, type FormsSettings} from './settings.js'; import {v4 as uuid} from 'uuid'; import deepmerge from 'deepmerge'; -import {timeout} from 'promise-timeout'; import FormsReact from './form-tools/forms-react.js'; const DEFAULT_FORM_OPTIONS: FormsSettings = { @@ -20,7 +19,6 @@ const DEFAULT_FORM_OPTIONS: FormsSettings = { maxAge: 1000 * 60 * 60 * 24 * 7 } }, - pageLoadTimeoutMS: 1000 * 5, secret: uuid(), logs: (type, message) => { console[type](message); @@ -36,30 +34,22 @@ export default function astroForms(settings: Partial = {}) { locals.session = session.sessionData; locals.forms = new FormsReact(likeAstro); - let response: Response; - let pageFinished: (data?: any) => void; - locals.__formsInternalUtils = { - onWebFormClose() { - session.setCookieHeader(response.headers); - pageFinished(); - }, FORM_OPTIONS: FORM_OPTIONS }; await ensureValidationSecret(likeAstro); - response = await next(); + const response = await next(); const isHTML = response.headers.get('Content-Type')?.includes('text/html'); - if (!locals.webFormOff && isHTML) { - try { - const pageFinishedPromise = new Promise(resolve => pageFinished = resolve); - await timeout(pageFinishedPromise, FORM_OPTIONS.pageLoadTimeoutMS); - } catch { - FORM_OPTIONS.logs?.('warn', 'WebForms page load timeout (are you sure you are using WebForms?)'); - } + if (locals.webFormOff || !isHTML) { + return response; } - return response; + const content = await response.text(); + const newResponse = new Response(content, response); + session.setCookieHeader(newResponse.headers); + + return newResponse; } as MiddlewareHandler; } diff --git a/packages/forms/src/settings.ts b/packages/forms/src/settings.ts index 288e9fd..95a0c13 100644 --- a/packages/forms/src/settings.ts +++ b/packages/forms/src/settings.ts @@ -15,7 +15,6 @@ export type FormsSettings = { } }, secret?: string, - pageLoadTimeoutMS?: number logs?: (type: 'warn' | 'error' | 'log', message: string) => void } diff --git a/packages/forms/src/utils.ts b/packages/forms/src/utils.ts index 0483b08..9b573b5 100644 --- a/packages/forms/src/utils.ts +++ b/packages/forms/src/utils.ts @@ -32,7 +32,6 @@ declare global { * @internal */ __formsInternalUtils: { - onWebFormClose(): void; FORM_OPTIONS: FormsSettings; }; forms: FormsReact;