From cc2c57e2616ed5198d71f1cf7b942d96f48c38e7 Mon Sep 17 00:00:00 2001
From: Stefanos Hadjipetrou <stefanos@zimmerman.team>
Date: Mon, 19 Aug 2024 14:32:22 +0300
Subject: [PATCH] chore: incremental

---
 src/app/components/breadcrumbs/data.ts        |  8 ---
 src/app/components/breadcrumbs/index.tsx      | 58 -------------------
 .../datasets/access-to-funding/index.tsx      |  2 -
 .../pages/datasets/annual-results/index.tsx   |  1 -
 .../common/page/DatasetPage.stories.tsx       |  1 -
 src/app/pages/datasets/common/page/data.tsx   |  2 -
 .../datasets/grant-implementation/index.tsx   | 19 +++---
 .../datasets/resource-mobilization/index.tsx  |  1 -
 8 files changed, 9 insertions(+), 83 deletions(-)
 delete mode 100644 src/app/components/breadcrumbs/data.ts
 delete mode 100644 src/app/components/breadcrumbs/index.tsx

diff --git a/src/app/components/breadcrumbs/data.ts b/src/app/components/breadcrumbs/data.ts
deleted file mode 100644
index d524d80cd..000000000
--- a/src/app/components/breadcrumbs/data.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export interface BreadcrumbItem {
-  label: string;
-  link?: string;
-}
-
-export interface BreadcrumbsProps {
-  items: BreadcrumbItem[];
-}
diff --git a/src/app/components/breadcrumbs/index.tsx b/src/app/components/breadcrumbs/index.tsx
deleted file mode 100644
index b1042506b..000000000
--- a/src/app/components/breadcrumbs/index.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from "react";
-import Box from "@mui/material/Box";
-import Typography from "@mui/material/Typography";
-import IconButton from "@mui/material/IconButton";
-import { Link, useNavigate } from "react-router-dom";
-import ArrowBack from "@mui/icons-material/ArrowBack";
-import { BreadcrumbsProps } from "app/components/breadcrumbs/data";
-
-export const Breadcrumbs: React.FC<BreadcrumbsProps> = (
-  props: BreadcrumbsProps
-) => {
-  const navigate = useNavigate();
-
-  const onBackButtonClick = () => {
-    navigate(-1);
-  };
-
-  return (
-    <Box
-      gap="8px"
-      width="100%"
-      display="flex"
-      flexDirection="row"
-      alignItems="center"
-      sx={{
-        "> p": {
-          padding: "5px",
-        },
-      }}
-    >
-      <IconButton sx={{ marginLeft: "-8px" }} onClick={onBackButtonClick}>
-        <ArrowBack fontSize="small" />
-      </IconButton>
-      {props.items.map((item, index) => {
-        const lastItem = index === props.items.length - 1;
-        if (item.link && !lastItem) {
-          return (
-            <Link key={item.label} to={item.link}>
-              <Typography variant="body2">{item.label}</Typography>
-            </Link>
-          );
-        }
-        return (
-          <React.Fragment key={item.label}>
-            <Typography
-              variant="body2"
-              key={item.label}
-              fontWeight={lastItem ? "700" : "400"}
-            >
-              {item.label}
-            </Typography>
-            {!lastItem && "/"}
-          </React.Fragment>
-        );
-      })}
-    </Box>
-  );
-};
diff --git a/src/app/pages/datasets/access-to-funding/index.tsx b/src/app/pages/datasets/access-to-funding/index.tsx
index 2f584fb2e..e885bfb66 100644
--- a/src/app/pages/datasets/access-to-funding/index.tsx
+++ b/src/app/pages/datasets/access-to-funding/index.tsx
@@ -680,7 +680,6 @@ export const AccessToFundingPage: React.FC = () => {
       const blockChartType = location.hash.slice(1).split("|")[1];
       if (blockId && blockChartType && blockId === "allocation") {
         setDropdownSelected(decodeURIComponent(blockChartType));
-        break;
       }
     }
   }, [location.hash]);
