feat: select and deselect all button for infinite mode

.github/labeler.yml

@@ -9,7 +9,7 @@ logo game:
   - src/components/LogoForm.jsx,
   - src/pages/logos/LogoAnnotation.jsx
   - src/pages/logos/LogoDeepSearch.jsx
-  
+
 insights:
   - src/pages/insights/**/*
 

README.md

@@ -36,6 +36,7 @@ The main goal is: Every Open Food Facts user can annotate products in a few minu
 - [Node](https://nodejs.org)
 
 ## Setup:
+
 - Install Node: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
 - Install yarn `npm install --global yarn`
 - Install libraries `yarn install`
@@ -69,26 +70,26 @@ Generate the JSON file `src/assets/countries.json` which contains all the countr
 
 Fetch categories and labels taxonomy from OpenFoodFacts static files, and generate JSON files used by the `Autocomplete` fields.
 
-
 ## How to define a dashboard
 
 Go to `src/pages/logosValidator/dashboardDefinition.ts`. You have two objects to edit:
+
 - `LOGOS` which contains the logos available in dashboards. Add the logos you need by providing at least `tag`, `label`, and `logo` properties.
 - `DASHBOARD` which for a dashboard associates an array of logos.
 
-
 ## How you can help
 
 For developers, you can have a look at [good first issues](/~https://github.com/openfoodfacts/hunger-games/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3A%22good+first+issue%22) or ask on [slack](https://slack.openfoodfacts.org/) in hunger-games channel.
 
 You can also help by improving [translation in your language](https://translate.openfoodfacts.org/translate/openfoodfacts/1942/en-fr?filter=basic&value=0), Or the [wiki page](https://wiki.openfoodfacts.org/Hunger_Games) of the project
 
 ## Weekly meetings (joint with the ML/Robotoff meeting)
+
 - We e-meet Mondays at 17:00 Paris Time (16:00 London Time, 21:30 IST, 08:00 AM PT)
 - ![Google Meet](https://img.shields.io/badge/Google%20Meet-00897B?logo=google-meet&logoColor=white) Video call link: https://meet.google.com/qvv-grzm-gzb
 - Join by phone: https://tel.meet/qvv-grzm-gzb?pin=9965177492770
 - Add the Event to your Calendar by [adding the Open Food Facts community calendar to your calendar](https://wiki.openfoodfacts.org/Events)
-- [Weekly Agenda](https://drive.google.com/open?id=1RUfmWHjtFVaBcvQ17YfXu6FW6oRFWg-2lncljG0giKI): 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. 
+- [Weekly Agenda](https://drive.google.com/open?id=1RUfmWHjtFVaBcvQ17YfXu6FW6oRFWg-2lncljG0giKI): 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.
 - 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.

src/pages/logos/LogoDeepSearch.jsx

@@ -203,6 +203,27 @@ export default function LogoSearch() {
     setLogosToAnnotate((prev) => prev.filter((logo) => !logo.selected));
   };
 
+  const selectAllOnPage = () => {
+    setLogosToAnnotate((prev) =>
+      prev.map((logo, index) => ({
+        ...logo,
+        selected:
+          index < page * pageSize && index >= (page - 1) * pageSize
+            ? true
+            : logo.selected,
+      }))
+    );
+  };
+
+  const deselectAll = () => {
+    setLogosToAnnotate((prev) =>
+      prev.map((logo) => ({
+        ...logo,
+        selected: false,
+      }))
+    );
+  };
+
   return (
     <Box sx={{ padding: 2 }}>
       <Typography variant="h4" sx={{ mb: 2 }}>
@@ -229,9 +250,26 @@ export default function LogoSearch() {
 
       <Divider sx={{ my: 3 }} />
 
-      <Typography variant="h5" sx={{ mt: 5, mb: 1 }}>
-        Remaining to annotate
-      </Typography>
+      <Box sx={{ display: "flex", flexDirection: "row", gap: 1 }}>
+        <Typography variant="h5" sx={{ mt: 5, mb: 1 }}>
+          Remaining to annotate
+        </Typography>
+        <Button
+          onClick={selectAllOnPage}
+          variant="contained"
+          sx={{ ml: "auto", maxHeight: 40, mt: "40px", mb: "8px" }} // to align with "Remaining to annotate"
+        >
+          Select All
+        </Button>
+        <Button
+          onClick={deselectAll}
+          variant="contained"
+          sx={{ maxHeight: 40, mt: "40px", mb: "8px" }}
+        >
+          Deselect All
+        </Button>
+      </Box>
+
       <LogoGrid
         logos={logosToAnnotate.slice((page - 1) * pageSize, page * pageSize)}
         toggleLogoSelection={toggleSelection}

src/pages/logosValidator/dashboardDefinition.ts

@@ -100,7 +100,7 @@ export const LOGOS = {
   "en:dolphin-safe": {
     tag: "en:dolphin-safe",
     label: "Dolphin Safe",
-// logo does not exist yet
+    // logo does not exist yet
     logo: "https://static.openfoodfacts.org/images/lang/en/labels/dolphin-safe.90x90.svg",
   },
   "en:canada-organic": {
@@ -116,7 +116,7 @@ export const LOGOS = {
   "en:made-in-france": {
     tag: "en:made-in-france",
     label: "Fabriqué en France",
-// logo does not exist yet
+    // logo does not exist yet
     logo: "https://static.openfoodfacts.org/images/lang/en/labels/made-in-france.90x90.svg",
   },
   "en:produced-in-brittany": {
@@ -182,7 +182,7 @@ export const LOGOS = {
   "en:max-havelaar-france": {
     tag: "en:max-havelaar-france",
     label: "Max Havelaar France",
-// does not exist
+    // does not exist
     logo: "https://static.openfoodfacts.org/images/lang/fr/labels/max-havelaar-france.90x90.svg",
   },
   "fr:sud-de-france": {
@@ -838,11 +838,11 @@ export const DASHBOARD: DashBoardTheme[] = [
   //    title: "Kosher",
   //    logos: [
   //      "en:cor-kosher",
-   //     "en:kosher-check",
+  //     "en:kosher-check",
   //      "en:tablet-k-kosher",
-   //     "en:mk-kosher",
-   //   ],
-   // },
+  //     "en:mk-kosher",
+  //   ],
+  // },
   // To-Do add Origins dashboard
   {
     tag: "origin-france",