fix linting errors

postcss.config.cjs

@@ -1,3 +1,4 @@
+/* eslint-disable */
 module.exports = {
   plugins: {
     'tailwindcss/nesting': {},

src/api/auth/client.ts

@@ -19,14 +19,15 @@ export async function refreshAccessToken(
       throw new Error(`${resp.status}: ${await resp.text()}`)
     }
 
-    const json = await resp.json()
+    // TODO: validate response
+    const json = await resp.json() as Record<string, string>
     if (!json.access_token) {
       throw new Error('unknown error')
     }
 
     setAccessToken(json.access_token)
   } catch (e) {
-    throw new Error(`Could not exchange oauth code for access token: ${e}`)
+    throw new Error('Could not exchange oauth code for access token', { cause: e })
   }
 }
 

src/api/derived.ts

@@ -43,7 +43,7 @@ type StateDriveEvent = IDriveEvent & {
 
 type UserFlagDriveEvent = IDriveEvent & {
   type: 'user_flag'
-  data: {}
+  data: Record<string, never>
 }
 
 type DriveEvent = EventDriveEvent | StateDriveEvent | UserFlagDriveEvent

src/api/index.ts

@@ -8,7 +8,8 @@ export async function fetcher<T>(endpoint: string): Promise<T> {
     },
   })
 
-  const json = await res.json()
+  // TODO: validate responses
+  const json = await res.json() as T & { error?: string; description?: string }
   if (json.error) {
     throw new Error(json.description)
   }

src/api/route.ts

@@ -56,7 +56,7 @@ export const createQCameraStreamUrl = (
 ): string =>
   `${BASE_URL}/v1/route/${routeName}/qcamera.m3u8?${new URLSearchParams(
     signature,
-  )}`
+  ).toString()}`
 
 export const getQCameraStreamUrl = (
   routeName: Route['fullname'],

src/components/RouteStaticMap.tsx

@@ -70,7 +70,7 @@ const RouteStaticMap: VoidComponent<RouteStaticMapProps> = (props) => {
       )}
     >
       <Switch>
-        <Match when={coords.error || url.error || loadedUrl.error} keyed>
+        <Match when={!!coords.error || !!url.error || !!loadedUrl.error} keyed>
           <State trailing={<Icon filled>error</Icon>}>
             Problem loading map
           </State>

src/components/material/ButtonBase.tsx

@@ -10,7 +10,7 @@ export type ButtonBaseProps = JSX.HTMLAttributes<HTMLButtonElement> & {
 }
 
 const ButtonBase: Component<ButtonBaseProps> = (props) => {
-  const onClick: JSX.EventHandler<any, MouseEvent> = (e: MouseEvent) => {
+  const onClick: JSX.EventHandler<unknown, MouseEvent> = (e: MouseEvent) => {
     props.onClick?.(e)
   }
 

src/map/config.ts

@@ -3,4 +3,5 @@ export const MAPBOX_USERNAME = 'commaai'
 export const MAPBOX_LIGHT_STYLE_ID = 'clcl7mnu2000214s2zgcdly6e'
 export const MAPBOX_DARK_STYLE_ID = 'clcgvbi4f000q15t6o2s8gys3'
 
-export const MAPBOX_TOKEN = import.meta.env.VITE_MAPBOX_TOKEN
+// TODO: validate env or throw error
+export const MAPBOX_TOKEN = import.meta.env.VITE_MAPBOX_TOKEN as string

src/pages/auth/auth.tsx

@@ -13,7 +13,7 @@ export default function Auth() {
   const [{ code, provider }] = useSearchParams<AuthParams>()
 
   if (code && provider) {
-    refreshAccessToken(code, provider).then(() => {
+    void refreshAccessToken(code, provider).then(() => {
       navigate('/')
     })
   }

src/pages/dashboard/Dashboard.tsx

@@ -88,7 +88,7 @@ const DashboardLayout: VoidComponent = () => {
             </>
           }
         >
-          <Match when={profile.error}>
+          <Match when={!!profile.error}>
             <Navigate href="/login" />
           </Match>
           <Match when={dateStr()} keyed>

src/pages/dashboard/activities/DeviceActivity.tsx

@@ -9,8 +9,6 @@ import Typography from '~/components/material/Typography'
 import RouteList from '../components/RouteList'
 import { DashboardContext } from '../Dashboard'
 import DeviceStatistics from '~/components/DeviceStatistics'
-import Card from '~/components/material/Card'
-import Surface from '~/components/material/Surface'
 
 type DeviceActivityProps = {
   dongleId: string

src/pages/dashboard/components/RouteList.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-misused-promises */
 import {
   createEffect,
   createResource,

tailwind.config.cjs → tailwind.config.ts

@@ -1,7 +1,7 @@
-const defaultTheme = require('tailwindcss/defaultTheme')
+import type { Config } from 'tailwindcss'
+import * as defaultTheme from 'tailwindcss/defaultTheme'
 
-/** @type {import('tailwindcss').Config} */
-module.exports = {
+export default {
   content: ['./src/**/*.{ts,tsx}', './index.html'],
   darkMode: ['class', '[data-theme="dark"]'],
   theme: {
@@ -15,12 +15,12 @@ module.exports = {
       full: '9999px',
     },
     fontWeight: {
-      light: 300,
-      regular: 400,
-      medium: 500,
-      semibold: 600,
-      bold: 700,
-      extrabold: 800,
+      light: '300',
+      regular: '400',
+      medium: '500',
+      semibold: '600',
+      bold: '700',
+      extrabold: '800',
     },
     extend: {
       colors: Object.fromEntries(
@@ -84,7 +84,7 @@ module.exports = {
         ripple: {
           '100%': {
             transform: 'scale(4)',
-            opacity: 0,
+            opacity: '0',
           },
         },
         shimmer: {
@@ -131,15 +131,15 @@ module.exports = {
         'circular-dash': {
           '0%': {
             strokeDasharray: '1px, 200px',
-            strokeDashoffset: 0,
+            strokeDashoffset: '0',
           },
           '50%': {
             strokeDasharray: '100px, 200px',
-            strokeDashoffset: -15,
+            strokeDashoffset: '-15',
           },
           '100%': {
             strokeDasharray: '100px, 200px',
-            strokeDashoffset: -125,
+            strokeDashoffset: '-125',
           },
         },
       },
@@ -158,4 +158,4 @@ module.exports = {
       },
     },
   },
-}
+} satisfies Config