@@ -692,7 +691,6 @@ export const AccessToFundingPage: React.FC = () => {
       filterGroups={filterGroups}
       appliedFilters={pageAppliedFilters}
       handleResetFilters={handleResetFilters}
-      breadcrumbs={[{ label: "Datasets" }, { label: "Access to Funding" }]}
     >
       <Box width="100%" marginTop="50px">
         <Box>
diff --git a/src/app/pages/datasets/annual-results/index.tsx b/src/app/pages/datasets/annual-results/index.tsx
index e46a6f40d..c63d0d953 100644
--- a/src/app/pages/datasets/annual-results/index.tsx
+++ b/src/app/pages/datasets/annual-results/index.tsx
@@ -380,7 +380,6 @@ export const AnnualResultsPage: React.FC = () => {
       handleResetFilters={handleResetFilters}
       toolbarRightContent={toolbarRightContent}
       subtitle="Indicator results reported as part of annual Results Report."
-      breadcrumbs={[{ label: "Datasets" }, { label: "Annual Results" }]}
     >
       <Box width="100%" marginTop="50px">
         <HomeResultsStats stats={dataStats} loading={loadingResults} />
diff --git a/src/app/pages/datasets/common/page/DatasetPage.stories.tsx b/src/app/pages/datasets/common/page/DatasetPage.stories.tsx
index 77259ca8f..c4a8e3cfe 100644
--- a/src/app/pages/datasets/common/page/DatasetPage.stories.tsx
+++ b/src/app/pages/datasets/common/page/DatasetPage.stories.tsx
@@ -27,6 +27,5 @@ export const Primary: StoryType = {
     children: <div>Content</div>,
     subtitle:
       "Government, private sector, non-government and other donor pledges and contributions.",
-    breadcrumbs: [{ label: "Datasets" }, { label: "Resource Mobilization" }],
   },
 };
diff --git a/src/app/pages/datasets/common/page/data.tsx b/src/app/pages/datasets/common/page/data.tsx
index 3021ea61b..6c0af0b68 100644
--- a/src/app/pages/datasets/common/page/data.tsx
+++ b/src/app/pages/datasets/common/page/data.tsx
@@ -1,6 +1,5 @@
 import React from "react";
 import Typography from "@mui/material/Typography";
-import { BreadcrumbItem } from "app/components/breadcrumbs/data";
 import { FilterGroupModel } from "app/components/filters/list/data";
 
 export interface DatasetPageProps {
@@ -8,7 +7,6 @@ export interface DatasetPageProps {
   subtitle: string;
   appliedFilters: string[];
   children: React.ReactNode;
-  breadcrumbs: BreadcrumbItem[];
   handleResetFilters: () => void;
   filterGroups: FilterGroupModel[];
   toolbarRightContent?: React.ReactNode;
diff --git a/src/app/pages/datasets/grant-implementation/index.tsx b/src/app/pages/datasets/grant-implementation/index.tsx
index 50bb50162..2c00e782a 100644
--- a/src/app/pages/datasets/grant-implementation/index.tsx
+++ b/src/app/pages/datasets/grant-implementation/index.tsx
@@ -1491,8 +1491,8 @@ export const GrantImplementationPage: React.FC = () => {
         location.search.includes("principalRecipientSubTypes=")) ||
       chart3AppliedFiltersData.principalRecipientSubTypes.length > 0
     ) {
-      filterString += `${
-        filterString.length > 0 ? "&" : ""
+      value += `${
+        value.length > 0 ? "&" : ""
       }principalRecipientSubTypes=${encodeURIComponent(
         uniq([
           ...appliedFiltersData.principalRecipientSubTypes,
@@ -1533,8 +1533,8 @@ export const GrantImplementationPage: React.FC = () => {
       // const yearTo = financialMetricsCycleDropdownSelected
       //   .replace(/ /g, "")
       //   .split("-")[1];
-      // filterString += `${
-      //   filterString.length > 0 ? "&" : ""
+      // value += `${
+      //   value.length > 0 ? "&" : ""
       // }years=${encodeURIComponent(year)}&yearsTo=${encodeURIComponent(yearTo)}`;
       value += `${
         value.length > 0 ? "&" : ""
@@ -1593,8 +1593,8 @@ export const GrantImplementationPage: React.FC = () => {
         location.search.includes("principalRecipientSubTypes=")) ||
       chart4AppliedFiltersData.principalRecipientSubTypes.length > 0
     ) {
-      filterString += `${
-        filterString.length > 0 ? "&" : ""
+      value += `${
+        value.length > 0 ? "&" : ""
       }principalRecipientSubTypes=${encodeURIComponent(
         uniq([
           ...appliedFiltersData.principalRecipientSubTypes,
@@ -1720,16 +1720,16 @@ export const GrantImplementationPage: React.FC = () => {
   }, [chart2FilterString, componentsGrouping, geographyGrouping]);
 
   React.useEffect(() => {
-    let filterString = chart2FilterString;
+    let value = chart2FilterString;
     if (budgetTableDataType === dropdownItemsBudgetsTableDataTypes[1].value) {
-      filterString += `${filterString.length > 0 ? "&" : ""}var2=${
+      value += `${value.length > 0 ? "&" : ""}var2=${
         componentsGrouping === componentsGroupingOptions[0].value
           ? "activityAreaGroup"
           : "activityArea"
       }`;
     }
     fetchBudgetTable({
-      filterString,
+      filterString: value,
       routeParams: {
         componentField:
           componentsGrouping === componentsGroupingOptions[0].value
@@ -1912,7 +1912,6 @@ export const GrantImplementationPage: React.FC = () => {
       appliedFilters={pageAppliedFilters}
       handleResetFilters={handleResetFilters}
       subtitle="See the disbursements, budgets and expenditures datasets and relating insights."
-      breadcrumbs={[{ label: "Datasets" }, { label: "Financial Insights" }]}
       toolbarRightContent={toolbarRightContent}
     >
       <Box width="100%" marginTop="50px">
diff --git a/src/app/pages/datasets/resource-mobilization/index.tsx b/src/app/pages/datasets/resource-mobilization/index.tsx
index fb891ea8a..42c9067c0 100644
--- a/src/app/pages/datasets/resource-mobilization/index.tsx
+++ b/src/app/pages/datasets/resource-mobilization/index.tsx
@@ -354,7 +354,6 @@ export const ResourceMobilizationPage: React.FC = () => {
       filterGroups={filterGroups}
       appliedFilters={pageAppliedFilters}
       handleResetFilters={handleResetFilters}
-      breadcrumbs={[{ label: "Datasets" }, { label: "Resource Mobilization" }]}
       subtitle="Government, private sector, non-government and other donor pledges and contributions"
     >
       <Box width="100%" marginTop="50px">