@stacksjs/defaults 0.74.63 → 0.74.65

package/ide/vscode/package.json

@@ -2,7 +2,7 @@
   "publisher": "Stacks",
   "name": "vscode-stacks",
   "displayName": "Stacks",
-  "version": "0.74.63",
+  "version": "0.74.65",
   "description": "A modern Stacks development environment.",
   "license": "MIT",
   "funding": "https://github.com/sponsors/chrisbbreuer",

package/package.json

@@ -2,7 +2,7 @@
   "name": "@stacksjs/defaults",
   "type": "module",
   "sideEffects": false,
-  "version": "0.74.63",
+  "version": "0.74.65",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/stacksjs/stacks.git",
@@ -55,7 +55,7 @@
   "dependencies": {
     "@iconify-json/f7": "^1.2.2",
     "@iconify-json/hugeicons": "^1.2.27",
-    "@stacksjs/mobile": "^0.74.63",
+    "@stacksjs/mobile": "^0.74.65",
     "@stacksjs/sanitizer": "^0.2.113",
     "ts-qr-codes": "^0.1.8"
   }

package/resources/components/Marketing/ComingSoon.stx

@@ -1,9 +1,23 @@
-<script>
+<script server>
+import { defineProps, withDefaults } from 'stx'
+
+/**
+ * The default holding page body, mounted by `views/coming-soon.stx`.
+ *
+ * Every app that turns on coming-soon mode shows this, so it names the app
+ * it is given and nothing else. It used to carry the Stacks logo, a pitch
+ * for the framework, a link to the framework's docs and a screenshot of the
+ * framework dashboard.
+ */
 interface ComingSoonProps {
-  // No server-rendered props — the form is fully client-driven.
+  appName?: string
+  description?: string
 }
 
-defineProps<ComingSoonProps>()
+const { appName, description } = withDefaults(
+  defineProps<ComingSoonProps>(),
+  { appName: '', description: '' },
+)
 </script>
 
 <div class="overflow-hidden relative bg-white isolate">
@@ -16,22 +30,23 @@ defineProps<ComingSoonProps>()
     <rect width="100%" height="100%" stroke-width="0" fill="url(#0787a7c5-978c-4f66-83c7-11c213f99cb7)" />
   </svg>
 
-  <div class="lg:flex mx-auto pb-24 pt-10 px-6 sm:pb-32 lg:px-8 lg:py-20 max-w-7xl">
-    <div class="lg:flex-shrink-0 mx-auto lg:mx-0 lg:pt-40 max-w-2xl lg:max-w-xl">
-      <Logo class="h-11 w-auto" />
+  <div class="mx-auto pb-24 pt-10 px-6 sm:pb-32 lg:px-8 lg:py-20 max-w-7xl">
+    <div class="mx-auto lg:pt-24 max-w-2xl">
+      @if(appName)
+        <p class="font-semibold text-gray-900 text-lg">{{ appName }}</p>
+      @endif
 
       <div class="mt-24 sm:mt-32 lg:mt-16">
         <span class="inline-block px-3 py-1 font-semibold leading-6 text-blue-600 text-sm bg-blue-600/10 ring-1 ring-blue-600/10 ring-inset rounded-full">Coming soon</span>
       </div>
 
       <h1 class="mt-10 font-bold text-4xl text-gray-900 tracking-tight sm:text-6xl">
-        Develop modern apps, clouds & libraries.
-        Faster.
+        Something new is on the way.
       </h1>
 
-      <p class="mt-6 leading-8 text-gray-600 text-lg">
-        Stacks is a type-safe full-stack framework for Web Artisans. Rapid development, for the best full-stack teams, and individuals.
-      </p>
+      @if(description)
+        <p class="mt-6 leading-8 text-gray-600 text-lg">{{ description }}</p>
+      @endif
 
       <p class="mt-3 italic leading-8 text-gray-600">
         Enter your email below to stay in the loop.
@@ -61,22 +76,13 @@ defineProps<ComingSoonProps>()
             <div id="coming-soon-spinner" class="hidden h-4 w-4 animate-spin i-hugeicons-loading-01"></div>
           </button>
         </form>
-
-        <a href="https://stacksjs-docs.netlify.app" class="font-semibold leading-6 text-gray-900 text-sm">Learn more <span aria-hidden="true">→</span></a>
       </div>
 
       <p id="coming-soon-error" class="hidden pt-2 text-red-500 text-xs"></p>
       <p id="coming-soon-success" class="hidden pt-2 text-green-700 text-xs">
-        Thanks — we'll be in touch.
+        Thanks, we'll be in touch.
       </p>
     </div>
