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.

Sign up for GitHub

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

Jump to bottom

[TEL-281] Telehealth waiting area/ practitioner tool (ios) #18

Merged
merged 12 commits into from
May 8, 2021
Merged

[TEL-281] Telehealth waiting area/ practitioner tool (ios) #18

merged 12 commits into from
May 8, 2021

Conversation

ivanjiang5628
Copy link

@ivanjiang5628 ivanjiang5628 commented Sep 11, 2020 •
edited
Loading

Follow up PR #30

Description

This waiting area feature can be enabled/disabled in jane via the waiting-area-enabled option in jwt token.

  • Adds jane-waiting-area-native feature components/reducer/actions. (based on jitsi version 4627's prejoin feature.)
  • new fonts and CSS updates.
  • Because socket.io client lib has a connection issue between our socket.io server and the react-native video chat app (Can't connect via socket.io-client on react-native socketio/socket.io-client#1245), I use the SocketWebView web view component to receive the remoteParticipantsStatus info/event from jane and jane socket.io server via the video chat web app.

Risk / General PR Class

  • 💚 = Low Risk

🌟 = New Feature (Adds Functionality)
☕️ = JS Dependency Changes

Release Note

Dependencies / ENV / Migrations / Client Reset

Tally Token

Release Risk Assessment

Demo Notes

Loom Video:
https://www.loom.com/share/6960e2dc17394d069378babca655f580

Code Review

Resource: Dev Team Notion Page
Resource: Code Review Checklist

  • I clearly explained the WHY behind the work, in the Description above

Design

  • I added instructions for how to test, in the QA section below
  • I added tests for changes, or determined that none were required
  • I demoed this to the appropriate person
  • I considered both mobile & desktop views, or that wasn't relevant

Code

  • I committed code with informative git messages
  • I wrote readable code, or added comments if it was complex
  • I performed a self-review of my own code
  • I rebased my branch on the latest master
  • I confirmed that all CircleCI tests are passing
  • I didn't add new npm packages, or else I made damn sure the yarn.lock changes are safe for existing production packages

QA and Smoke Testing

Steps to Reproduce

  • install Jane Online appointment QA ios app( version 0.0.1(17) ) with test flight.
  • Create an online appointment in jane admin app in iOS safari/chrome -> go to the ios video chat -> You will see the waiting area page.

Fixed / Expected Behaviour

This waiting area feature only enables if the telehealth-waiting-area beta flag option is checked in jane. without the enabled beta flag, users will join the call directly.

On this waiting area page:

  • When the patient opens the video chat app and is on the waiting area page, the practitioner-side video chat app will enable the admit button and the practitioner can see a client is waiting badge in the appointment panel in jane admin app.

    • If the practitioner clicks on the admit button, the practitioner will join the call -> the patient-side video chat app will enable the begin button.
    • Then the patient can click the begin button to jump on the call and the video chat app will notify Jane that the patient has arrived.

  • When both participants are on the waiting area page:

    • if the practitioner leaves the waiting area -> the patient-side will not allow the patient to join the call and the begin button will be disabled.
    • if the patient leaves the waiting area -> the practitioner-side will not allow the practitioner to join the call and the Admit Client button will be disabled.

  • Older version IOS app compatibility:

    • If one participant is using the older version IOS app which doesn't include this waiting area feature update -> both the practitioner side and the patient side can start the video call by clicking the enabled begin/admit client button.

Other Considerations

Jitsi backend update

N/A

Screenshots

Loom video:
https://www.loom.com/share/6960e2dc17394d069378babca655f580

@ivanjiang5628 ivanjiang5628 self-assigned this Sep 11, 2020
@ivanjiang5628 ivanjiang5628 changed the title [TEL-282] Telehealth waiting area/ practitioner tool (ios) [TEL-281] Telehealth waiting area/ practitioner tool (ios) Sep 11, 2020
@ivanjiang5628 ivanjiang5628 marked this pull request as ready for review September 14, 2020 17:30
@ivanjiang5628 ivanjiang5628 force-pushed the waiting-area-rn branch 3 times, most recently from 31efca5 to 8753da0 Compare October 2, 2020 18:38
@ivanjiang5628 ivanjiang5628 force-pushed the waiting-area-rn branch 2 times, most recently from 785118a to ed596cf Compare October 6, 2020 05:50
gerbus
gerbus requested changes Oct 13, 2020
View reviewed changes
Copy link

@gerbus gerbus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Took a good look through the code here, generally looks great Ivan 👍 . I noticed a few things I thought should be addressed, and then also some thoughts/questions. Also, would love to see some screenshots of the new WaitingArea in the PR Writeup.

react/features/toolbox/components/native/Toolbox.js Outdated Show resolved Hide resolved
react/features/large-video/components/LargeVideo.native.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/components/JaneWaitingArea.native.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/index.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/middleware.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/functions.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/components/DialogBox.native.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/components/DialogBox.native.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/components/DialogBox.native.js Outdated Show resolved Hide resolved
react/features/jane-waiting-area-native/components/DialogBox.native.js Outdated Show resolved Hide resolved
@ivanjiang5628 ivanjiang5628 added demoed Demoed with a PO or key stakeholder Risk - Med Medium risk of disruption to codebase or infrastructure. and removed demoed Demoed with a PO or key stakeholder labels Oct 13, 2020
@ivanjiang5628 ivanjiang5628 force-pushed the waiting-area-rn branch 4 times, most recently from f86f6cf to 958f1b6 Compare October 19, 2020 21:55
@ivanjiang5628 ivanjiang5628 requested a review from gerbus October 19, 2020 21:57
@ivanjiang5628 ivanjiang5628 force-pushed the waiting-area-rn branch 3 times, most recently from e3d626d to bfd4652 Compare October 19, 2020 22:48
gerbus
gerbus approved these changes Oct 20, 2020
View reviewed changes
Copy link

@gerbus gerbus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for addressing all my feedback!

@gerbus
Copy link

gerbus commented Nov 2, 2020

Hey @ivanjiang5628, just curious why there were more changes? Did this PR get demo'd to @markhazlett before going to code review?

@ivanjiang5628 ivanjiang5628 marked this pull request as draft November 2, 2020 18:03
@ivanjiang5628
Copy link
Author

ivanjiang5628 commented Nov 2, 2020 •
edited
Loading

Hey @ivanjiang5628, just curious why there were more changes? Did this PR get demo'd to @markhazlett before going to code review?

reset the PR to commit and will create a follow-up PR to update the legacy ios app compatible issue/ waiting message UI.

@ivanjiang5628 ivanjiang5628 marked this pull request as ready for review November 2, 2020 21:58
@ivanjiang5628 ivanjiang5628 mentioned this pull request Nov 3, 2020
Closed
12 tasks
@clem-jane
Copy link

Thanks for not adding to this PR, @ivanjiang5628
Let's keep a separate PR to add the newer changes instead of updating this PR.

@clem-jane clem-jane added the demoed Demoed with a PO or key stakeholder label Nov 4, 2020
@clem-jane
Copy link

This was demoed with a Testflight build linked to s14. We should be able to QA with the same setup as well.
The key areas demoed were the patient's view and practitioner's view of the Waiting Area. The buttons only function when both participants have arrived.

@ivanjiang5628 ivanjiang5628 mentioned this pull request Nov 12, 2020
Merged
16 tasks
@jngo-janeapp jngo-janeapp self-assigned this Mar 24, 2021
@jngo-janeapp
Copy link

jngo-janeapp commented Mar 25, 2021 •
edited
Loading

Before Testing Thursday March 25th, 2021

  • CI must be passing
  • No conflicts
  • No unresolved reviews/changes requested
  • No additional changes/pushes from dev since the last round of QA
  • Release note is sufficient for #features
  • Read through Notion / Jira story / Linear Issue / Slack Convo / Demo video

Developer's Recommended Test Plan

  • install Jane Online appointment QA iOS app( version 1.3.0(1)) with test flight.
  • Create an online appointment in Jane admin app in iOS safari/chrome -> go to the iOS video chat -> You will see the waiting area page.
  • Create an online appointment in Jane admin app -> Go to the video chat -> You will see the waiting area page.
  • When the patient opens the video chat app and is on the waiting area page, the practitioner-side video chat app will
    enable the admit button and the practitioner can see a client is waiting badge in the appointment panel in Jane admin app.
  • If the practitioner clicks on the admit button, the practitioner will join the call -> the patient-side video chat app will enable the begin button.
  • Then the patient can click the begin button to jump on the call and the video chat app will notify Jane that the patient has arrived.
  • When both participants are on the waiting area page:
  • If the practitioner leaves the waiting area -> the patient-side will not allow the patient to join the call and the begin button will be disabled.
  • If the patient leaves the waiting area -> the practitioner-side will not allow the practitioner to join the call and the Admit Client button will be disabled.
  • Older version IOS app compatibility:
  • If one participant is using the older version IOS app which doesn't include this waiting area feature update -> both the practitioner side and the patient side can start the video call by clicking the enabled begin/admit client button.

Additional Thoughts on Testing

  • Can see validation for non supported browsers
  • Ensure all buttons work as expected
    Chart_-Patients-Demo_Clinic-_Jane

Mobile, Browsers, Jane Desktop

  • Google Chrome
  • Firefox
  • Safari
  • iPad Mini
  • iPhone

Peer Review for Moderate Risk or Higher

  • Peer Review

Pass Story on QA Board / Mark Done in Jira/ Mark Scheduled for Release in Linear

  • LGTM 🚀

@jngo-janeapp
Copy link

hey @ivanjiang5628 looks good on IOS !

Ivan Jiang added 11 commits April 7, 2021 00:41
setup websocket and reducers/actions
34148e6
UI update for the prejoin dialog box and button
cde7721 
add jane video chat logo,
add new jsCoreDateCreator function for fixing the moment "invalid" date issue.
add ActionButton, DialogBox components and rewrite the Prejoin component.
update webview event
ac704bc
add appState listener to send participant left status signal if app i…
1b081eb 
…s inactive.
fix typo issues and centralize the participant info with the "getPart…
4cc1c05 
…icipantInfoFromJwt" function

remove middleware.js from jane-wating-area component

add getParticipantType function to return participant type from store.

update checkRoomStatus, getRemoteParticipantsReadyStatus & updateParticipantReadyStatus functions.
pre-call/waiting message component & waiting area action button UI up…
8ef44f9 
…date.
handle the jw token expiration error
97c7eec 
refactor the waiting area component
add "iphoneHasNotch" function to detect iphone screen notch.
743ed08 
remove componentDidUpdate lifecycle code in "WaitingMessage" component.
update the web view onerror event handler.
2538a3e 
fix the jwt invalid token error bug when participant click on the hangup button on the waiting area page.
fix the testing pre-call text comp has a "black background" over the …
71cdb3f 
…RTCView issue.
Merge branch 'pre-call-message-ios' into waiting-area-rn
0842615 
# Conflicts:
# react/features/base/conference/functions.js
# react/features/base/i18n/dateUtil.js
# react/features/base/react/components/native/WaitingMessage.js
# react/features/base/react/components/native/styles.js
# react/features/base/styles/components/styles/ColorPalette.js
# react/features/large-video/components/LargeVideo.native.js
@ivanjiang5628 ivanjiang5628 force-pushed the waiting-area-rn branch 2 times, most recently from 642c6aa to 32e038a Compare April 7, 2021 20:36
send a custom event to amplitude to indicate that participant status …
5ba1749 
…in waiting area was changed

fix a bug in shouldShowPreCallMessage function
@ivanjiang5628 ivanjiang5628 merged commit b9f30cb into react-native-prod May 8, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@gerbus gerbus gerbus approved these changes

@calvinmcc calvinmcc Awaiting requested review from calvinmcc

@trevvvy trevvvy Awaiting requested review from trevvvy

Assignees

@ivanjiang5628 ivanjiang5628

@jngo-janeapp jngo-janeapp

Labels
demoed Demoed with a PO or key stakeholder Risk - Med Medium risk of disruption to codebase or infrastructure.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@ivanjiang5628 @gerbus @clem-jane @jngo-janeapp