Description
When the app is fully offline and a user scans a fish using the ONNX edge model, the local inference runs successfully and a freshness result is shown. However, in the background, ScannerPage.tsx immediately calls api.submitScan() to save the result to the server.
Because the user is offline, this background call fails with a TypeError: Failed to fetch, which triggers a generic error toast:
"Unable to connect to the server. Please check your internet connection."
This creates a confusing experience — the user sees a successful scan result AND an alarming error toast at the same time.
Root Cause
In src/pages/ScannerPage.tsx, the edge inference path calls api.submitScan() with { silent: true }. The silent flag suppresses the toast for server-side 5xx errors, but it does not suppress the toast for a TypeError (i.e., no network connection at all).
In src/lib/api.ts, inside safeFetch:
} catch (error) {
if (error instanceof TypeError && !options?.silent) {
toast.error('Unable to connect to the server...');
}
throw error;
}
The silent: true option is passed down to handleResponse but the safeFetch outer catch block that fires on a TypeError also needs to respect silent.
Tasks
- In
src/lib/api.ts, update the safeFetch function to pass the options argument through to the outer catch block so that TypeError network errors are also silenced when silent: true is set.
- Verify in
src/pages/ScannerPage.tsx that the edge inference api.submitScan() call is passing { silent: true } correctly.
- Verify that the user sees no error toast after a successful offline scan.
Expected Behaviour
When the ONNX model runs successfully offline, the user should see only their freshness result. No server error toast should appear. The failed background sync should fail silently and be discarded.
Files Involved
src/lib/api.ts (primary fix — safeFetch outer catch block)
src/pages/ScannerPage.tsx (verify silent: true is passed)
Description
When the app is fully offline and a user scans a fish using the ONNX edge model, the local inference runs successfully and a freshness result is shown. However, in the background,
ScannerPage.tsximmediately callsapi.submitScan()to save the result to the server.Because the user is offline, this background call fails with a
TypeError: Failed to fetch, which triggers a generic error toast:This creates a confusing experience — the user sees a successful scan result AND an alarming error toast at the same time.
Root Cause
In
src/pages/ScannerPage.tsx, the edge inference path callsapi.submitScan()with{ silent: true }. Thesilentflag suppresses the toast for server-side 5xx errors, but it does not suppress the toast for aTypeError(i.e., no network connection at all).In
src/lib/api.ts, insidesafeFetch:The
silent: trueoption is passed down tohandleResponsebut thesafeFetchoutercatchblock that fires on aTypeErroralso needs to respectsilent.Tasks
src/lib/api.ts, update thesafeFetchfunction to pass theoptionsargument through to the outercatchblock so thatTypeErrornetwork errors are also silenced whensilent: trueis set.src/pages/ScannerPage.tsxthat the edge inferenceapi.submitScan()call is passing{ silent: true }correctly.Expected Behaviour
When the ONNX model runs successfully offline, the user should see only their freshness result. No server error toast should appear. The failed background sync should fail silently and be discarded.
Files Involved
src/lib/api.ts(primary fix —safeFetchouter catch block)src/pages/ScannerPage.tsx(verifysilent: trueis passed)