chore: force eslint check through husky pre-commit

globalfund · Dec 19, 2024 · 865bd49 · 865bd49
1 parent 7c05d6b
commit 865bd49
Show file tree

Hide file tree

Showing 139 changed files with 947 additions and 931 deletions.
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -0,0 +1,5 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+yarn prettier src/app --check
+npx eslint src --ext .js,.jsx,.tsx,ts --max-warnings 0
diff --git a/package.json b/package.json
@@ -62,6 +62,7 @@
     "babel-plugin-styled-components": "^2.1.4",
     "cypress": "^13.12.0",
     "eslint-plugin-storybook": "^0.8.0",
+    "husky": "^8.0.0",
     "prop-types": "^15.8.1",
     "storybook": "^8.0.8",
     "storybook-addon-remix-react-router": "^3.0.0",
@@ -79,7 +80,8 @@
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "e2e-ui": "npx cypress open",
-    "e2e": "npx cypress run"
+    "e2e": "npx cypress run",
+    "prepare": "husky install"
   },
   "eslintConfig": {
     "extends": [

diff --git a/src/app/components/chart-block/components/button-toolbar/data.tsx b/src/app/components/chart-block/components/button-toolbar/data.tsx
@@ -46,10 +46,10 @@ export const NOTES_FINANCIALS =
   "The geographical designations employed by the Global Fund do not represent or imply any opinion or judgment on the legal status of any country, territory, city or area on its governmental or state authorities, or on the delimitation of its frontiers or boundaries.<br/><br/>Financial amounts in currencies other than USD from 2014 onward were converted to USD using fixed Replenishment exchange rate, also referred to as the Reference Rate. Financial amounts before 2014 were converted using spot exchange rates.<br /><br />The RSSH category correspond to financial amounts for stand-alone RSSH grants and is not reflective of the full RSSH investment.";
 
 export const DownloadPanel: React.FC<ChartBlockButtonToolbarProps> = (
-  props: ChartBlockButtonToolbarProps
+  props: ChartBlockButtonToolbarProps,
 ) => {
   const [feedbackMessage, setFeedbackMessage] = React.useState<string | null>(
-    null
+    null,
   );
 
   const handleButtonClick = (type: "csv" | "pdf" | "png") => () => {
@@ -93,10 +93,10 @@ export const DownloadPanel: React.FC<ChartBlockButtonToolbarProps> = (
 };
 
 export const SharePanel: React.FC<ChartBlockButtonToolbarProps> = (
-  props: ChartBlockButtonToolbarProps
+  props: ChartBlockButtonToolbarProps,
 ) => {
   const [feedbackMessage, setFeedbackMessage] = React.useState<string | null>(
-    null
+    null,
   );
 
   const handleButtonClick = (type: "code" | "link") => () => {
@@ -109,7 +109,7 @@ export const SharePanel: React.FC<ChartBlockButtonToolbarProps> = (
       chartType = `|${chartType}`;
     }
     navigator.clipboard.writeText(
-      type === "code" ? "" : `${url}#${props.hashId}${chartType}`
+      type === "code" ? "" : `${url}#${props.hashId}${chartType}`,
     );
     setFeedbackMessage(`${type} copied!`);
   };

diff --git a/src/app/components/chart-block/components/button-toolbar/index.tsx b/src/app/components/chart-block/components/button-toolbar/index.tsx
@@ -17,7 +17,7 @@ import {
 } from "app/components/chart-block/components/button-toolbar/data";
 
 export const ChartBlockButtonToolbar: React.FC<ChartBlockButtonToolbarProps> = (
-  props: ChartBlockButtonToolbarProps
+  props: ChartBlockButtonToolbarProps,
 ) => {
   const [active, setActive] = React.useState<
     "download" | "share" | "favorite" | "info" | null

diff --git a/src/app/components/chart-block/components/cycles/index.tsx b/src/app/components/chart-block/components/cycles/index.tsx
@@ -6,7 +6,7 @@ import Button from "@mui/material/Button";
 import { ChartBlockCyclesProps } from "app/components/chart-block/components/cycles/data";
 
 export const ChartBlockCycles: React.FC<ChartBlockCyclesProps> = (
-  props: ChartBlockCyclesProps
+  props: ChartBlockCyclesProps,
 ) => {
   const handleCycleClick = (cycle: { name: string; value: string }) => () => {
     props.handleCycleChange(cycle);

diff --git a/src/app/components/chart-block/index.tsx b/src/app/components/chart-block/index.tsx
@@ -10,7 +10,7 @@ import { ChartBlockCycles } from "app/components/chart-block/components/cycles";
 import { ChartBlockButtonToolbar } from "app/components/chart-block/components/button-toolbar";
 
 export const ChartBlock: React.FC<ChartBlockProps> = (
-  props: ChartBlockProps
+  props: ChartBlockProps,
 ) => {
   const id = React.useMemo(() => uniqueId("chart-block-"), []);
 

diff --git a/src/app/components/charts/bar-series/index.tsx b/src/app/components/charts/bar-series/index.tsx
@@ -87,7 +87,7 @@ const Tooltip = (props: any) => {
 };
 
 export const BarSeriesChart: React.FC<BarSeriesChartProps> = (
-  props: BarSeriesChartProps
+  props: BarSeriesChartProps,
 ) => {
   const isTouch = useMediaQuery("(hover: none)");
   const mobile = useMediaQuery("(max-width: 767px)");

diff --git a/src/app/components/charts/bar/index.tsx b/src/app/components/charts/bar/index.tsx
@@ -119,11 +119,11 @@ export const BarChart: React.FC<BarChartProps> = (props: BarChartProps) => {
   const seriesData = React.useMemo(() => {
     const values = filter(
       props.data.map((item) => item.value),
-      (v: number | undefined) => v
+      (v: number | undefined) => v,
     ) as number[];
     const values1 = filter(
       props.data.map((item) => item.value1),
-      (v: number | undefined) => v
+      (v: number | undefined) => v,
     ) as number[];
     if (values1.length === 0) {
       return [values];

diff --git a/src/app/components/charts/donut/index.tsx b/src/app/components/charts/donut/index.tsx
@@ -9,7 +9,7 @@ import { useChartResizeObserver } from "app/hooks/useChartResizeObserver";
 echarts.use([EChartsPie, SVGRenderer]);
 
 export const DonutChart: React.FC<DonutChartProps> = (
-  props: DonutChartProps
+  props: DonutChartProps,
 ) => {
   const containerRef = React.useRef<HTMLDivElement>(null);
 

diff --git a/src/app/components/charts/expandable-horizontal-bar/data.tsx b/src/app/components/charts/expandable-horizontal-bar/data.tsx
@@ -1046,7 +1046,7 @@ export const STORY_DATA_VARIANT_2: ExpandableHorizontalBarChartDataItem[] = [
 
 export function findDeep(
   data: ExpandableHorizontalBarChartDataItem[],
-  name: string
+  name: string,
 ): ExpandableHorizontalBarChartDataItem | undefined {
   for (const item of data) {
     if (item.name === name) {

diff --git a/src/app/components/charts/expandable-horizontal-bar/index.tsx b/src/app/components/charts/expandable-horizontal-bar/index.tsx
@@ -120,11 +120,11 @@ export const ExpandableHorizontalBar: React.FC<
   const seriesData = React.useMemo(() => {
     const values = filter(
       data.map((item) => item.value),
-      (v: number | undefined) => v
+      (v: number | undefined) => v,
     ) as number[];
     const values1 = filter(
       data.map((item) => item.value1),
-      (v: number | undefined) => v
+      (v: number | undefined) => v,
     ) as number[];
     if (values1.length === 0) {
       return [values];

diff --git a/src/app/components/charts/financial-metric/index.tsx b/src/app/components/charts/financial-metric/index.tsx
@@ -12,7 +12,7 @@ import {
 } from "app/components/charts/financial-metric/data";
 
 export const FinancialMetric: React.FC<FinancialMetricProps> = (
-  props: FinancialMetricProps
+  props: FinancialMetricProps,
 ) => {
   return (
     <Box
@@ -74,7 +74,7 @@ export const FinancialMetric: React.FC<FinancialMetricProps> = (
 };
 
 const ExpandableItem: React.FC<FinancialMetricExpandableItemProps> = (
-  props: FinancialMetricExpandableItemProps
+  props: FinancialMetricExpandableItemProps,
 ) => {
   const [expanded, setExpanded] = React.useState(false);
 

diff --git a/src/app/components/charts/heatmap/index.tsx b/src/app/components/charts/heatmap/index.tsx
@@ -55,13 +55,13 @@ export function Heatmap(props: HeatmapProps) {
     if (props.expandAll) {
       setExpandedRows(
         filter(props.data, (item: HeatmapDataItem) => !item.parentRow).map(
-          (item: HeatmapDataItem) => item.row
-        )
+          (item: HeatmapDataItem) => item.row,
+        ),
       );
       setExpandedColumns(
         filter(props.data, (item: HeatmapDataItem) => !item.parentColumn).map(
-          (item: HeatmapDataItem) => item.column
-        )
+          (item: HeatmapDataItem) => item.column,
+        ),
       );
     } else {
       setExpandedRows([]);
@@ -87,7 +87,7 @@ export function Heatmap(props: HeatmapProps) {
                       expanded: false,
                       level: 2,
                     })),
-                  "name"
+                  "name",
                 );
                 return {
                   name: subName,
@@ -96,7 +96,7 @@ export function Heatmap(props: HeatmapProps) {
                   level: 1,
                 };
               }),
-            "name"
+            "name",
           );
           return {
             name,
@@ -105,14 +105,14 @@ export function Heatmap(props: HeatmapProps) {
             level: 0,
           };
         }),
-        "name"
+        "name",
       ).sort((a, b) => {
         if (a.name === "Income Level") return 1;
         if (b.name === "Income Level") return -1;
         if (a.name > b.name) return 1;
         if (b.name > a.name) return -1;
         return 0;
-      })
+      }),
     );
   }, [rootData, expandedRows]);
 
@@ -134,7 +134,7 @@ export function Heatmap(props: HeatmapProps) {
                       expanded: false,
                       level: 2,
                     })),
-                  "name"
+                  "name",
                 );
                 return {
                   level: 1,
@@ -143,7 +143,7 @@ export function Heatmap(props: HeatmapProps) {
                   children: subChildren.length > 0 ? subChildren : undefined,
                 };
               }),
-            "name"
+            "name",
           );
           return {
             name,
@@ -152,8 +152,8 @@ export function Heatmap(props: HeatmapProps) {
             children: children.length > 0 ? children : undefined,
           };
         }),
-        "name"
-      )
+        "name",
+      ),
     );
   }, [rootData, expandedColumns]);
 
@@ -166,13 +166,13 @@ export function Heatmap(props: HeatmapProps) {
         sortedVisibleRows = orderBy(
           visibleRows,
           (item) => parseInt(item.name, 10),
-          "desc"
+          "desc",
         );
       } else if (props.rowCategory === "grantCycle") {
         sortedVisibleRows = orderBy(
           visibleRows,
           (item) => parseInt(item.name.split(",")[0], 10),
-          "desc"
+          "desc",
         );
       }
     }
@@ -205,13 +205,13 @@ export function Heatmap(props: HeatmapProps) {
         sortedVisibleColumns = orderBy(
           visibleColumns,
           (item) => parseInt(item.name, 10),
-          "desc"
+          "desc",
         );
       } else if (props.columnCategory === "grantCycle") {
         sortedVisibleColumns = orderBy(
           visibleColumns,
           (item) => parseInt(item.name.split(",")[0], 10),
-          "desc"
+          "desc",
         );
       }
     }
