⚛️ Enable experimental support for Expo Web #1169
Draft
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Instead of a fetch() call to get the startup config, let's load the JSON file using ES import syntax. (Rename the file to startupConfig.default.json in the process, get rid of the .sample) While here, we can tidy this code with async/await instead of promises. I also noticed that this function doesn't return the consent status; returning it simplifies every place where this is invoked.
instead of using fetch() we can use ES import here. Need to rename to *.json, so calling it label-options.default.json
Two versions of the demographics surveys are kept locally in e-mission-phone import them using ES import syntax instead of using fetch()
New configuration for the repo– when using package.expo.json, we can serve the code as an expo web app I created a setup_expo script, similar to the other setup_* scripts to enable package.expo.json. Since the 'expo' configuration does not have a config.xml file, I modified configure_xml_and_json.js to ignore the xml file if it is not present
Metro is like the React Rative ecosystem's version of webpack. Just like we tell webpack to ignore libxslt in webpack.config.js, we must also tell Metro to ignore it in metro.config.js
The entry point for the Cordova app is index.js, which uses react-native-web to createRoot on the #appRoot element of index.html The entry point for an Expo app will be App.tsx (defined in app.json) As such, a few things need to be moved around – index.js should have nothing except the createRoot business, and App.tsx should contain everything needed for the app including Providers, SafeAreaView wrapper, etc. To account for Cordova plugins not being available, we can leverage the mocks we have been using for testing; they are basically just minimal JS versions of the plugins (ie using localStorage instead of native DB storage, fetch instead of the ServerCommunication plugin, etc). We'll apply these mocks (in expoCompat.ts) if we detect that we are running in Expo web
useAppConfig cordova has a 'deviceready' event that we listen for before we can retrieve the config. Expo does not have this event, so we need to check IS_EXPO and only await if IS_EXPO is false usePermissionStatus We will not be needing any permission-enabled functionality on the Expo web version. We can add a usePermissionStatus.web.ts that will automatically be used in place of usePermissionStatus.ts for Expo web, and it has an empty `checkList` so no permissions will be requested. pushNotifySettings Similarly, we do not need push notifications on the web version, so we will export a function that does nothing from pushNotifySettings.web.ts
Expo includes this font by default, but we do still need to include it in index.js for the Cordova configuration or the icons become blank
|
The web version is a proof-of-concept that this repo can be set up as a functioning Expo project. Since it does not use native APIs, it is UI-only. 
We don't have a specific need for a web version right now, but it could be useful later. It could also be useful as a dev tool for quick, UI-only changes. |
JGreenlee
added a commit
to JGreenlee/e-mission-server
that referenced
this pull request
Aug 28, 2024
This is necessary for e-mission/e-mission-phone#1169 to be able to make requests to the server from a browser
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This repo is going to become an Expo project in the coming months as we migrate away from Cordova. I think the easiest way to facilitate that transition is to add an
expoconfiguration.When
package.expo.jsonis in use, the app will be exposed as an Expo project (currently only supporting Expo web, but eventually supporting Android and iOS when we rewrite the plugins).When
package.serve.jsonorpackage.cordovabuild.jsonare in use, the app will be exposed as a Cordova project as always.