@flexpa/link-pkg

A tiny public package that's responsible for launching flexpa/app within an iframe. The package is published on npm under @flexpa/link and as an iife (Immediately Invoked Function Expression) that can be included in a <script src="..."> tag.

Publishing to NPM

• Run yarn version patch | minor | major to update the package's version. Head to the git repo on Github and create a new release.
• Add a tag to the release matching link-v<major>.<minor>.<patch>. Once a release has been created the Publish @flexpa/link github action is triggered and handles publishing the new version to npm (See .github/workflows/npm-registry.yml).

FAQ

| Topic | Answer | Comments | | ------------- | ------------ | ----------------------------------- | | Runtime | Browser | | Dev | Dev server | yarn dev | | Build | Through vite | yarn build | | Localhost | 3007 | Default is http://localhost:3007/ |

Local Development on a Phone

To test the application on a mobile device, follow these steps:

1. Setup ngrok

   • Run ngrok config check to find the location of your ngrok config file
   • Open the config file and note your authtoken
   • Replace the file with the one in apps/link/pkg/ngrok.yml
   • Run ngrok start --all to create tunnels for:
     • link-app (port 3006)
     • link (port 3007)
     • api (port 3001)

2. Update Vite Config

   • In apps/link/app/vite.config.mts, uncomment the allowedHosts line
   • Add the ngrok URL for port 3006 to the array

3. Update Environment Files

   • Update apps/link/pkg/.env.development with the ngrok URLs for link (3006) and api (3001)
   • Update apps/link/app/.env.development with the ngrok URL for api (3001)
   • For the API environment:
     • cd into apps/api
     • Delete the .env.local file if it exists
     • Run yarn setup:phone
     • Update the commented values in the newly created .env.localto point to your ngrok URLs

4. Update Provider Dashboard

   • Go to https://app.medplum.com/ClientApplication/0195ce22-579b-70dc-ad2c-7a96347ff883
   • Click Edit for your application
   • Under "Redirect URI", change it to <Your API ngrok URL>/smart/callback

5. Launch the Application

   • Return to the main flexpa project directory
   • Run the project with your normal startup command
   • In a separate terminal, run yarn db:seed
   • Once seeded restart the project

6. Access on Your Phone

   • On your mobile device, navigate to https://flexpa.ngrok.app
   • When you click Open Flexpa, it may take just a bit longer to launch
   • Connect using the Medplum application