Fix eslint errors + enable linting during CI

.eslintrc.cjs

@@ -20,6 +20,11 @@ module.exports = {
     es6: true,
   },
 
+  globals: {
+    // tracker global on window
+    'tallyho': true
+  },
+
   // Base config
   extends: ["eslint:recommended"],
 
@@ -62,6 +67,14 @@ module.exports = {
           },
         },
       },
+      rules: {
+        // we're cool with explicit any (for now)
+        "@typescript-eslint/no-explicit-any": 0,
+
+        // https://stackoverflow.com/questions/68802881/get-rid-of-is-defined-but-never-used-in-function-parameter
+        "no-unused-vars": 0,
+        "@typescript-eslint/no-unused-vars": ["error", { "argsIgnorePattern": "^_" }]
+      },
       extends: [
         "plugin:@typescript-eslint/recommended",
         "plugin:import/recommended",

.github/workflows/ci.yaml

@@ -10,4 +10,5 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - run: npm install
+      - run: npm run lint
       - run: npm run test

app/analytics/collect.test.ts

@@ -14,7 +14,7 @@ const defaultRequestParams = {
         ns: '1',
     }).toString(),
     headers: {
-        get: (header: string) => {
+        get: (_header: string) => {
             return "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36";
         }
     },
@@ -32,10 +32,10 @@ describe("collectRequestHandler", () => {
             } as CFAnalyticsEngine,
         } as Environment;
 
-        // @ts-expect-error
+        // @ts-expect-error - we're mocking the request object
         const request = httpMocks.createRequest(defaultRequestParams);
 
-        const response = collectRequestHandler(request, env);
+        collectRequestHandler(request, env);
 
         const writeDataPoint = env.TALLYHO.writeDataPoint;
         expect(env.TALLYHO.writeDataPoint).toHaveBeenCalled();

app/analytics/query.ts

@@ -30,7 +30,7 @@ interface AnalyticsQueryResult {
 interface AnalyticsCountResult {
     views: number,
     visits: number
-};
+}
 
 export class AnalyticsEngineAPI {
     cfApiToken: string;
@@ -186,7 +186,7 @@ export class AnalyticsEngineAPI {
             }
 
             const responseData = await response.json() as AnalyticsQueryResult;
-            var result = responseData.data.reduce((acc, cur) => {
+            const result = responseData.data.reduce((acc, cur) => {
                 acc.push([cur['siteId'], cur['count']]);
                 return acc;
             }, []);

app/components/ui/button.tsx

@@ -1,3 +1,4 @@
+/* eslint react/prop-types: 0 */
 import * as React from "react"
 import { Slot } from "@radix-ui/react-slot"
 import { cva, type VariantProps } from "class-variance-authority"

app/components/ui/card.tsx

@@ -1,3 +1,4 @@
+/* eslint react/prop-types: 0 */
 import * as React from "react"
 
 import { cn } from "~/lib/utils"
@@ -33,6 +34,7 @@ const CardTitle = React.forwardRef<
   HTMLParagraphElement,
   React.HTMLAttributes<HTMLHeadingElement>
 >(({ className, ...props }, ref) => (
+  /* eslint jsx-a11y/heading-has-content: 0 */
   <h3
     ref={ref}
     className={cn(

app/components/ui/select.tsx

@@ -1,3 +1,4 @@
+/* eslint react/prop-types: 0 */
 import * as React from "react"
 import * as SelectPrimitive from "@radix-ui/react-select"
 import { Check, ChevronDown, ChevronUp } from "lucide-react"
@@ -75,7 +76,7 @@ const SelectContent = React.forwardRef<
       className={cn(
         "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
-          "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+        "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
         className
       )}
       position={position}
@@ -86,7 +87,7 @@ const SelectContent = React.forwardRef<
         className={cn(
           "p-1",
           position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
         )}
       >
         {children}

app/components/ui/table.tsx

@@ -1,3 +1,4 @@
+/* eslint react/prop-types: 0 */
 import * as React from "react"
 
 import { cn } from "~/lib/utils"

app/entry.server.tsx

@@ -14,8 +14,10 @@ export default async function handleRequest(
     responseStatusCode: number,
     responseHeaders: Headers,
     remixContext: EntryContext,
+
     // This is ignored so we can keep it in the template for visibility.  Feel
     // free to delete this parameter in your app if you're not using it!
+
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     loadContext: AppLoadContext
 ) {

app/routes/_index.tsx

@@ -1,4 +1,4 @@
-import { Card, CardTitle, CardDescription, CardContent, CardHeader } from "~/components/ui/card"
+import { Card, CardContent } from "~/components/ui/card"
 import {
     Select,
     SelectContent,
@@ -9,12 +9,10 @@ import {
 
 import type { LoaderFunctionArgs, MetaFunction } from "@remix-run/cloudflare";
 import { json } from "@remix-run/cloudflare";
-import { useLoaderData, useNavigate, useSearchParams } from "@remix-run/react";
+import { useLoaderData, useSearchParams } from "@remix-run/react";
 
 import { AnalyticsEngineAPI } from "../analytics/query";
 
-import BrowserCard from "~/components/BrowserCard";
-import CountryCard from "~/components/CountryCard";
 import TableCard from "~/components/TableCard";
 
 export const meta: MetaFunction = () => {
@@ -54,7 +52,7 @@ export const loader = async ({ context, request }: LoaderFunctionArgs) => {
         siteId = sitesByHits[0][0];
     }
 
-    let actualSiteId = siteId == '@unknown' ? '' : siteId;
+    const actualSiteId = siteId == '@unknown' ? '' : siteId;
 
     const counts = analyticsEngine.getCounts(actualSiteId, interval);
     const countByPath = analyticsEngine.getCountByPath(actualSiteId, interval);
@@ -77,10 +75,9 @@ export const loader = async ({ context, request }: LoaderFunctionArgs) => {
 };
 
 export default function Index() {
-    const [searchParams, setSearchParams] = useSearchParams();
+    const [, setSearchParams] = useSearchParams();
 
     const data = useLoaderData<typeof loader>();
-    let navigate = useNavigate()
 
     function changeSite(site: string) {
         setSearchParams((prev) => {

global.d.ts

@@ -1,5 +1,9 @@
 interface CFAnalyticsEngine {
-    writeDataPoint: Function
+    writeDataPoint: (data: {
+        indexes: string[],
+        blobs: string[],
+        doubles: number[],
+    }) => void;
 }
 
 interface Environment {