Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adding offline support to workflow's apps #37

Open
43 of 55 tasks
karntrehan opened this issue Apr 6, 2023 · 5 comments
Open
43 of 55 tasks

Adding offline support to workflow's apps #37

karntrehan opened this issue Apr 6, 2023 · 5 comments
Assignees
Labels
enhancement New feature or request

Comments

@karntrehan
Copy link

karntrehan commented Apr 6, 2023

We should leverage service workers to:

Milestone 1 - Cache React Layers

  • Cache static react screens
  • Cache API responses rendering screens
  • Storing offline entered data into index DB
  • Syncing offline entered data when user online on subsequent app launch
  • Force updating the react app when a new release is made - Using service workers.
  • Keep elements online dependent - eg: Login
  • Offline location handling
  • Add installable option for PWA
  • Documentation

Milestone 2 - Render enketo offline

  • Cache the enketo form when opened for the first time in online mode.
  • Cache and prefill form - Text
  • Cache and prefill form - Image - Send to minio? Save in local?
  • Cache submission
  • Sync response to remote when user online
  • Clear prefilled form on custom logic
  • Display messages when user offline / online - When offline show dialog - "Queued response"
  • Offline location handling
  • Explore background submission (Naively implemented for now)
  • Rendering of form without iframe
  • Documentation

Milestone 3 - Offline Support next.js frontend screens - FamilyId

  • Project Setup of Family ID (1h)
  • Use a service worker library like Workbox or Next PWA to simplify the setup. (4h)
  • Cache important assets and data for offline access. (2h)
  • Implement data synchronization between the client and server when the app is online after one time login. (1d)
    • Store data locally using browser storage mechanisms like IndexedDB or localStorage.
  • Web app manifest file (manifest.json) that defines the PWA's metadata. (30m)
    • Include properties like the app name, icons, background color, and display mode.
  • Submitting of offline feedback (4h-8h)
  • Optimize the app's performance using techniques like code splitting, lazy loading, and image optimization. (1d)
  • Documentation (4+8h)
  • Integrate push notification functionality using the Push API and a push service like Firebase Cloud Messaging (FCM). - P2

Milestone 4 - Documenting & contributing

  • Contributing back to enketo - Open issue, Discuss approach & on agreement Plan a PR back:
    • Submitting to custom backend - #572
    • Image handling - #573
    • Event callbacks from enketo input -#574
    • Config for UI and icons - #575
  • Discuss to enketo - Open issue and discuss approach only:
    • Background submissions - #576
    • [Abandoned] Enketo queue UI Handling of offline resubmission.
    • Icon on offline form - #575
  • Documentation improvements
    • Define a lens - For external contributors or internal samagra folks.
    • Make it generic and take inspiration from nextjs, reactjs docs.
    • Quick setup instructions (video optionally)
  • Offline Sync Handler
    • Improve documentation
    • Retry handling
    • Success callbacks
    • Chaining calls
    • Unit Tests suite - Retry, different input types, different methods, all functionalities.
    • [Abandoned] Optionally create a PWA out of the box

Milestone 5 - Download enketo offline upfront - Community driven

  • Download offline forms in ghost component on app launch ( Current Approach )
  • Forms should be loaded in parallel
  • Config based form downloading
  • Config based UI rendering
@abhay-samagra
Copy link
Member

@karntrehan - Could we prioritize this ticket in the remaining part of the sprint? I can help in deprioritising other stuff in lieu of this ticket.

@Shruti3004
Copy link
Member

Shruti3004 commented May 29, 2023

Pre-requisites:

  • Setup of enketo repository and ratings application on the local machine of everyone in the team.
  • Detailed Code KT

Action Items for week (May 29 - June 2)

  • Cache static react screens
  • Cache API responses rendering screens
  • Storing offline entered data into index DB
  • Syncing offline entered data when user online on subsequent app launch
  • Force updating the react app when a new release is made - Using service workers.
  • Offline location handling

@Shurtu-gal
Copy link

@karntrehan @amit-s19 @Shruti3004 I would love to work upon this. Can you guide me a little?

@Shruti3004
Copy link
Member

{
    "summary": {}, 
    "benefits": {}
}

OR

[
   { "name": "Summary", "endpoint": "", "data": ""}
   { "name": "Benefits", "endpoint": "", "data": ""}
   { "name": "Transaction", "endpoint": "", "data": ""}
]

@amit-s19
Copy link

amit-s19 commented Jul 21, 2023

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

6 participants