factn / resilience-app Goto Github PK

We are going to use npm ci instead of npm install. This is to preven our package-lock.json change every time npm install is running. Also it is more strict.

README.md should update about standard for this change.

We want to sync theme.js to figma color, according to their material design

Steps to Reproduce:

1. Go to Resilience staging app
2. Click on View missions
3. Observe missions screen

Expected result:
Anonymous users can view the missions page and volunteer right away.

Actual result:
Missions page appears empty when anonymous user visits the page without signing in.

Screenshot:

I'm taking on the challenge of implementing priorities into missions. I have several ideas:

• requesters submit form and the description of task is analyzed for certain keywords (for now we hand code a simple string.contains solution, then later on look into an ML library)
• based on keywords we add up a tally. If it is below a certain value its of lesser priority. If its of a higher value, its higher priority. However, I'm thinking of marking from 1 being the highest, and 5 the lowest
• would it be possible to integrate the priority values into the firebase schema, so that way when we call the missions we can also pull up its priorities at ease?

I was requested about looking into displaying data onto maps from a form. The end user mentioned these tools:
Searchable Map Template CSV
and
Searchable Map Template Carto

Once the map PR is resolved, we could look to see if this would be a front end issue, or more for backend.

Very basic styling, we would like it to look decent, with a placeholder of image, and properly field. Do contact designer if you feel like you need. Update me with status so I know where you are at

Ignore the appbar, and color, go with hardcoded if you like for now, we will input theme later
Making sure you are using existing component, if it not existing, you can ignore it for now, add a placeholder with correct dimensions
maxwidth of container to 600px!

app/page/Home

Home.js
Home.style.js
Home.test.js
index.js // export default here

@qdozaq asked on card that he would "like to see the rules of git branching naming convention so that I know how to name my branch correctly"

Good point. lets do that and add that to CONTRIBUTING.md

PS So far the branch naming scheme is :

feat/whatever_you_want

But perhaps we could get a bit fancier than that.

--

Long as we are updating CONTRIBUTING.md maybe we could put a note in there begging people to delete their branches after they create a PR also.

Compile a list of important accessibility when programming.

Official guideline: https://www.w3.org/WAI/WCAG21/quickref/

Steps to reproduce

1. Enter the Heroku app on mobile
2. Observe any page in the app

Expected result: App can fit the screen size of the mobile device and the user can see the entire UI.

Actual result: the UI stretches beyond the current viewport of the mobile device.

Bunch of question from March 24 from the figma

March 24
As you’re working if there are questions/clarity that you need, put them here if we can resolve them later or in slack, if it will hold up your work.



1. Who divides the mission into it’s specific tasks? How does this get communicated to the requester? 

2. How do we want reuesters to communicate with doers? (Currently have text, phone, email...is text and phone redundant?) Commenting in app? Would comments be open to all people on the mission or specific to the worker/requester?

3. Are doers and donors both types of “workers” performing “tasks”?
4. General explanation of the money aspect would be helpful: who is paying whom? where/how does money transfer between them?
5. How does a requester view comments?
6. What’s the difference in function between the 2 facebook posts?
7. Is the mission request created by Audrey or someone else? (Because the description is written in 3rd person) Who do workers contact?
8. Do you have to rate a mission, in order to complete the mission?
9. Requester has opportunity to rate mission, with pathway to also rate individual tasks. Do they also rate individual workers? How does the mission / task rating impact the worker’s rating?
9. Do the individual task ratings impact/override the overall mission rating?
10. The grocery list type of task should be itemized in some way so that the Doer can go through each item in the list and no the total number of items etc.. to make sure nothing is missed and for accurate packing. (If the photo provided isn’t legible, should the Doer be able phone the Requester for clarification?).
11. Is the Doer taking on the task expected to fulfill the order (go buy the items) and then the Requester pays the app, and app will pay out the Doer?

Link to design

Ignore the appbar, and color, go with hardcoded if you like for now, we will input theme later
Making sure you are using existing component, if it not existing, you can ignore it for now
maxwidth of container to 600px!

app/page/AccountCreate

AccountCreate.js
AccountCreate.style.js
AccountCreate.test.js
index.js // export default here

Fix spacing around icon and text:

This is a nice mockup:

https://www.figma.com/file/v5HdxDsvO2NzMuZU6CArzF/Corona-Donor-Designs-in-progress?node-id=0%3A1

Right now, we have Sign In Using FB or Phone, both of which might not include attributes like, Name, Location etc. We need a dedicated Profile Page where users can go and edit their data.

redux architectural would almost be alike to this one https://github.com/erikras/ducks-modular-redux
but structure like this
model/
user/
index.js //export stuff here
actions.js // All the const action + action creator here
user.js // the model, here is what requester can do, such as api to backend, example

this.props.dispatch( user.requestNewRequest() ) // this function handle async things
this.props.dispatch ( user.login() )

From the frontend slack channel discussion

Link to Figma design: Link
Please refer to figma design as it has changed! The picture uploaded are only used as a point of ref.

Ignore the appbar, and color, go with hardcoded if you like for now, we will input theme later
Making sure you are using existing component, if it not existing, you can ignore it for now
maxwidth of container to 600px!

app/page/RequestCreate

RequestCreate.js
RequestCreate.style.js
RequestCreate.test.js
index.js // export default here

Numbers to add:

+17777777777, Code: 123456
+12223334444, Code: 123456

Currently, just for example, the screen which lists all current missions is 'just white' while missions load. Then, if there are no missions it stays white.

We need some sort of loading spinner while it's loading. We could also do with something like a '0 missions matching this criteria' or something if it resolves with 0 missions.

Steps to reproduce:

1. Go to Resilience App on Heroku
2. Sign in using Google authentication
3. Open up side navigation -> Go to Volunteers Needed
4. Click on Volunteer button
5. Enter a number that already exists
6. Cancel the modal prompt asking for a phone number
7. Go to the same url in the search bar

Expected result: The page refreshes and missions appear on the page.

Actual Result: A cannot get route error page can be seen in the browser instead of the missions page.

So we can have a profile yo

add a new prop :

• required: boolean
  when true, and field is empty, it should tell the user that the field is required

As a developer I want to see the rules of git branching naming convention so that I know how to name my branch correctly

Ignore color, go with hardcoded if you like for now, we will input theme later
Making sure you are using existing component, if it not existing, you can ignore it for now
maxwidth of container to 600px!

app/page/AccountAuthPhoneConfirm

AccountAuthPhoneConfirm.js
AccountAuthPhone.style.js
AccountAuthPhone.test.js
index.js // export default here

We are having some trouble with minimization and webpack. Try npm run build from master branch

I traced the error to this:
webpack-contrib/uglifyjs-webpack-plugin#234

If anyone want to do something about it, be my guest, I will remove the webpack config in heroku branch for now untill someone can provide a better config

Create a component with this specification
props includes: label, maxlength

Steps to reproduce

1. Open the heroku app
2. Enter a protected route inside of the search bar
3. Observe the output of the page.

Expected result:
User can be redirected to login page with the warning "You must be logged in".

Actual result:
User is greeted to a "cannot get" route page instead of the login page that specifies a login warning.

Once designs for logo and new LP are complete, we need to replace the favicon for the landing page:
https://coronadonor.org/

Hi,
I noticed you've left sensitive information in the following file;

• Firebase credentials

This may lead to a security issue in your app, so you should remove these informations from your repository.

Regards,
Lucas GRELAUD

create color, bgcolor (we are following material design component api) as props that will override any of the button preset.

Designer changed the logo!

Steps to reproduce

1. Enter into app
2. Go to login page
3. Sign in with Google account
4. Press toggle menu and go to volunteered missions
5. When on empty missions page, press on toggle again and press sign out
6. User remains on empty missions page

Expected result:
User is redirected to home page after logging out

Actual result:
User remains on empty missions page after logging out

Steps to reproduce:

1. Go to Heroku staging page for mutualaid.world
2. Click on Sign In/Sign Up
3. Click on Facebook login button

Expected Result: Facebook authentication modal or redirect appears when button is clicked on.

Actual result: Functionality for Facebook authentication appears to be missing from the button.

Ticket Code:: 1.06

Screenshot of button location:

Steps to reproduce:

1. Go to Resilience heroku staging app
2. Sign in with Google account
3. Click on user profile
4. Observe the user profile screen

Expected result: User can see an upload profile picture option that can take from their desktop or their mobile device.

Actual result: Button to upload image is missing from user profile page

We have now Husky which will do automated linter each time we commit
https://github.com/typicode/husky

I would like to have also automated test each time we commit + push as well

The hamburger menu right now is static. At the very least, it should have:

• Link to user Profile
• Link to Missions Page

Image is only for ref, might be changed in the design
Link to the design

Tldr: Prettify it. Maybe a small button?

Going to SignIn page gives this:

Use PropTypes(https://reactjs.org/docs/typechecking-with-proptypes.html) for components and JSDOCs(https://jsdoc.app/about-getting-started.html)for functions

Code to cover:

• src/app/component/PhoneLoginForm

• src/app/component/MapView

• src/app/component/Input

• src/app/component/ImageUpload

• src/app/component/FirebaseAuthUi

• src/app/component/MissionCard

• src/app/component/PrivateComponent

• src/app/component/ProtectedRoute