Skip to content

Fix - react's save flow async #38

@diiviikk5

Description

@diiviikk5

Ticket Contents

Description

In the Ionic React app, file save operations are not reliably persisted due to async misuse of local storage reads.
_getFile() returns a Promise, but doSave() and newFile() treat it like synchronous data, which can cause corrupted metadata (created timestamp), incorrect file state, and inconsistent behavior when users save or create a new file.

This issue proposes a focused reliability fix for local invoice lifecycle operations:

Save existing file
Create new file from current working sheet
Preserve file metadata (created, modified, billType) correctly
Prevent silent failures and runtime inconsistencies
This is a core workflow bug and should be fixed before extending invoice automation/export capabilities

Goals & Mid-Point Milestone

Goals

Refactor save flows to correctly await local storage reads.
Ensure created is preserved when updating existing files.
Ensure modified is always updated on save/new-file transitions.
Add guard handling when file data is missing/corrupted in local storage.
Goals Achieved By Mid-point Milestone: Save/New File flow is deterministic and metadata-safe in web + hybrid runtime.

Setup/Installation

git clone https://github.com/seetadev/GovtInvoice
cd Govt-Billing-React
npm install
npm run dev

Expected Outcome

After fix:

Save and New File actions behave consistently across sessions.
Existing file metadata is preserved correctly.
No Promise/object misuse in save logic.
Local invoice state remains stable and recoverable.
Users can confidently continue editing without accidental metadata corruption.

Acceptance Criteria

doSave() uses awaited file reads before constructing updated file object.
newFile() uses awaited file reads before persisting current file.
No direct property access on unresolved Promise objects.
Save on non-default file preserves original created.
Save updates modified with current timestamp.
New File flow persists current file safely before resetting to default sheet.
Missing local file data is handled gracefully (no runtime crash).
Manual verification completed for web runtime and hybrid runtime path.

Implementation Details

Govt-Billing-React/src/components/Menu/Menu.tsx
Govt-Billing-React/src/components/NewFile/NewFile.tsx
Govt-Billing-React/src/components/Storage/LocalStorage.ts (optional safety hardening)
Proposed technical approach:

Convert save handlers to async-safe flow (await props.store._getFile(...)).
Add null checks around returned storage payloads.
Fallback behavior:
If file payload is missing, block destructive overwrite and show user alert/toast.
Keep existing data model intact (created, modified, content, name, billType) to avoid migration risk.
Validate by round-trip tests through Files modal and subsequent reloa

Mockups/Wireframes

No UI redesign required.

Product Name

Govt Invoice Reliability: Local Save Flow Hardening

Organisation Name

NSUT x SEETA x AIC

Domain

⁠Service Delivery

Tech Skills Needed

TypeScript, React, Ionic

Mentor(s)

@seetadev

Category

Frontend, Maintenance, Testing

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions