Description

We never landed on the score ranges and what they mean e.g.

0 - 25 = Bad
25 - 50 = OK
50 - 75 = Good
75 + = Awesome.

Description

Don't plug into any specific api

Technical Notes

[Add Technical notes]

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

Fix the zipcode submit to get data from the new api endpoint

Description

When content of a page is scrollable, there should be more space between the 'Next' button and the edge of the screen.

Description

The formatting of the How We Calculate this (should be a capital T) could use some improved styling for readability.

Description

There recently was a "brand" swap. there are still some leftover remnants of the old brand. These need to be updated to Climate Cooperative logos and resources.

Update the Header component (src/components/Results/Header/header.jsx), so that:

1. The anchor ref on the logo redirects to https://www.climate-cooperative.org in a new tab (target=_blank)
2. The image is the one provided.

Technical Notes

[Add Technical notes]

Risks

Image to be provided

Related Issues Or Discussions

[...Issues]

Description

Make repo more hospitable to open source contribution

Technical Notes

remove blocking actions and unused infra

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

Description

Improve styling on hover effect on the navigation bar

Technical Notes

[Add Technical notes]

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

Description

We use a combo of LocalStorage and React's built in context. Pivot to use context only or introduce Redux. LocalStorage is an older, slower implementation, and doesn't plug in well with React's lifecycle.

Technical Notes

• https://react-redux.js.org/

Risks

Research UX around calculator persistent state.

Related Issues Or Discussions

[...Issues]

Create button to reflect mock up on miro or current bubble app

Description

The FE does a lot of heavy lifting in terms of calculation, especially when rendering the results page. This is a perfect example of something to move to the backend.

This also provides a better separation of concerns between logic and rendering.

In terms of contribution, this will also help introduce an area for improvement and pattern for expansion.

Technical Notes

Create new path in api to handle calculation of results. /score???

Risks

Both FE and BE will need to be worked on simultaneously. Some coordination there.

Related Issues Or Discussions

[...Issues]

The user should be able to save the page as a pdf with their results.

https://www.npmjs.com/package/react-pdf

Description

Right now this is a screenshot of the results page and really it should be a well formatted PDF that contains all of the information in the audit, including the dialogue content.

Attached is the current PDF.
download.pdf

Description

Message should be printed above the field and should scroll to where error is at for the user.

Description

Currently the file name is called download. We'd like to change this to DIY Home Energy Audit.

Description

Update or create

• README.md
• CONTRIBUTING.md
• LOCAL-DEV.md
• ECOSYSTEM.md (ecosystem diagram)

Technical Notes

[Add Technical notes]

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

#14

After discussions best path forward is to:

1. transfer zwell.io domain to route53
2. Create SSL certs in ACM from domain in route53
3. Standup cloudflare/route53* -> cloudfront -> s3
4. upload bundled app to s3

* entry point may be tentative. linking to cloudflare might boost SEO, but also may bring the same present the same issues that made us move to route53

Fix block to reflect the blocks made in Miro

With the addition of new developers the repo needs some clean up and patterns created.

Create:

• PR template
• Issue Template?
• Branch protection rule (that protect us, not slow us down)
• pre-commit hooks (husky and lint-staged)

Description

We should move the calculation to be handled on the API

Technical Notes

[]

Risks

[]

Related Issues Or Discussions

[]

##Description

Refactor and rewrite any code that does not meet Google's javascript coding standards

##Technical Notes

https://google.github.io/styleguide/jsguide.html

use calculation in results

Replace any placeholders. Most will be apples

Description

The View/Edit Answers Dialogue Content could use some improvement to formatting and a method for allowing people to quickly go back and edit their choices to get a new result.

Description

There isn't enough spacing on the top of the form fields for certain appliances to be able to read the full appliance name.

Description

If you enter a valid or invalid URL you get an access denied message. We need handle more gracefully. Valid URLs should return a proper response and invalid URLs should 404?

Test and ensure that the calculation is accurate and working for many different form fillouts

Description

The DevServer we use right now (webpack) has been reported as slow, and is slowing down development. Look into ways to decrease live build/dev time

Technical Notes

(https://esbuild.github.io/)

Risks

If it ain't broke, don't fix it

Related Issues Or Discussions

[...Issues]

Description

Results page should reflect figma design

Technical Notes

[Add Technical notes]

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

The Pipeline as of now has a lot of had coded values in the terraform. Its better to parameterize these values, allowing for re-usable code with simple config changes.

add variables for:

• Application name
• ACM Cert name
• domain name
• CNAME aliases

Create button to reflect mock up on miro or current bubble app

the last page of the form needs a button for 'No' when asked if they have solar panels and wind

Description

If the user has gone through the form and returns to the heating and or cooling page, the source is not selected when it should be

Technical Notes

Description

Form pages on windows machines have a white background but gray on Mac. Should be gray on all machines.

Description

When app files log issues so we can diagnose any additional bugs we need to fix.

Technical Notes

[Add Technical notes]

Risks

[Add Risks]

Related Issues Or Discussions

[...Issues]

To utilize zwell's DNS provider (cloudflare) and seucre traffic over https, cloudfront has to be wired into sit between cloudflare proxy and s3. This allows for https traffic to come in (verified with ssl cert) to cloudfront and then gets forwarded to s3 via http.

Technical notes:

• Add cert to ACM using existing origin cert (MUST BE IN US-EAST-1 REGION)
• Create cloudfront terraform
• Update CNAME rule in cloudfront to forward to cloudfront distro endpoint

https://aws.amazon.com/cloudfront/

Description

Question mark popup spans the entire screen. Should take up a much smaller area.

The favicon is currently the React.js default one. Update to be the zwellhome.com one.

Description:

• Using Webpack Locally, it picks it up, but currently the app is being built via react-scripts in the pipeline. Update the favicon location and usage, to work with react-scripts.

Technial notes:

• Update public/index.html?
• manually update s3 bucket to remove lingering default favicon

Here is the current design of the result page score:

https://www.figma.com/file/SESTgQliRsgV72Q8n4r46n/Zwell-Desktop?type=design&node-id=0-1&mode=design

Our current implementation is more of a rough proof of concept and not well polished

Description

individual score modal should have recommended appliances. As of now, data is mock data. Recommendations should be from the api at the https://api.zwell.io/hvac and https://api.zwell.io/appliances

Technical Notes

Recommendations can be hard coded instead of api requests. Logic can be found at https://docs.google.com/spreadsheets/u/3/d/1Yco-U4cEhrgUse0zyaeehpWGszDV5HD6nemANVYl6YI/edit?pli=1

Description

Not sure why we received no results. Captured the console to see if it can be diagnosed.

Description

When an invalid zipcode is entered, it is possible to continue through the calculator, even though the zipcode data returned will error out on the results page.

Technical Notes

• add validation to /zipcode page
• add validation to results page. Maybe an error page? or component
• don't use window local storage... we already use react's context functionality

Risks

none

Related Issues Or Discussions

#29 #30

Make the score circle look good. Should look similar to one in Miro

results page need to load in all previous input to calculate the final results.

In order to serve the calculator app (react app) we need to bundle it to a single set of assets, and push to S3. From there the networking infra will handle the rest.

Items to upload:

• index.html
• pics/assets
• fonts??
• bundles react app

Description

On results page, "See How You Compare!" content should have better styling. Creative freedom welcome.

Technical Notes

We do not have a styling guideline but try to use the same colors as used.

Complete modal for each score block

Smoke test the app.

Go through e2e and find places that don't work as expected. Make Issues for these to track.

Modal should have a way to go back to each page and make changes to the page that the header represents