Merge pull request #164 from Azzoo/main

Bucket search changes
WildAid · Sep 1, 2020 · ae6e760 · ae6e760
2 parents c86b9ac + be499bd
commit ae6e760
Show file tree

Hide file tree

Showing 31 changed files with 960 additions and 364 deletions.
diff --git a/package.json b/package.json
@@ -24,6 +24,7 @@
     "react-i18next": "^11.7.0",
     "react-router-config": "^5.1.1",
     "react-router-dom": "^5.1.2",
+    "react-router-query-params": "^1.0.4",
     "react-scripts": "3.4.1",
     "typescript": "^3.7.0"
   },

diff --git a/src/assets/filled-arrow.svg b/src/assets/filled-arrow.svg
diff --git a/src/components/boardings/boarding-view/vessel/vessel.section.js b/src/components/boardings/boarding-view/vessel/vessel.section.js
@@ -4,6 +4,10 @@ import { withTranslation } from "react-i18next";
 
 import TextViewer from "../../../partials/text-viewer/text-viewer";
 
+import { goToPageWithFilter } from "./../../../../helpers/get-data";
+
+import { VIEW_VESSEL_PAGE } from "../../../../root/root.constants.js";
+
 class VesselSection extends Component {
   setFieldValue = (name, value) => {
     //TODO
@@ -23,10 +27,19 @@ class VesselSection extends Component {
         <section className="flex-row box-shadow padding white-bg margin-top">
           <div className="flex-column section-block">
             <h3>{t("FILTER.MAIN.VESSEL_INFO.NAME")}</h3>
-            <TextViewer
-              mainText={vessel.name}
-              subText={t("BOARDING_PAGE.VIEW_BOARDING.STATUS")}
-            />
+            <div className="pointer"
+              onClick={() =>
+                goToPageWithFilter(
+                  VIEW_VESSEL_PAGE,
+                  {"vessel.permitNumber": vessel.permitNumber, "vessel.name": vessel.name}
+                )
+              }
+            >
+              <TextViewer
+                mainText={vessel.name}
+                subText={t("BOARDING_PAGE.VIEW_BOARDING.STATUS")}
+              />
+            </div>
             <TextViewer
               mainText={vessel.permitNumber}
               subText={t("TABLE.PERMIT_NUMBER")}

diff --git a/src/components/boardings/boardings.component.js b/src/components/boardings/boardings.component.js
@@ -72,12 +72,14 @@ const filterConfiguration = {
       type: "date",
     },
     {
-      name: "date-from",
+      name: "dateFrom",
+      field:  "date-from",
       title: "Date from",
       type: "date",
     },
     {
-      name: "date-to",
+      name: "dateTo",
+      field:  "date-to",
       title: "Date To",
       type: "date",
     },
@@ -156,6 +158,8 @@ class Boardings extends Component {
         : "",
     highlighted: [],
     loading: true,
+    defaultFilter: null,
+    mounted : false,
     page: 1,
   };
 
@@ -194,6 +198,7 @@ class Boardings extends Component {
 
   loadData(newState) {
     newState = newState ? newState : {};
+    newState.mounted = true;
     newState.loading = true;
     this.setState(newState, () => {
       const { limit, offset, searchQuery, currentFilter } = this.state;
@@ -216,7 +221,24 @@ class Boardings extends Component {
   }
 
   componentDidMount() {
-    this.loadData();
+    let filter = null;
+    //TODO:fill this structure with a correct data
+    /*
+    const start = moment().subtract(1, 'month').startOf('day');
+    const end =  moment().endOf('day');
+
+    filter = [{
+      name: "dateFrom",
+      value: start.format("L")
+    }];
+
+    */
+    if (filter){
+      this.setState({mounted: true, defaultFilter: filter});
+      //The loadData will be called automatically from filter-panel
+    } else {
+      this.loadData();
+    }
   }
 
   render() {
@@ -228,6 +250,8 @@ class Boardings extends Component {
       isMapShown,
       highlighted,
       searchQuery,
+      defaultFilter,
+      mounted,
       page,
     } = this.state;
     const { t } = this.props;
@@ -236,7 +260,7 @@ class Boardings extends Component {
       _id: { $in: boardings.map((item) => item._id) },
     };
 
-    return (
+    return mounted ? (
       <div className="flex-column justify-center align-center padding-bottom">
         <SearchPanel
           handler={this.search}
@@ -269,6 +293,7 @@ class Boardings extends Component {
           </div>
           <FilterPanel
             options={{ searchByFilter: true }}
+            filter={defaultFilter}
             configuration={filterConfiguration}
             onFilterChanged={this.handleFilterChanged}
           />
@@ -353,7 +378,7 @@ class Boardings extends Component {
           t("WARNINGS.NO_BOARDINGS")
         )}
       </div>
-    );
+    ) : "";
   }
 }
 

diff --git a/src/components/crew/crew-view/crew-view.component.js b/src/components/crew/crew-view/crew-view.component.js
@@ -1,14 +1,15 @@
 import React, { Component, Fragment } from "react";
 import { withTranslation } from "react-i18next";
 import { NavLink } from "react-router-dom";
+import withQueryParams from 'react-router-query-params';
 
 import BoardingsOverview from "./../../partials/overview-pages/boardings-overview/boardings-overview.component";
 import ViolationsOverview from "./../../partials/overview-pages/violations-overview/violations-overview.component";
 import PhotosOverview from "./../../partials/overview-pages/photo-overview/photo-overview.component";
 import NotesOverview from "./../../partials/overview-pages/notes-overview/notes-overview.component";
 import LoadingPanel from "./../../partials/loading-panel/loading-panel.component";
 
-import CrewDataHelper from "../crew-data.helper.js";
+import BoardingDataHelper from "../../partials/boarding-data.helper.js";
 import OverviewService from "./../../../services/overview.service";
 
 import { goToPage } from "./../../../helpers/get-data";
@@ -33,62 +34,36 @@ class CrewViewPage extends Component {
     boardings: [],
     violations: [],
     crewName: "N/A",
+    captainName: "",
   };
 
   componentDidMount() {
-    const { id } = this.props.match.params;
-
-    if (!id) return;
-
-    if (id.indexOf("ln") === 0) {
-      this.setState({ loading: true }, () => {
-        const licenseNumber = id.substring(2);
-
-        overviewService
-          .getBoardingsByCrewLicense(licenseNumber)
-          .then((data) => {
-            const dataHelper = new CrewDataHelper(licenseNumber, data);
-
-            const newState = {
-              loading: false,
-              boardings: dataHelper.getBoardings(),
-              violations: dataHelper.getViolations(),
-              licenseNumbers: [licenseNumber],
-              vessels: dataHelper.getVessels(),
-              crewName: dataHelper.getCrewName(licenseNumber),
-              notes: dataHelper.getNotes(licenseNumber),
-              photos: dataHelper.getPhotos(licenseNumber),
-            };
-            this.setState(newState);
-          })
-          .catch((error) => {
-            console.error(error);
-          });
-      });
-    }
-    if (id.indexOf("in") === 0) {
-      const itemName = id.substring(2);
-
+    const filter = JSON.parse(this.props.match.params.filter);
+    const licenseNumber = filter["crew.license"];
+    this.setState({ loading: true }, () => {
       overviewService
-        .getBoardingsByCrewName(itemName)
+        .getBoardingsByFilter(filter)
         .then((data) => {
-          const dataHelper = new CrewDataHelper(itemName, data);
-
+          const dataHelper = new BoardingDataHelper(data);
           const newState = {
             loading: false,
+            filter: filter,
             boardings: dataHelper.getBoardings(),
-            violations: dataHelper.getViolations(),
+            violations: dataHelper.getViolations(licenseNumber),
+            licenseNumbers: [licenseNumber],
             vessels: dataHelper.getVessels(),
-            crewName: itemName,
-            notes: dataHelper.getNotes(itemName),
-            photos: dataHelper.getPhotos(itemName),
+            captainName: dataHelper.getCaptainName(licenseNumber),
+            crewName: dataHelper.getCrewName(licenseNumber),
+            notes: dataHelper.getNotes(licenseNumber),
+            photos: dataHelper.getPhotos(licenseNumber),
           };
+
           this.setState(newState);
         })
         .catch((error) => {
           console.error(error);
         });
-    }
+    });
   }
 
   render() {
@@ -101,9 +76,11 @@ class CrewViewPage extends Component {
       photos,
       notes,
       crewName,
+      captainName,
     } = this.state;
     const { id } = this.props.match.params;
     const { t } = this.props;
+    const { filter } = this.state;
 
     return (
       <div className="flex-column align-center padding-top crew-view-page">
@@ -227,14 +204,31 @@ class CrewViewPage extends Component {
               </div>
             </div>
             <div className="flex-row justify-between standard-view">
-              <BoardingsOverview boardings={boardings} />
+              <BoardingsOverview filter={filter} boardings={boardings} />
             </div>
             <div className="flex-row justify-between standard-view">
-              <ViolationsOverview violations={violations} violationsId={id}/>
+              <ViolationsOverview
+                violations={violations}
+                filter={filter}
+              />
             </div>
             <div className="flex-row justify-between standard-view margin-bottom">
-              <PhotosOverview photos={photos} />
-              <NotesOverview notes={notes} />
+              <PhotosOverview
+                photos={photos}
+                photosId={id}
+                filter={filter}
+                captainName={captainName}
+                crewName={crewName}
+                licenseNumber={licenseNumbers[0]}
+              />
+              <NotesOverview
+                notes={notes}
+                notesId={id}
+                filter={filter}
+                captainName={captainName}
+                crewName={crewName}
+                licenseNumber={licenseNumbers[0] || ''}
+              />
             </div>
           </Fragment>
         ) : (
@@ -245,4 +239,6 @@ class CrewViewPage extends Component {
   }
 }
 
-export default withTranslation("translation")(CrewViewPage);
+export default withQueryParams({
+  stripUnknownKeys: true
+})(withTranslation("translation")(CrewViewPage));