nutripatrol-frontend

The front-end (React) of our Nutri-Patrol moderation tool. It is deployed @ https://nutripatrol.openfoodfacts.org/

Nutripatrol API

This repository works with the backend of Nutri-Patrol: Nutri-Patrol API Please check this one before running the frontend.

Current sources of reports for Nutri-Patrol

• Automatic population by Robotoff, based on Cloud Vision flagging (NSFW flags)
• Manual user reports from the Classic web app, as well as our next generation frontend, Open Food Facts Explorer
• The mobile app is currently not wired to send reports. An open PR awaits your help (Flutter)

🎨 Design

• Mockups & Benchmarks for Nutri-Patrol
• Are you a designer ? Join the design team

Features

• Image reporting
• List of reported images

Roadmap

• Improving usability of the tickets dashboard (more tickets per page, filtering tickets based on keyword, seeing the username of the reporter)
• Insert main roadmap items here

Weekly meetings (Frontend meeting)

• We e-meet Wednesdays · 11:00 – 11:25am - Time zone: Europe/Paris
• Video call link: https://meet.google.com/uep-fhvf-gto
• Join by phone: https://tel.meet/uep-fhvf-gto?pin=8160344286211
• Add the Event to your Calendar by adding the Open Food Facts community calendar to your calendar
• Weekly Agenda: please add the Agenda items as early as you can. Make sure to check the Agenda items in advance of the meeting, so that we have the most informed discussions possible, leading to argumented decisions.
• The meeting will handle Agenda items first, and if time permits, collaborative bug triage.
• We strive to timebox the core of the meeting (decision making) to 30 minutes, with an optional free discussion/live debugging afterwards.
• We take comprehensive notes in the Weekly Agenda of agenda item discussions and of decisions taken.

Get started 🎯

1. You can clone this repository :

git clone https://github.com/openfoodfacts/nutripatrol-frontend.git

2. Open the project folder :

cd nutripatrol-frontend

3. Install dependencies :

npm install

4. Start vite :

npm run dev

5. Congratulations 🎉 ! You can open frontend

Useful routes

Report forms

1. To report an image :

http://localhost:5173/flag/image?barcode=[BARCODE]&source=[SOURCE]&flavor=[FLACOR]&image_id=[IMAGE_ID]

2. To report a product :

http://localhost:5173/flag/product?barcode=[BARCODE]&source=[SOURCE]&flavor=[FLAVOR]

Note

Warning, source have to be 'web', 'mobile', 'robotoff' flavor have to be 'off', 'obf', 'opff', 'opf', 'off_pro'

Contributors