-    <div class="flex lg:flex-none mt-16 mx-auto sm:mt-24 lg:ml-10 lg:mr-0 lg:mt-0 xl:ml-32 max-w-2xl lg:max-w-none">
-      <div class="flex-none max-w-3xl sm:max-w-5xl lg:max-w-none">
-        <div class="-m-2 p-2 lg:-m-4 lg:p-4 bg-gray-900/5 ring-1 ring-gray-900/10 ring-inset rounded-xl lg:rounded-2xl">
-          <img src="/images/screenshots/dashboard.png" alt="App screenshot" width="2432" height="1442" class="w-[76rem] ring-1 ring-gray-900/10 rounded-md shadow-2xl">
-        </div>
-      </div>
-    </div>
   </div>
 </div>
 
@@ -145,7 +151,7 @@ if (form) {
       }
     }
     catch {
-      showError('Network error — please try again.')
+      showError('Network error, please try again.')
     }
     finally {
       setLoading(false)

package/resources/plugins/preloader.ts

@@ -209,6 +209,7 @@ async function belongsToThisProject(specifier: string): Promise<boolean> {
 // explicitly when needed — see #1835 root cause 3.
 export async function loadAutoImports() {
   const { Glob } = await import('bun')
+  const { userFunctionFiles } = await import('./user-functions')
   const pathPackage = '@stacksjs/' + 'path'
   const path = await import('../../../core/path/src/index.ts')
     .catch(() => import(pathPackage))
@@ -289,12 +290,7 @@ export async function loadAutoImports() {
   const functionsPath = path.resourcesPath('functions')
   const glob = new Glob('**/*.ts')
 
-  for await (const file of glob.scan({
-    cwd: functionsPath,
-    absolute: true,
-    onlyFiles: true,
-  })) {
-    if (file.endsWith('.d.ts')) continue
+  for await (const file of userFunctionFiles(functionsPath)) {
 
     try {
       const module = await import(file)

package/resources/plugins/user-functions.ts

@@ -0,0 +1,23 @@
+import { Glob } from 'bun'
+import { existsSync } from 'node:fs'
+
+/**
+ * The `.ts` files an app keeps in `resources/functions`, or none.
+ *
+ * An app with no functions of its own is normal - `buddy new --minimal`
+ * leaves the folder empty, and git does not keep an empty folder - but
+ * `Glob.scan` throws ENOENT on a missing `cwd`. Unguarded, that aborted the
+ * preload for every command in a fresh checkout: CI's `buddy key:generate`
+ * died with a bare "no such file or directory, open .../resources/functions"
+ * and no stack, while the same app ran fine on the laptop that still had the
+ * empty folder. The model, job and controller scans below were already
+ * wrapped; this one was not.
+ */
+export async function* userFunctionFiles(dir: string): AsyncGenerator<string> {
+  if (!existsSync(dir))
+    return
+  for await (const file of new Glob('**/*.ts').scan({ cwd: dir, absolute: true, onlyFiles: true })) {
+    if (!file.endsWith('.d.ts'))
+      yield file
+  }
+}

package/resources/views/cms/blocks/form.stx

@@ -2,7 +2,8 @@
   Form block: renders a @stacksjs/forms form inline on a CMS page.
   `props.formUuid` names the form; the client script fetches the public
   definition (same-origin), renders the fields, evaluates conditions live,
-  and submits with the CSRF header the page response seeded.
+  and submits through useMutation, which repeats the page's CSRF cookie in
+  the header the submit route checks.
 --}}
 <div class="cms-form mx-auto max-w-xl px-6 py-8" data-form-uuid="{{ props.formUuid }}">
   <script client>
@@ -84,24 +85,24 @@
       payload.append('field', field.name)
       payload.append('file', file)
 
-      const reply = await fetch(`/api/forms/${uuid}/uploads`, {
-        method: 'POST',
-        credentials: 'same-origin',
-        body: payload,
-      })
-      const body = await reply.json().catch(() => ({}))
-
-      if (!reply.ok) {
+      // Through the data layer rather than a bare fetch(): it is what echoes
+      // the CSRF cookie the submit routes require, and it passes FormData
+      // through untouched.
+      let body: { path?: string }
+      try {
+        body = await useMutation(`/api/forms/${uuid}/uploads`).mutate(payload)
+      }
+      catch (failure) {
         // Clear the input as well as the value: leaving a rejected file
         // showing next to its own error message reads as though it was taken.
         input.value = ''
         delete values[field.name]
         delete attached[field.name]
-        errors.set({ ...errors(), [field.name]: body.message ?? 'That file could not be uploaded.' })
+        errors.set({ ...errors(), [field.name]: (failure as { data?: { message?: string } }).data?.message ?? 'That file could not be uploaded.' })
         return
       }
 
-      values[field.name] = body.path
+      values[field.name] = body.path ?? ''
       attached[field.name] = file.name
     }
     catch {
@@ -144,20 +145,19 @@
 
     try {
       const uuid = host()?.dataset.formUuid
-      const reply = await fetch(`/api/forms/${uuid}/submissions`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        credentials: 'same-origin',
-        body: JSON.stringify({ ...values, _renderedMs: Date.now() - openedAt }),
-      })
-      const body = await reply.json().catch(() => ({}))
-
-      if (reply.status === 422) {
-        errors.set(body.errors ?? {})
-        return
+      // useMutation, not fetch(): the submit route is CSRF-protected and the
+      // data layer is what repeats the cookie in the header. A bare fetch got
+      // 403 "CSRF token mismatch" on every submission.
+      let body: { message?: string, redirect?: string }
+      try {
+        body = await useMutation(`/api/forms/${uuid}/submissions`).mutate({ ...values, _renderedMs: Date.now() - openedAt })
       }
-      if (!reply.ok) {
-        errors.set({ _form: body.message ?? 'Something went wrong. Please try again.' })
+      catch (failure) {
+        const { status, data } = failure as { status?: number, data?: { errors?: FormErrors, message?: string } }
+        if (status === 422)
+          errors.set(data?.errors ?? {})
+        else
+          errors.set({ _form: data?.message ?? 'Something went wrong. Please try again.' })
         return
       }
       if (body.redirect) {

package/resources/views/coming-soon.stx

@@ -1,3 +1,12 @@
+<script server>
+import { config } from '@stacksjs/config'
+
+// The app's own name and description, so the holding page describes the app
+// that turned coming-soon mode on rather than the framework.
+const appName = config.app.name || ''
+const description = config.app.description || ''
+</script>
+
 <main>
-  <ComingSoon />
+  <ComingSoon appName="{{ appName }}" description="{{ description }}" />
 </main>

package/routes/forms.ts

@@ -82,7 +82,7 @@ route.post('/api/forms/{uuid}/uploads', async (request: any) => {
 }).rateLimit(20, 'minute')
 
 route.post('/api/forms/{uuid}/submissions', async (request: any) => {
-  const { dispatchSubmissionNotifications, loadFormByUuid, submitForm } = await import('@stacksjs/forms')
+  const { dispatchSubmissionNotifications, loadFormByUuid, submissionIdentity, submitForm } = await import('@stacksjs/forms')
 
   const form = await loadFormByUuid(String(request.params?.uuid ?? request.param?.('uuid') ?? ''), await siteIdForRequest(request))
   if (!form)
@@ -105,10 +105,14 @@ route.post('/api/forms/{uuid}/submissions', async (request: any) => {
 
   // Fire-and-forget AFTER the write: a slow mail transport must not hold a
   // parent's phone on a spinner, and a failed one must not undo the answers.
+  // The identity lookup belongs inside that chain too. It used to be awaited
+  // in the handler, so when it threw - and it always did, selecting a
+  // `values` column that has never existed - the visitor got a 500 for an
+  // answer that was already saved, and every retry saved another copy.
   if (result.submissionId > 0) {
-    void dispatchSubmissionNotifications(form, result, {
-      ...await submissionIdentity(result.submissionId),
-    }).catch(() => {})
+    void submissionIdentity(result.submissionId)
+      .then(identity => dispatchSubmissionNotifications(form, result, identity))
+      .catch(() => {})
   }
 
   return response.json({
@@ -119,38 +123,3 @@ route.post('/api/forms/{uuid}/submissions', async (request: any) => {
     redirect: result.redirect,
   }, { status: 201 })
 }).rateLimit(10, 'minute')
-
-async function submissionIdentity(submissionId: number): Promise<{ email: string | null, name: string | null, values: Record<string, unknown> }> {
-  const { db } = await import('@stacksjs/database')
-  const row = await db
-    .selectFrom('form_submissions')
-    .where('id', '=', submissionId)
-    .select(['email', 'name', 'values'])
-    .executeTakeFirst() as { email: string | null, name: string | null, values: string | null } | undefined
-
-  let values: Record<string, unknown> = {}
-  try {
-    values = row?.values ? JSON.parse(row.values) as Record<string, unknown> : {}
-  }
-  catch {
-    // unreadable values only degrade the notification summary
-  }
-  return { email: row?.email ?? null, name: row?.name ?? null, values }
-}
-
-/** Admin CSV export. Auth'd; site scoping rides the form lookup. */
-route.get('/api/admin/forms/{uuid}/submissions.csv', async (request: any) => {
-  const { exportSubmissionsCsv, loadFormByUuid } = await import('@stacksjs/forms')
-
-  const form = await loadFormByUuid(String(request.params?.uuid ?? request.param?.('uuid') ?? ''), await siteIdForRequest(request))
-  if (!form)
-    return response.notFound('Form not found')
-
-  const csv = await exportSubmissionsCsv(form)
-  return new Response(csv, {
-    headers: {
-      'Content-Type': 'text/csv; charset=utf-8',
-      'Content-Disposition': `attachment; filename="${form.handle}-submissions.csv"`,
-    },
-  })
-}).middleware('auth')