stormliucong/oard-react

OARD (An acronym form of "oh alright"): an Open real-world based Annotation for Rare Diseases and its associated phenotypes

This is a React web app to serve the web app of OARD. The backend is provided by OARD API. Currently it is hosted on the NCATS AWS server (https://rare.cohd.io/). This repo currenly only have the React web app part. The backend Flask API is hosted in another repo. We expect to merge two repos in the near future.

An overview of OARD project

How to use OARD

• Use web app
• Use API

How to setup OARD

I followed this article to setup up OARD as a flask API + React web app.

1. Requirement

You need to install three packages on your machine:

• Npm : The package manager for the Node JavaScript platform.
• Node.js: The JavaScript runtime that you will use to run your frontend project.
• You’ll need to have Node >= 14.0.0 and npm >= 5.6 on your machine.
• Yarn: A package and project manager for Node.js applications.

2. Installation on Ubuntu

git clone https://github.com/stormliucong/oard-react.git
cd oard-react
npm install # install dependencies
yarn build

3. Deploying on Nginx

Assuming you have your React application in the /var/cohd-rare/oard-react directory, change the root configuration in /etc/nginx/sites-available/cohd-rare to:

server {
    
        location / {
                root /var/cohd-rare/oard-react/build/;
                index index.html;
                try_files $uri $uri/ =404;
        }
        
}

oard-react's Issues

add intro pictions

navbar content update

comments from Yilu

1. As a new user, I think we may need to add a brief instruction on the top of the website. Otherwise, it's not that explicit why we need to enter two lists of concepts.
2. In the tip for "service", there is a duplicate "Association". We can also make "Frequencies" and "Association" bold.
3. I entered one concept to each query list. In the result, what does "LnRatio" mean? Do we need to add a tip for it?
4. I entered same concept lists (e.g., abnormality of the musculature, muscle weakness) to two search boxes and I didn't get any result. However, if I delete one of the concept from a list, 1 result is returned. Is that a bug or did I misunderstand the function we provided here?
5. When only 1 result is returned, should the hint be change to "1 result returned" instead of "1 Results returned"?
6. The curerent dataset instruction is not informative enough... I still don't know what dataset is for...
7. Not quite sure what's the unit of the "pair count"?

Instruction for Concept list 1 and 2 not clear

The instruction for Concept list 1 is "Query Concept List 1", while for concept list 2 is "Query Concept 2", should it be "Query Concept List 2", could Query 2 be a list of concepts too?

Suggested arrangement:
Please input "primary" concept list:
[INPUT field]
(Optional) Please input "secondary" concept list:
[INPUT field]

My understanding Query 2 concept list could be empty, so it is optional?
The naming of Query 1 and 2 seems not very informative, maybe add short description or rename them? (Only use primary and secondary as placeholders)

Redundant text for Service instruction

Original Text: "Frequencies: It will return single or pair concept count and frequencies; Association; Association: It will return asssociation based on statistics."

I think "Association;" is redundant.

Some logic needs to be fixed for the form display

Need a tree view for state props to build a chain logic

top_n does not work

top_n does not work in the https://rare.cohd.io/api/association/obsExpRatio API endpoint

Some design suggestions for the site

Hey Cong,

I figured I would just make an issue to keep track of these these post-meeting. The "i" icon on dataset on the OARD site is a little hard to see, and the difference in sets could be more clearly printed underneath the section that looks like this and then the results can go under it, just to remind the user of what the dataset number indicates. Alternatively, you could make a shortcut string name for each dataset.

Also, it's not super clear that you have to type one term in the first field or a list of terms to then get pair frequencies. If left blank, "mostFrequency" returns the same result as singleConcept. Some instructional tutorial or something to make this clear to the user may be really helpful.

Lastly, maybe highlight the words underneath like: _O_pen _ _A_nnotation of _R_are _D_iseases to make OARD's meaning clearer.

We can use this to discuss, if you like.

Best,

Jim