fix: offline sync basePath prefix and stable syncNow callback

- fetch URL: /api/incidents → /ims/api/incidents (basePath not auto-prepended in client fetch)
- replace syncing state guard with syncingRef to give syncNow a stable reference, preventing useEffect from re-registering the online listener on every sync cycle
- keep syncing state for UI rendering only

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01FFDuBhMKvoWjrWT3ZnGmmr
This commit is contained in:
2026-07-11 19:11:16 +08:00
co-authored by Claude Sonnet 4.6
parent c048878600
commit 448ea4857a
+7 -4
View File
@@ -1,10 +1,11 @@
'use client'
import { useEffect, useState, useCallback } from 'react'
import { useEffect, useState, useCallback, useRef } from 'react'
export function OfflineSync() {
const [pendingCount, setPendingCount] = useState(0)
const [syncing, setSyncing] = useState(false)
const syncingRef = useRef(false)
async function checkPending() {
const { getPendingCount } = await import('@/lib/offline/db')
@@ -12,7 +13,8 @@ export function OfflineSync() {
}
const syncNow = useCallback(async () => {
if (syncing) return
if (syncingRef.current) return
syncingRef.current = true
setSyncing(true)
try {
const { getPendingReports, removePendingReport } = await import('@/lib/offline/db')
@@ -27,7 +29,7 @@ export function OfflineSync() {
if (report.medical_status) fd.append('medical_status', report.medical_status)
try {
const res = await fetch('/api/incidents', { method: 'POST', body: fd })
const res = await fetch('/ims/api/incidents', { method: 'POST', body: fd })
if (res.ok && report.id != null) {
await removePendingReport(report.id)
}
@@ -36,10 +38,11 @@ export function OfflineSync() {
}
}
} finally {
syncingRef.current = false
await checkPending()
setSyncing(false)
}
}, [syncing])
}, [])
useEffect(() => {
// eslint-disable-next-line react-hooks/set-state-in-effect