Convert medical-centre landing to React + Tailwind v4 with amoCRM lead capture

Ports the single-file MedCsFiz page — the medical centre that already runs physiotherapy and wants the existing room to earn more — to the same architecture as the fitness and hotel landings: Vite + React 19 + TypeScript + Tailwind v4 on the client, Express 5 for the API, zod schema shared between the two. The original stays in legacy/index.html as the visual reference. Its 4 MB of inlined CSS, JS and base64 images become 12 asset files (664 KB) plus a bundle loaded on demand; the two 1.5 MB / 750 KB device PNGs are recompressed to webp. The page is split into 18 components with all copy moved to src/data/content.ts. Leads reuse the fitness amoCRM integration: contact lookup by phone in every Russian spelling, deal in the first stage of pipeline 10980758, account fields matched automatically with the rest written to a note. Rate limit, honeypot and a localStorage fallback so a lead survives the CRM being down. Endpoint is /api/leads/medical-centers-existing-physio; Vite runs on 5173 and the API on 3000. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-08-28 19:59:14 +06:00
parent 35f713a267
commit 8b954ea5db
61 changed files with 9160 additions and 0 deletions
@@ -0,0 +1,67 @@
+/**
+ * Verifies the amoCRM connection and prints what the integration will do with
+ * your account: which pipeline stage leads land in, and which of your custom
+ * fields the lead form's data was matched to.
+ *
+ *   npm run amo:check
+ */
+import { AmoClient } from '../server/src/amocrm.ts'
+import { readAmoConfig } from '../server/src/config.ts'
+import { resolveLeadFieldMap } from '../server/src/lead-mapper.ts'
+
+const config = readAmoConfig()
+if (!config) {
+  console.error('✗ AMO_SUBDOMAIN and AMO_LONG_LIVED_TOKEN must be set in .env')
+  process.exit(1)
+}
+
+const amo = new AmoClient(config)
+
+console.info(`→ ${config.baseUrl}\n`)
+
+const account = await amo.getAccount()
+console.info(`✓ Account: ${account?.name} (id ${account?.id})`)
+
+const pipeline = await amo.getPipeline(config.pipelineId)
+if (!pipeline) {
+  console.error(`✗ Pipeline ${config.pipelineId} not found in this account.`)
+  process.exit(1)
+}
+
+const stages = [...(pipeline._embedded?.statuses ?? [])].sort((a, b) => a.sort - b.sort)
+console.info(`✓ Pipeline ${pipeline.id}: «${pipeline.name}»`)
+console.info(`  Leads will be created in the first stage: «${stages[0]?.name ?? 'unknown'}»`)
+console.info(`  All stages: ${stages.map((s) => s.name).join(' → ')}\n`)
+
+const leadFields = await amo.getLeadFields()
+const map = resolveLeadFieldMap(leadFields)
+
+console.info(`Lead data → amoCRM field mapping (${leadFields.length} custom fields in the account):`)
+const keys = [
+  'company',
+  'cabinet_state',
+  'profile',
+  'comment',
+  'page',
+  'referrer',
+  'form',
+  'utm_source',
+  'utm_medium',
+  'utm_campaign',
+  'utm_content',
+  'utm_term',
+]
+for (const key of keys) {
+  const field = map.get(key)
+  console.info(
+    field
+      ? `  ✓ ${key.padEnd(14)} → «${field.name}» (id ${field.id}, ${field.type})`
+      : `  · ${key.padEnd(14)} → note on the lead`,
+  )
+}
+
+const contactFields = await amo.getContactFields()
+const hasPhone = contactFields.some((f) => f.code === 'PHONE')
+const hasEmail = contactFields.some((f) => f.code === 'EMAIL')
+console.info(`\nContact fields: PHONE ${hasPhone ? '✓' : '✗ missing'}, EMAIL ${hasEmail ? '✓' : '✗ missing'}`)
+console.info('\nAll good — the form is ready to create leads.')