chore(debug): add /debug-realtime page + bare SSE endpoint

Tijdelijke debug-tooling voor M8-acceptance op Vercel preview.

- app/api/debug/realtime-stream/route.ts — geen auth, geen filtering;
  dropt elke pg_notify-event op scrum4me_changes rauw door als SSE
- app/debug-realtime/page.tsx — open zonder login op de root, toont
  binnenkomende events in een simpele <table>

Doel: isoleren of de SSE + Postgres LISTEN-pipe op Vercel überhaupt
events laat zien, los van iron-session, productfilter of solo-store.
Als ook deze niets binnen krijgt: probleem zit in pg connection of
Vercel function lifecycle. Als deze wel events toont: probleem zit
hoger in de stack (filter, store, hook).

VERWIJDEREN voordat de PR uit draft gaat.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-04-27 10:02:22 +02:00
parent 868a53c2ed
commit e964a76318
3 changed files with 241 additions and 0 deletions

View file

@ -0,0 +1,114 @@
// TIJDELIJKE debug-endpoint voor M8-acceptance.
// Geen auth, geen filtering — alle pg_notify-events op `scrum4me_changes`
// stromen rauw door naar de browser. Bedoeld om te isoleren of de
// SSE + LISTEN-pipe op Vercel werkt, los van iron-session, productfilter
// of solo-store.
//
// VERWIJDEREN VOOR M8 OUT-OF-DRAFT.
import { NextRequest } from 'next/server'
import { Client } from 'pg'
export const runtime = 'nodejs'
export const dynamic = 'force-dynamic'
export const maxDuration = 300
const CHANNEL = 'scrum4me_changes'
export async function GET(request: NextRequest) {
const directUrl = process.env.DIRECT_URL ?? process.env.DATABASE_URL
if (!directUrl) {
return Response.json({ error: 'DIRECT_URL/DATABASE_URL niet gezet' }, { status: 500 })
}
const isPooled = directUrl.includes('pooler.')
const hostHint = directUrl.match(/@([^/]+)/)?.[1] ?? 'unknown-host'
console.log(`[debug-realtime] connecting (${isPooled ? 'POOLED' : 'direct'}) host=${hostHint}`)
const encoder = new TextEncoder()
const pgClient = new Client({ connectionString: directUrl })
let closed = false
let heartbeatTimer: ReturnType<typeof setInterval> | null = null
const stream = new ReadableStream({
async start(controller) {
const enqueue = (chunk: string) => {
if (closed) return
try {
controller.enqueue(encoder.encode(chunk))
} catch {
// already closed
}
}
const cleanup = async (reason: string) => {
if (closed) return
closed = true
if (heartbeatTimer) clearInterval(heartbeatTimer)
try {
await pgClient.end()
} catch {
// ignore
}
try {
controller.close()
} catch {
// already closed
}
console.log(`[debug-realtime] closed: ${reason}`)
}
try {
await pgClient.connect()
await pgClient.query(`LISTEN ${CHANNEL}`)
console.log('[debug-realtime] LISTEN ready')
} catch (err) {
console.error('[debug-realtime] pg connect/listen failed:', err)
enqueue(`event: error\ndata: ${JSON.stringify({ message: String(err) })}\n\n`)
await cleanup('pg connect failed')
return
}
pgClient.on('notification', (msg) => {
console.log(`[debug-realtime] RAW notification length=${msg.payload?.length ?? 0}`)
if (!msg.payload) return
enqueue(`data: ${msg.payload}\n\n`)
})
pgClient.on('error', async (err) => {
console.error('[debug-realtime] pg client error:', err)
await cleanup('pg error')
})
pgClient.on('end', () => {
console.log('[debug-realtime] pg client end')
})
enqueue(
`event: ready\ndata: ${JSON.stringify({
host: hostHint,
pooled: isPooled,
channel: CHANNEL,
time: new Date().toISOString(),
})}\n\n`,
)
heartbeatTimer = setInterval(() => {
enqueue(`: heartbeat ${new Date().toISOString()}\n\n`)
}, 25_000)
request.signal.addEventListener('abort', () => {
cleanup('client aborted')
})
},
})
return new Response(stream, {
headers: {
'Content-Type': 'text/event-stream; charset=utf-8',
'Cache-Control': 'no-cache, no-transform',
Connection: 'keep-alive',
'X-Accel-Buffering': 'no',
},
})
}