padawan - eslint flat structure, update sorbet gems, update git pre-c…

…ommit hook, fix issues identified by eslint

app/frontend/components/Layout.tsx

@@ -4,7 +4,7 @@ import SetupPage from "app/frontend/components/hoc/SetupPage";
 import React, { PropsWithChildren } from "react";
 
 // Load react-select
-// @ts-ignore
+// @ts-expect-error - unused Select, importing here to have styles available
 import Select from "react-select"; // eslint-disable-line
 
 interface IProps extends PropsWithChildren {

app/frontend/components/admin/BillCreatorOrganizations.tsx

@@ -1,15 +1,15 @@
 /** @format */
 
+import { TOrganizationOption } from "app/frontend/components/admin/types";
 import { useAxiosGet, useAxiosPost } from "app/frontend/hooks/useAxios";
 import { useField } from "formik";
 import { Fragment, useCallback, useMemo } from "react";
 import { FormLabel } from "react-bootstrap";
 import { MultiValue } from "react-select";
 import Creatable from "react-select/creatable";
-import { ISelectOption, sway } from "sway";
-import { REACT_SELECT_STYLES, handleError, logDev } from "../../sway_utils";
+import { sway } from "sway";
+import { REACT_SELECT_STYLES, handleError } from "../../sway_utils";
 import BillCreatorOrganization from "../bill/creator/BillCreatorOrganization";
-import { TOrganizationOption } from "app/frontend/components/admin/types";
 
 interface IProps {
     swayFieldName: string;

app/frontend/components/bill/BillArguments.tsx

@@ -5,7 +5,6 @@ import { useCallback, useMemo, useState } from "react";
 import { sway } from "sway";
 import BillArgumentsOrganization from "./BillArgumentsOrganization";
 import BillSummaryModal from "./BillSummaryModal";
-import { logDev } from "app/frontend/sway_utils";
 
 interface IProps {
     bill: sway.IBill;

app/frontend/components/bill/BillArgumentsOrganization.tsx

@@ -1,7 +1,6 @@
 import ButtonUnstyled from "app/frontend/components/ButtonUnstyled";
 import OrganizationIcon from "app/frontend/components/organizations/OrganizationIcon";
 import { Support } from "app/frontend/sway_constants";
-import { logDev } from "app/frontend/sway_utils";
 import { Image } from "react-bootstrap";
 import { sway } from "sway";
 

app/frontend/components/bill/BillComponent.tsx

@@ -44,7 +44,7 @@ const DEFAULT_ORGANIZATION_POSITION: sway.IOrganizationPosition = {
     },
 };
 
-const BillComponent: React.FC<IProps> = ({ bill, sponsor, legislatorVotes: _legislatorVotes, positions, userVote }) => {
+const BillComponent: React.FC<IProps> = ({ bill, sponsor, positions, userVote }) => {
     const user = useUser();
 
     const [locale] = useLocale();
@@ -221,7 +221,7 @@ const BillComponent: React.FC<IProps> = ({ bill, sponsor, legislatorVotes: _legi
                         <div className="col">
                             <span className="bold">Data From:&nbsp;</span>
                             <a href={bill.link} rel="noreferrer" target="_blank">
-                                {(VOTING_WEBSITES_BY_LOCALE as Record<string, any>)[localeName]}&nbsp;
+                                {(VOTING_WEBSITES_BY_LOCALE as Record<string, string>)[localeName]}&nbsp;
                                 <FiExternalLink />
                             </a>
                         </div>

app/frontend/components/bill/charts/BillMobileChartsContainer.tsx

@@ -138,7 +138,7 @@ const BillMobileChartsContainer: React.FC<IProps> = ({ bill, filter }) => {
         <div className="row my-4">
             <div ref={ref} className="col">
                 <div className="row mb-2">
-                    {/* @ts-ignore */}
+                    {/* @ts-expect-error - weird error with overlapping type interfaces */}
                     {charts.map((item: IChartChoice, index: number) => {
                         const isSelected = index === selected;
                         return (
@@ -171,7 +171,7 @@ const BillMobileChartsContainer: React.FC<IProps> = ({ bill, filter }) => {
                     })}
                 </div>
                 <div className="row">
-                    {/* @ts-ignore */}
+                    {/* @ts-expect-error - weird error with overlapping type interfaces */}
                     {charts.map((item: IChartChoice, index: number) => {
                         if (index !== selected) return null;
 

app/frontend/components/bill/charts/TotalVotesChart.tsx

@@ -1,25 +1,17 @@
 /** @format */
 
 import { isCongressLocale, titleize } from "app/frontend/sway_utils";
-import {
-    BarElement,
-    CategoryScale,
-    Chart as ChartJS,
-    Legend,
-    LinearScale,
-    Title,
-    Tooltip,
-} from "chart.js";
+import { BarElement, CategoryScale, Chart as ChartJS, Legend, LinearScale, Title, Tooltip } from "chart.js";
 
+import { useLocale } from "app/frontend/hooks/useLocales";
 import { Bar } from "react-chartjs-2";
 import { chartDimensions, SWAY_COLORS } from "../../../sway_utils";
 import { getBarChartOptions } from "../../../sway_utils/charts";
 import { IChildChartProps } from "./BillChartsContainer";
-import { useLocale } from "app/frontend/hooks/useLocales";
 
 ChartJS.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend);
 
-const TotalVotesChart: React.FC<IChildChartProps> = ({ bill, district, score }) => {
+const TotalVotesChart: React.FC<IChildChartProps> = ({ bill, score }) => {
     const [locale] = useLocale();
 
     const location = isCongressLocale(locale) ? "the United States" : titleize(locale.city);
@@ -28,14 +20,10 @@ const TotalVotesChart: React.FC<IChildChartProps> = ({ bill, district, score })
         datasets: [
             {
                 label: `All Votes Cast in ${location} on ${bill.title}`,
-                backgroundColor: isCongressLocale(locale)
-                    ? SWAY_COLORS.primaryLight
-                    : SWAY_COLORS.primary,
+                backgroundColor: isCongressLocale(locale) ? SWAY_COLORS.primaryLight : SWAY_COLORS.primary,
                 borderColor: SWAY_COLORS.primary,
                 borderWidth: 1,
-                hoverBackgroundColor: isCongressLocale(locale)
-                    ? SWAY_COLORS.primaryLight
-                    : SWAY_COLORS.primary,
+                hoverBackgroundColor: isCongressLocale(locale) ? SWAY_COLORS.primaryLight : SWAY_COLORS.primary,
                 hoverBorderColor: SWAY_COLORS.primary,
                 barPercentage: 0.8,
                 categoryPercentage: 0.8,

app/frontend/components/dialogs/Confetti.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo } from "react";
+import { useMemo } from "react";
 
 interface IProps {
     children: JSX.Element[] | JSX.Element;
@@ -51,7 +51,6 @@ const Confetti: React.FC<IProps> = ({ children }) => {
         return _confettis;
     }, []);
 
-
     return (
         <div id="confetti-container">
             {confettis}

app/frontend/components/error_handling/utils.ts

@@ -30,20 +30,20 @@ export const onRenderError = (e: unknown) => {
 
     try {
         document.cookie = "";
-    } catch (e) {
-        console.warn(e);
+    } catch (e_) {
+        console.warn(e_);
     }
 
     try {
         sessionStorage?.clear();
-    } catch (e) {
-        console.warn(e);
+    } catch (e_) {
+        console.warn(e_);
     }
 
     try {
         localStorage?.clear();
-    } catch (e) {
-        console.warn(e);
+    } catch (e_) {
+        console.warn(e_);
     }
 
     if ("caches" in window) {

app/frontend/components/forms/SwayText.tsx

@@ -76,14 +76,14 @@ const SwayTextHeader: React.FC<IProps> = ({ field, error, helperText }) => {
     );
 };
 
-const SwayTextFooter: React.FC<IProps> = ({ field, error, helperText }) => {
-    return (
-        <>
-            {field.subLabel && <span className="bold">{field.subLabel}</span>}
-            {helperText && <span className="bold">{helperText}</span>}
-            {error && <span className="danger">{error}</span>}
-        </>
-    );
-};
+// const SwayTextFooter: React.FC<IProps> = ({ field, error, helperText }) => {
+//     return (
+//         <>
+//             {field.subLabel && <span className="bold">{field.subLabel}</span>}
+//             {helperText && <span className="bold">{helperText}</span>}
+//             {error && <span className="danger">{error}</span>}
+//         </>
+//     );
+// };
 
 export default SwayText;

app/frontend/components/legislator/LegislatorPhone.tsx

@@ -1,5 +1,5 @@
 import { formatPhone } from "app/frontend/sway_utils/phone";
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useState } from "react";
 import { FiPhone } from "react-icons/fi";
 import { sway } from "sway";
 import ContactLegislatorDialog from "../dialogs/ContactLegislatorDialog";
@@ -31,12 +31,7 @@ const LegislatorPhone: React.FC<IProps> = ({ legislator, handleCopy }) => {
                 handleCopy={handleCopy}
                 Icon={getIcon}
             />
-            <ContactLegislatorDialog
-                type="phone"
-                legislator={legislator}
-                open={open}
-                handleClose={handleClose}
-            />
+            <ContactLegislatorDialog type="phone" legislator={legislator} open={open} handleClose={handleClose} />
         </>
     );
 };

app/frontend/components/social/ShareDialog.tsx

@@ -4,11 +4,9 @@ import { useCallback, useMemo } from "react";
 import { Button, Modal } from "react-bootstrap";
 import { SocialIcon } from "react-social-icons";
 import { sway } from "sway";
-import { useUser } from "../../hooks/users/useUser";
 
-import InviteDialogShareButton from "./InviteDialogShareButton";
-import InviteBody from "app/frontend/components/dialogs/invites/InviteBody";
 import ButtonUnstyled from "app/frontend/components/ButtonUnstyled";
+import InviteBody from "app/frontend/components/dialogs/invites/InviteBody";
 
 interface IProps {
     bill: sway.IBill;
@@ -20,8 +18,7 @@ interface IProps {
 
 const url = "https://app.sway.vote/bill_of_the_week";
 
-const ShareDialog: React.FC<IProps> = ({ bill, locale, userVote, handleClose, isOpen }) => {
-    const user = useUser();
+const ShareDialog: React.FC<IProps> = ({ bill, locale, userVote: _userVote, handleClose, isOpen }) => {
     const { name, city } = locale;
 
     const hashtag = useMemo(
@@ -38,7 +35,6 @@ const ShareDialog: React.FC<IProps> = ({ bill, locale, userVote, handleClose, is
         [city, bill.externalId],
     );
 
-
     const open = useCallback(
         (route: string) => () => {
             window.open(route, "_blank");

app/frontend/components/user/settings/UserSettings.tsx

@@ -1,11 +1,8 @@
 /** @format */
 
-import { useUser } from "app/frontend/hooks/users/useUser";
-import { useDispatch } from "react-redux";
-
 const UserSettings: React.FC = () => {
-    const dispatch = useDispatch();
-    const user = useUser();
+    // const dispatch = useDispatch();
+    // const user = useUser();
 
     return null;
 

app/frontend/entrypoints/application.tsx

@@ -16,15 +16,12 @@ import { Toaster } from "react-hot-toast";
 import { Provider } from "react-redux";
 import { logDev } from "../sway_utils";
 
-// Load react-select
-// @ts-ignore
-
-const RECAPTCHA__SCRIPT_PROPS = {
-    async: true, // optional, default to false,
-    defer: false, // optional, default to false
-    appendTo: "head", // optional, default to "head", can be "head" or "body",
-    nonce: undefined, // optional, default undefined
-} as const;
+// const RECAPTCHA__SCRIPT_PROPS = {
+//     async: true, // optional, default to false,
+//     defer: false, // optional, default to false
+//     appendTo: "head", // optional, default to "head", can be "head" or "body",
+//     nonce: undefined, // optional, default undefined
+// } as const;
 
 const NO_AUTH_LAYOUTS = ["home", "registration"];
 

app/frontend/hooks/buckets/usePresignedBucketUpload.ts

@@ -1,4 +1,4 @@
-import { handleError, logDev } from "app/frontend/sway_utils";
+import { handleError } from "app/frontend/sway_utils";
 import { sendXHRRequest } from "app/frontend/sway_utils/http";
 import { useCallback } from "react";
 import { sway } from "sway";

app/frontend/hooks/useAxios.ts

@@ -217,7 +217,7 @@ const useAxiosAuthenticatedGet = (method: "get" | "delete" = "get"): TQueryReque
         (route: string, errorHandler?: (error: AxiosError) => void) => {
             return caller(route, options, errorHandler);
         },
-        [method, options],
+        [options, caller],
     ) as TQueryRequest;
 };
 

app/frontend/hooks/useEmailVerification.ts

@@ -2,7 +2,7 @@ import { useCallback } from "react";
 import { sway } from "sway";
 
 export const useEmailVerification = () => {
-    return useCallback(async (user: sway.IUser | null | undefined) => {
+    return useCallback(async (_user: sway.IUser | null | undefined) => {
         // if (user) {
         //     // * NOTE: The below URL redirects the user from the Firebase confirmation screen to a Sway confirmation screen
         //     // * The redirect is NOT currently needed since there is a setInterval listener for when the user verifies in SignIn.tsx