nthopinion / covid19

Code vs COVID-19: Taking down a Pandemic using machines connected globally to extinguish a biological threat of a super virus.

COVID19 Hackathon by Nth Opinion

Calling All Doctors & Coders: Global Hackathon to Defeat COVID-19: Connecting physicians & developers globally in the wake of COVID-19 pandemic

---

Our application is a web app. It has a public facing interface, and a doctor/healthcare worker facing interface. Users can search through a database of previously asked questions about COVID-19 (or add their question to the database if it hasn't already been asked), and obtain answers from medical professionals around the globe.

Explore the website

Join our Slack

Request Feature

Report Issue

Table of Contents

• About the Project
  • Built With
• Getting Started
  • Prerequisites
  • Installation
• Tests
• Roadmap
• Contributing
• Communication channels

About The Project

Calling All Doctors & Coders: Global Hackathon to Defeat COVID-19: Connecting physicians & developers globally in the wake of COVID-19 pandemic

---

Our application is a web app. It has a public facing interface, and a doctor/healthcare worker facing interface. Users can search through a database of previously asked questions about COVID-19 (or add their question to the database if it hasn't already been asked), and obtain answers from medical professionals around the globe.

https://www.covid19webapp.com/

Our realtime database will contain the most urgent questions and answers on COVID-19 and publish it to the world. With our app in the hands of front line workers who have or are already experiencing the first wave, they can share their knowledge and help the health care workers who will be hit next.

NOTICE: This open source project is a work in progress. The best way to get onboarded and brought up to speed is to participate in our Slack channel:

Join our Slack

Update March 15, 2020: Please excuse the bugs as we are working hard to fix them on the fly! COVID-19 is spreading faster than we can code and as a result converted the project to open source overnight. We understand there are bugs and the code is not optimized. Thank you for working with us as we adapt in real-time! Don’t be shy, reach out, and get involved.

Built With

• Create React App

Getting Started

The COVID19 project is a monorepo. The server code is inside the api foler and the client code is inside the client folder.

Prerequisites

This is an example of how to list things you need to use the software and how to install them.

• npm

npm install npm@latest -g

Installation

1. Navigate to the repository where you want to install the project
2. Clone the repo

git clone [email protected]:nthopinion/covid19.git

3. To setup the api, check the README inside the api folder.
4. To setup the client, check the README inside the client folder.

Tests

Testing is important in order to make sure you feature is meeting all the requirements. Launch the test runner in the interactive watch mode by running the npm command

npm test

Roadmap

See the open issues for a list of proposed features (and known issues).

Contributing

Contributions in this project are vital since the situation is evolving rapidly. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

If you are stuck on any of the steps, we have a YouTube video you can look at: https://youtu.be/otuDhXWWnbw

License

Distributed under the MIT License. See LICENSE for more information.

Communication channels

Come over on Slack to be part of the initiative and talk with the other contributors

• Slack

Project Link: https://github.com/nthopinion/covid19/

covid19's Issues

Create Outbound Link + Button to Televideo Inside Physician Portal

Inside the physician portal page:

#159 The Navbar Hamburger - Collapses After Scrolling Down the Page

#159

┆Issue is synchronized with this Trello card by Unito

Language Translation Requests

What language should be added to the COVID19 Web App:

German
Chinese
Italian
etc.

Additional context:

Recruiting all coders x translators to enable the COVID19 Web App for multi-language support (input and output)

eg. Simoultaneous English and German users

Translating hackathon & open source announcement

Translating social media posts asking for physicians to get on the app

Considerations:

Google translate API's, NLP, dictation, human translation?
Ideas to keep a real-time translated database vs. daily updates via spreadsheets

┆Issue is synchronized with this Trello card by Unito

"Are You A Physician / Are You A Coder" Outbound Links

minor fix needed in readme

Some minor adjustment needed to Jim'sprevious update of readme to fix this.

Q&A Listing: Add filter by tags feature

It would be nice if the user could filter the questions by tags attached to them. An intuitive but maybe not super powerful way of doing this could be to click on the tag you wish to filter by on a given question. A more fully-featured version would probably have to have a drop-down menu similar to GitHub issue tags where you can select multiple at a time.

┆Issue is synchronized with this Trello card by Unito

AskCo19 Tip Jar for Covid19: Implement Tip Jar Icon

Two places for tipping for a cause:

(1)
Implement a tip jar icon, clickable, that launches stripe/paypal to accept tips for questions/answers

(2)
Implement a tip jar icon, clickable, inside the telemed platform, that displays tip payment details after the telemed visit

https://ai-passion.appspot.com/

The Tip Jar link should go here:
https://www.gofundme.com/c/act/covid19

┆Issue is synchronized with this Trello card by Unito

Converting Physician Portal UI/UX to be Consistent with Patient Side

┆Issue is synchronized with this Trello card by Unito

UI/UX: Search Bar - Locked Frame Too Large

Shrinking the margins of the iFrame(?) around the search bar.

As you'll notice from this image, the box can fit about three search bars in it, taking up precious screen real estate on mobile for the physicians as they scroll:

Consideration: There used to be a mail form (mailchimp) iFrame embedded that has since been removed. This large white box may also be a remnant of that... TBD

Thanks!

Pass the QID= of the Twitter share, so that it jumps to that question ID on the website with the QID link

What is a coronavirus? Answer: Coronaviruses are a large family of viruses which may cause... at https://qna.askco19.com?qid=10e75ad0-1fae-4198-b5cd-0bf2a4a6e1b4 @thenthopinion
Currently, the link jumps to the top of the page.

Goal: When somebody clicks on the url parameter qid link, it will jump to that question on the page :)

┆Issue is synchronized with this Trello card by Unito

UI/UX: Social Buttons - Shrinking, colour coordinating, simple and streamlined

There have been requests to replace these buttons with small 'icon-only' bird/heart/flag and remove the large bulky rectangular buttons.

Also:

• smaller
• colour = simple black (would be easier on the eyes as physician's open and close the app frequently in front of patients for reference.

See here:

┆Issue is synchronized with this Trello card by Unito

QnA: Add bug report feature to site.

Allow users to submit bugs from QnA side. This can help keep site clean while also giving us insight on whether or not users are having trouble on the site.

If possible, it would be great if issues reported by QnA users were automated to create issues in Git. Googled automating issues in git and it looks like using query parameter may be an option?

Automate Issues

┆Issue is synchronized with this Trello card by Unito

Cross Reference Database When User Selects "Sign up now" on login page

Registration that occurs through the "Sign up now" is not currently cross-referencing database to ensure physician hasn't already sign up through normal registration process. Need to consider this,

In addition, physician who register this way won't have all fields as referenced in #88

┆Issue is synchronized with this Trello card by Unito

The Navbar Language Dropdown Translation Button

The Language Selector in the sidebar only translates the Headers (captions) and not the QnA.

┆Issue is synchronized with this Trello card by Unito

Q&A Listing: Improve view of sources in UI

User Story:
User needs to be able to understand when there is a source on the answer and that they are able to navigate away from the page for more information. Currently sources only read "Source" which may mislead the user.

Requirements:
-Show sources in a more user friendly manner.
-Link format should match link format of #21

Example:

Add sources in answers under physicians board

Ability to add the sources. (important one) - needs design
Sources like PDFs, weblinks (url), ideally youtube links (embedded videos), iphone uploads (photos, videos)

Language Drop Down Selector

Setting up language specific containers.
Default to English.
Drop down on front end to selected language.
Cookie it.

┆Issue is synchronized with this Trello card by Unito

Mac/Chrome: App is Flagged as Not Secure

Reported bug:
Chrome(v80.0.3987.147 64-bit) is flagging site as not secure due to adobe flash set to “ask”. Dave is navigating this site using his Mac- this is occurring in production environment.

Reported by Dave Bates

Duplicate Question Handling

Need to look at ways to manage duplicate questions that may have slight differences (incorrect spelling, different sentence structure, translation error, etc.)

• Possible solution would be to present a user with a warning validation when they attempt to submit question if keywords in new question correlate with existing questions.
• User should be able to select one of the duplicate questions to navigate to answer or select "Continue with Submission".

┆Issue is synchronized with this Trello card by Unito

Do not display `show more` text if there is no content to show

Right now we have a show more and show less text on answers. But these text are displayed even if the answers are short and don't need to be expanded.

It would be good if we could remove those if the answer is already short.

Add rich previews for all links to provide meta information

Add rich preview for links to provide meta information of those links.

Before:

Proposed:

Q&A Listing: Separate answers from individual physicians

User Story:
Physician's may have different opinions on topics, or may have experienced different results on a case they've worked. Separating the answers will help users understand the answers are coming from multiple physicians.

Requirements:
-Separate posts by author
-List author name, posted date, edited date, location (See #22 #20 )
-Like, Tweet, and Report button should appear for each answer submitted

Example:

┆Issue is synchronized with this Trello card by Unito

Align search bar with rest of the elements (Q&A cards, copy)

┆Issue is synchronized with this Trello card by Unito

Moving to discord from slack,

one simple input from my side on the choice of platform of communication , slack has 10,000 messages as cap and the older messages will be archive and not be accessible until we update, so if we could discord to communication to the future, it would be great to grow

When I load the page a weird loading text appear in the left which looks very bad

Can it be possible to implement the loading page better than the loading text take makes the look bad

Newest questions on top for the Physicians board

Physician side http://covid19webapp.com/physician
• Place the newest questions at the top for the physician to answer.

Physician: Add bug logging to physician site.

Allow users to submit bugs from Physician side. This can help keep site clean while also giving us insight on whether or not users are having trouble on the site.

If possible, it would be great if issues reported by physicians users were automated to create issues in Git. Googled automating issues in git and it looks like using query parameter may be an option?

Automate Issues

#47 is similar functionality for QnA site.

┆Issue is synchronized with this Trello card by Unito

Edit link on physician's board

Show different answers separate and add an edit link to edit each answer within a question. (needs design)

┆Issue is synchronized with this Trello card by Unito

Q&A Listing: Create hyperlink when physician adds an answer with URL

Use Case:
Physicians may add URLs to answer section. These URLs should appear as hyperlinks to the user.

Requirements
-Formatting of link should be user friendly (i.e. no need to copy and paste)
-Formatting of link should match #24

Example:
User inputs the following in answer section: "For the best Q&A on COVID, access http://covid19webapp.com".

Answer should display link in manner similar to below so users can easily recognize the link.

Physician Onboarding Page + How The App Works Page

After clicking one of the links on the top right (About, Calling All Doctors, Calling All Coders), we need to create the about page. Something like this:

A second option for the look and feel - something like this (will show mobile this time):

┆Issue is synchronized with this Trello card by Unito

Newer questions should be displayed first for visitors

Visitors should be presented with questions in order of how recently they were added.

Televideo: Pass the physician B2C ID into the physician slot

When a patient clicks on the televideo/tele-education icon (which doesn't exist yet, but needs to be built: "Referral Button"), it will launch the televideo link and pass through a volunteer physician ID:

Televideo Link:
https://ai-passion.appspot.com/

┆Issue is synchronized with this Trello card by Unito

#148 Change "Show More" Flow

The physician answer is cut off after a set amount of characters, leaving up to a full line blank where the answer could have been fully output. As a user, it would be simpler if I were able to see full lines of text with an eventual cut-off rather than a character limit.

┆Issue is synchronized with this Trello card by Unito

"Show More" flow cuts off answers inline

The physician answer is cut off after a set amount of characters, leaving up to a full line blank where the answer could have been fully output. As a user, it would be simpler if I were able to see full lines of text with an eventual cut-off rather than a character limit.

┆Issue is synchronized with this Trello card by Unito

Hitting the delete key on the physician side immediately removes the answer input fields

After deleting a question the rest of the unanswered questions suddenly loses the the answer input fields

Loading screen while fetching the data

When the client is fetching the data from API there is no loading screen for that

┆Issue is synchronized with this Trello card by Unito

URGENT: Replicate Physician Registration Page with Unbounce Implementation

The new Unbounce landing page will be using the URL the existing Physician Registration page. We will need to replicate the registration fields on the Sign In page on the right hand side of the screen.

Steps:

1. User will select "Join the Community"
2. User will complete fields below on the right hand side of screen. When "Request Invite Now" is selected, user will be presented with "Registration Sent" popup.
   (URL: https://www.covid19webapp.com/bIiOOIIqgwEXwUU3SaD0F9)

Fields:

• Email
• Role: (Dropdown)
  • Physician
    -Healthcare Provider
    -Other

-Select Country (Dropdown)

-Profile Link (Clinic)

-Medical Provider Number (eg. NPI Identifier)

-Be anonymous (checkbox)

New Landing Page

Current Sign/In Register

Existing Registration Page

Registration Sent Popup

┆Issue is synchronized with this Trello card by Unito
┆Attachments: NthOpinionRedirectTest-01.mp4 | Screenshot 2020-06-23 at 18.03.20.png | Screenshot 2020-06-24 at 00.02.05.png

Save physician's information in answers section

Save the physician information to track the answers provided at each answer level.
(Needs design and specs)

┆Issue is synchronized with this Trello card by Unito

Televideo: Link Unique B2C ID with Televideo Session Physician Number

When you login to the Physician Portal, and you click the televideo link, it will launch a televideo session with your Physician ID (instead of the randomized physician ID currently being generated):

• Pass the login.info sign in ID into the physician televideo platform

Other Related Git Issues:
#178
#176

┆Issue is synchronized with this Trello card by Unito

Split the log in & Sign up

per Figma design

┆Issue is synchronized with this Trello card by Unito

Disappeared - Confirmation Message upon Question Submission

Expected result - Confirmation message upon submitting question.
Actual result - No confirmation message, potentially resulting in multiple submissions if submitter keeps pressing the "Submit" button to try to get a confirmation message.

From Serena Gerber (Writing/Marketing/PR):

"Hey guys, hopefully this is the right place to share this: I just wrote a question on askco19.com and pressed "Submit" and it didn't give me ANY confirmation at all that the question had been submitted. I pressed "Submit" a few times, so i may have even ended up submitting the question multiple times. Anyways, just wanted to let you know that it seems like the confirmation message that was appearing in the top right corner before (the message that was hard to see) is no longer visible at all. The screenshot below is after i submitted the message."

Handle auth tokens properly

Right now when user switches from Unaswered Questions to Answered Questions, hundreds of requests are fired at once, most fail and we gets tons of error messages in the console. Need to look at this.

cc: @sethuraj

┆Issue is synchronized with this Trello card by Unito

Q&A Listing: Correlate answer with the physician who answered the question

User Story:
As a user of the Q&A site, I may want to know the physician's name to confirm the source is reputable. As a physician user, I may want to attempt to reach out to physician who answered for more insight on a similar case or issue.

Requirements:
Add the following to post (need to confirm field availability):

• Physician Name (Only if physician has indicated they would like their name displayed. Regardless of name being displayed in QnA site, this information should be tracked in DB)
• Posted Date:
• Edited Date:
• Physician Location:

Example

┆Issue is synchronized with this Trello card by Unito

Q&A Listing: Correlate answer with the physician who answered the question (#22 on GitHub)

┆Issue is synchronized with this Trello card by Unito

Add a telephone icon button next to the Flag/Social Media button (that links to televideo)

The button links to: https://ai-passion.appspot.com/

Telephone Icon:

┆Issue is synchronized with this Trello card by Unito

UI/UX Search Bar

The search bar should clear after the patient presses enter and is satified with submission of question

┆Issue is synchronized with this Trello card by Unito

The ask a question pop up is stuck

It does not close after submit and we do not know if it submits. May need to reduce pop ups and consider UX review

┆Issue is synchronized with this Trello card by Unito

Answers disappearing on physician side

The Navbar Hamburger - Collapses After Scrolling Down the Page

Mobile view:

The hamburger seems to be tied to the header when scrolling down.

┆Issue is synchronized with this Trello card by Unito

Implement a one time cookie consent popup at the bottom of the page as per GDPR regulations (on the Webapp)

https://gdpr.eu/cookies/
Cookie compliance
To comply with the regulations governing cookies under the GDPR and the ePrivacy Directive you must:

Receive users’ consent before you use any cookies except strictly necessary cookies.
Provide accurate and specific information about the data each cookie tracks and its purpose in plain language before consent is received.
Document and store consent received from users.
Allow users to access your service even if they refuse to allow the use of certain cookies
Make it as easy for users to withdraw their consent as it was for them to give their consent in the first place.

┆Issue is synchronized with this Trello card by Unito