@@ -405,13 +405,13 @@ export function Heatmap(props: HeatmapProps) {
                 >
                   {flatVisibleColumns.map((column) => {
                     const data = props.data.find(
-                      (d) => d.row === row.name && d.column === column.name
+                      (d) => d.row === row.name && d.column === column.name,
                     );
                     const color = props.getItemColor(data);
                     let value: number | string = get(
                       data,
                       props.contentProp,
-                      0
+                      0,
                     );
                     if (isNumber(value)) {
                       if ((value as number) > 0) {
@@ -424,7 +424,7 @@ export function Heatmap(props: HeatmapProps) {
                           value = value + "%";
                         } else {
                           value = formatFinancialValue(
-                            parseInt(value.toString(), 10)
+                            parseInt(value.toString(), 10),
                           );
                         }
                       }

diff --git a/src/app/components/charts/line/index.tsx b/src/app/components/charts/line/index.tsx
@@ -205,7 +205,7 @@ export const LineChart: React.FC<LineChartProps> = (props: LineChartProps) => {
                 cumulative += value;
               });
             return ReactDOMServer.renderToString(
-              <Tooltip {...params} cumulative={cumulative} />
+              <Tooltip {...params} cumulative={cumulative} />,
             );
           },
         },

diff --git a/src/app/components/charts/polyline-tree/index.tsx b/src/app/components/charts/polyline-tree/index.tsx
@@ -12,7 +12,7 @@ import { PolylineTreeProps } from "app/components/charts/polyline-tree/data";
 echarts.use([EchartsTree, SVGRenderer]);
 
 export const PolylineTree: React.FC<PolylineTreeProps> = (
-  props: PolylineTreeProps
+  props: PolylineTreeProps,
 ) => {
   const mobile = useMediaQuery("(max-width: 767px)");
   const containerRef = React.useRef<HTMLDivElement>(null);
@@ -80,7 +80,7 @@ export const PolylineTree: React.FC<PolylineTreeProps> = (
                 return [
                   `{value|${formatLocale(params.value as number).replace(
                     "US$",
-                    ""
+                    "",
                   )}}`,
                   `{smallName|${params.name}}`,
                 ].join(" ");

diff --git a/src/app/components/charts/race-bar/index.tsx b/src/app/components/charts/race-bar/index.tsx
@@ -8,7 +8,7 @@ import {
 } from "app/utils/getFinancialValueWithMetricPrefix";
 
 export const RaceBarChart: React.FC<RaceBarChartProps> = (
-  props: RaceBarChartProps
+  props: RaceBarChartProps,
 ) => {
   return (
     <Box
@@ -49,7 +49,7 @@ export const RaceBarChart: React.FC<RaceBarChartProps> = (
                 ? `US$${getFinancialValueWithMetricPrefix(
                     item.value,
                     range.index,
-                    2
+                    2,
                   )} ${range.abbr}`
                 : item.value}{" "}
               - {item.percentage.toFixed(0)}%

diff --git a/src/app/components/charts/radar/index.tsx b/src/app/components/charts/radar/index.tsx
@@ -15,7 +15,7 @@ import { RadarSeriesOption, RadarChart as EChartsRadar } from "echarts/charts";
 echarts.use([EChartsRadar, SVGRenderer, LegendComponent]);
 
 export const RadarChart: React.FC<RadarChartProps> = (
-  props: RadarChartProps
+  props: RadarChartProps,
 ) => {
   const containerRef = React.useRef<HTMLDivElement>(null);
 
@@ -53,17 +53,17 @@ export const RadarChart: React.FC<RadarChartProps> = (
             formatter: (value) => {
               const indicatorIndex = findIndex(
                 props.data.components,
-                (c) => c === value
+                (c) => c === value,
               );
               const budgetValue = get(
                 props.data.budgetValues,
                 `[${indicatorIndex}]`,
-                0
+                0,
               );
               const disbursementValue = get(
                 props.data.disbursementValues,
                 `[${indicatorIndex}]`,
-                0
+                0,
               );
               const percentage =
                 budgetValue > 0 ? (disbursementValue / budgetValue) * 100 : 0;

diff --git a/src/app/components/charts/radial/data.ts b/src/app/components/charts/radial/data.ts
@@ -29,7 +29,7 @@ export interface RadialChartProps {
 
 export function itemLabelFormatter(
   params: any,
-  type: "name" | "name-percent" | "name-value-percent"
+  type: "name" | "name-percent" | "name-value-percent",
 ) {
   switch (type) {
     case "name":
@@ -41,7 +41,7 @@ export function itemLabelFormatter(
       return `{boldName| ${params.name}}\n$${getFinancialValueWithMetricPrefix(
         params.value,
         range.index,
-        2
+        2,
       )}${range.abbr} - ${params.percent}%`;
     default:
       return params.name;