Code Monkey home page Code Monkey logo

app's Introduction

Impactasaurus Web App

Impactasaurus is changing the way charities measure and report on social impact. We are building a free, open source, easy to use, configurable impact measure tool, which is compatible with any CRM. Read more about Impactasaurus at https://impactasaurus.org.

The web app is written using typescript, react, apollo and semantic UI.

Getting Started

To get an account, you can sign up for Impactasaurus at https://impactasaurus.org. To get an idea of the typical workflow, check out our recent webinar.

To run the application against the live backend, simply:

npm install && npm start

Then navigate to http://localhost:8080. You should be able to log in and use the application exactly as it appears on the live site.

Running a Local Backend

If you want to try out changes using a local server and database you need to host the server locally and then connect the frontend to it.

First spin up the server project, details for how to do this can be found in the server project.

Then edit config/main.js, changing config.app.api to point at http://localhost:8081 instead of the live API.

Contributing

Please read the contribution guidelines to find out how to contribute.

Thanks goes to these wonderful people:

drimpacttomdohnalnikw92abhishek71994Remoraxthemakshter

Contributions of any kind are welcome!

app's People

Contributors

abhishek71994 avatar codespook avatar dependabot[bot] avatar drimpact avatar remorax avatar snyk-bot avatar themakshter avatar tomdohnal avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

app's Issues

Review at question category level

With impactasaurus/server#3 and impactasaurus/server#8 complete, extend the journey of change review page to be optionally viewed at the category level.

Apply initial styling

Put together a basic styling for the website. Focus on picking out a reasonable colour scheme (should feature the impactasaurus purple) and designing the overall app skeleton for individual pages to build on top of.

Consistent chart axis

When displaying radar or line charts, set the min and max axis to the maximum question range rather than the range seen in the meeting.

Set page titles

Titles are currently just Impactasaurus | Impactasaurus. Change to be {page title} | Impactasaurus. We currently have react-helmet configured with a page title template of %s | Impactasaurus, but lower level pages aren't setting their sub titles.

Different colours for categories

On the question set page, the categories are shown against questions in a coloured pill. It would be nice to vary the colour of the pill based on the category.

Colours should be in keeping with the impactasaurus theme, some variables of interest will be found in theme/variables.less

Use semantic tooltips for hint

Change from the CSS comments to semantic tooltips. Once done, check for other CSS tooltip usages and if none remove library

Category delete error handling

Improve error handling when deleting categories. Currently shows error on all category list entries and should really handle the 'can't delete category in use case' cleanly

Indicate that the question set is automatically saved

It is not clear that the question set is saved automatically to users. Make it clearer using some sort of visual indicator.

I believe I have seen some sites show little symbols when it has been saved or just a label stating it is saved automatically.

Archive questions

In the question set editing page:

  • instead of saying delete question, say archive question
  • show deleted questions in the list, but state they have been archived

Optional question descriptions

When creating questions, allow the user to specify an optional question description. This should be added to add likert question mutation.
When fetching questions, include the description by default.
When displaying questions, if they have a description, it should be included on the question asking UI.

Blocked by impactasaurus/server#5

Delete records

Allow users to delete meetings associated with a beneficiary

Likert value specification

Currently when users add a question to a question set, the likert scale is automatically set to range from 0 on the left, to 10 on the right.

Allow users to specify left and right values when adding likert scale questions. This allows users to specify the values associated with the left and right extremes of the likert scale. In doing so, this affects the number of points in between which can be selected as an answer.

It is valid to have the left value > right value. This is handled in the app and is required for some question sets (like SDQ).

This is permitted via the API, just no exposed via the web app.

Service Report

We should introduce a high level service report to the system.
This should identify the organisation's impact over a given time period.

Show archived label on review

Review page should show answers from deleted questions, however, the question label should make it clear that it has been archived.

Gather conducted date from user

When conducting a meeting, the user should be able to specify a conducted date, allowing meeting results to be entered retrospectively.
This should use a date and time picker.
The picker should default to now.

Allow meetings to be continued

The web app allows meetings to be continued from where they left off. This can currently be achieved by navigating to the meeting URL again. However, there is no way in the app to get back to this page. This would require some form of list of meetings within the review page, allowing users to continue unfinished ones.

Edit questions

Allow users to edit questions, this requires server changes first!

Interviewer name in review page

Show who performed/captured the interview with the beneficiary on the review page. Currently has no view showing individual meetings, so not sure where this will go quite yet.

Design landing page

Design and style the landing / home page. This page should help guide the user whilst they are new to the system whilst also still being useful for more experienced users.

Change password facility

I don't think our users will have password managers, as such, I think having a password they won't remember may be a sticking point to use.

Style review page

Focus on:

  • getting the radar visualisation reactive
  • toggling series in the radar chart using the meeting list

Question set categories

Allow users to create and delete categories for a question set. This should allow setting name, description and aggregation. Is blocked by impactasaurus/server#3.

Edit categories

Should be possible to edit categories in the question set page. Should be possible to change the category name, description and aggregation.

This is possible via the API, just not yet exposed on the web app.

QS: Split up name and description editing

Currently you can only edit the name and the description of a questionnaire at once. There is no possibility to edit just the name or just the description.

Change this, so users can edit just the name of just the description.

(I also don't like the way the editing currently looks)

Set category on question creation

Currently categories can only be set when a question has already been created. When creating a question it should also be possible to set a category. This should show the same dropdown as used when setting a question category, and it should default to No Category.

Question category

On the question set page, allow users to set, remove and view a question's category. Relies on impactasaurus/server#3 being complete.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.