From 433ba20d41fdaffb51e5ec6239643ee99cd7c86b Mon Sep 17 00:00:00 2001
From: Howard Wilson <howard@watsonbox.net>
Date: Tue, 20 Oct 2026 19:05:51 +0200
Subject: [PATCH 1/2] Type Spotify API responses and remove any

Add hand-written types in src/spotify.ts for the responses the app reads, checked against the recorded fixtures through the typed test builders. Type the export config, the Liked Songs pseudo-playlist and the unloaded playlist placeholder, and re-enable @typescript-eslint/no-explicit-any.

Use a btn-xs class and inline Font Awesome icon tuples instead of the @ts-expect-error workarounds. Blank the artist names of podcast episodes, which Spotify sends as null and the CSV wrote out as "null".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 eslint.config.js                              |   2 -
 src/App.tsx                                   |  19 ++-
 src/auth.ts                                   |  16 +-
 src/components/ConfigDropdown.tsx             |   8 +-
 src/components/Paginator.tsx                  |   4 +-
 src/components/PlaylistExporter.test.ts       |  11 +-
 src/components/PlaylistExporter.tsx           |  32 ++--
 src/components/PlaylistRow.tsx                |  21 ++-
 src/components/PlaylistSearch.tsx             |   2 +-
 src/components/PlaylistTable.test.tsx         |   7 +-
 src/components/PlaylistTable.tsx              |  17 +-
 src/components/PlaylistsExporter.tsx          |   8 +-
 .../__snapshots__/PlaylistTable.test.tsx.snap |   6 +-
 src/components/data/PlaylistsData.test.ts     |   2 +-
 src/components/data/PlaylistsData.ts          |  55 ++++--
 src/components/data/TracksAlbumData.ts        |  21 +--
 src/components/data/TracksArtistsData.ts      |  26 +--
 .../data/TracksAudioFeaturesData.ts           |  13 +-
 src/components/data/TracksBaseData.ts         |  29 +++-
 src/components/data/TracksData.test.ts        |  21 ++-
 src/components/data/TracksData.ts             |   4 +-
 src/helpers.test.ts                           |  20 ++-
 src/helpers.ts                                |  33 ++--
 src/mocks/handlers.ts                         |   7 +-
 src/spotify.ts                                | 157 ++++++++++++++++++
 src/test/bugsnag.ts                           |   4 +-
 src/test/fixtures/spotify/builders.test.ts    |   7 +-
 src/test/fixtures/spotify/builders.ts         |  56 ++++---
 src/test/fixtures/spotify/scrub.ts            |  10 +-
 29 files changed, 435 insertions(+), 183 deletions(-)
 create mode 100644 src/spotify.ts

diff --git a/eslint.config.js b/eslint.config.js
index a7dfa551..07c5b006 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -14,8 +14,6 @@ export default tseslint.config(
   tseslint.configs.recommended,
   {
     rules: {
-      // Spotify responses are untyped for now: TASK-24.1 re-enables this
-      "@typescript-eslint/no-explicit-any": "off",
       "@typescript-eslint/no-unused-vars": ["error", { ignoreRestSiblings: true }],
       "@typescript-eslint/no-empty-object-type": ["error", { allowInterfaces: "with-single-extends" }],
     },
diff --git a/src/App.tsx b/src/App.tsx
index 247973c3..0ed344d5 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -3,6 +3,7 @@ import "./icons"
 
 import React, { useEffect, useState } from 'react'
 import Bugsnag from "@bugsnag/js"
+import { AxiosResponse, isAxiosError } from "axios"
 import { useTranslation, Translation } from "react-i18next"
 import { Alert } from "react-bootstrap"
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
@@ -10,7 +11,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import Login from 'components/Login'
 import PlaylistTable from "components/PlaylistTable"
 import TopMenu from "components/TopMenu"
-import { loadAccessToken, exchangeCodeForToken, MissingCodeVerifierError } from "auth"
+import { loadAccessToken, exchangeCodeForToken, MissingCodeVerifierError, OAuthErrorResponse } from "auth"
 
 const baseUrl = import.meta.env.BASE_URL
 
@@ -24,8 +25,12 @@ function loginErrorFrom(params: URLSearchParams): LoginError | null {
   return error === "access_denied" ? { kind: "cancelled" } : { kind: "failed", detail: `Spotify: ${error}` }
 }
 
-function describeExchangeFailure(error: any): string {
-  const spotifyError = error.response?.data
+function oauthResponse(error: unknown) {
+  return isAxiosError<Partial<OAuthErrorResponse>>(error) ? error.response : undefined
+}
+
+function describeExchangeFailure(error: Error): string {
+  const spotifyError = oauthResponse(error)?.data
   if (!spotifyError?.error) { return error.message }
 
   return spotifyError.error_description
@@ -34,7 +39,7 @@ function describeExchangeFailure(error: any): string {
 }
 
 // Sends Spotify's reason but never the request, whose body holds the code and verifier
-function reportLoginFailure(error: Error, detail: string, response?: any) {
+function reportLoginFailure(error: Error, detail: string, response?: AxiosResponse<Partial<OAuthErrorResponse>>) {
   // Google's Read Aloud fetcher replays callback URLs with empty storage, so its failures are noise
   if (navigator.userAgent.includes("Google-Read-Aloud")) { return }
 
@@ -70,7 +75,7 @@ function App() {
 
   let view
 
-  const onSetSubtitle = (subtitle: any) => {
+  const onSetSubtitle = (subtitle: React.JSX.Element) => {
     setSubtitle(subtitle)
   }
 
@@ -84,9 +89,9 @@ function App() {
     if (callbackError?.detail) {
       reportLoginFailure(new Error(`Spotify authorization error: ${params.get("error")}`), callbackError.detail)
     } else if (code && !loadAccessToken()) {
-      exchangeCodeForToken(code).then(setAccessToken, (error) => {
+      exchangeCodeForToken(code).then(setAccessToken, (error: Error) => {
         const detail = describeExchangeFailure(error)
-        reportLoginFailure(error, detail, error.response)
+        reportLoginFailure(error, detail, oauthResponse(error))
         setLoginError({ kind: error instanceof MissingCodeVerifierError ? "wrong_browser" : "failed", detail })
       }).finally(() => setExchangingCode(false))
     }
diff --git a/src/auth.ts b/src/auth.ts
index c074e376..24b01465 100644
--- a/src/auth.ts
+++ b/src/auth.ts
@@ -3,7 +3,7 @@
 // - https://developer.spotify.com/documentation/web-api/tutorials/code-pkce-flow
 
 import Bugsnag from "@bugsnag/js"
-import axios from "axios"
+import axios, { AxiosResponse } from "axios"
 import { redirectTo } from "./navigation"
 
 const SPOTIFY_CLIENT_ID = "9950ac751e34487dbbe027c4fd7f8e99"
@@ -13,6 +13,7 @@ const SPOTIFY_SCOPES = "playlist-read-private playlist-read-collaborative user-l
 const EXPIRY_MARGIN = 60 * 1000
 
 type TokenResponse = { access_token: string, expires_in: number, refresh_token?: string }
+export type OAuthErrorResponse = { error: string, error_description?: string }
 
 // Access token management
 export function loadAccessToken(): string | null {
@@ -55,7 +56,7 @@ async function requestRefresh(): Promise<string> {
   if (!refreshToken) { throw new SessionExpiredError() }
 
   try {
-    const response = await axios.post(
+    const response = await axios.post<TokenResponse>(
       SPOTIFY_TOKEN_URL,
       new URLSearchParams({
         grant_type: "refresh_token",
@@ -66,18 +67,17 @@ async function requestRefresh(): Promise<string> {
     )
     saveTokens(response.data)
     return response.data.access_token
-  } catch (error: any) {
+  } catch (error) {
     // With no response it's the connection, which the request's own retries can ride out
-    if (!error.response) { throw error }
+    if (!axios.isAxiosError<Partial<OAuthErrorResponse>>(error) || !error.response) { throw error }
 
-    reportRefreshFailure(error)
+    reportRefreshFailure(error.response)
     throw new SessionExpiredError()
   }
 }
 
 // Sends Spotify's reason but never the request, whose body holds the refresh token
-function reportRefreshFailure(error: any) {
-  const { status, data } = error.response
+function reportRefreshFailure({ status, data }: AxiosResponse<Partial<OAuthErrorResponse>>) {
   const reason = data?.error_description ? `${data.error} (${data.error_description})` : data?.error ?? status
 
   Bugsnag.notify(new Error(`Token refresh failed: ${reason}`), (event) => {
@@ -173,7 +173,7 @@ export async function exchangeCodeForToken(code: string): Promise<string> {
     throw new MissingCodeVerifierError()
   }
 
-  const response = await axios.post(
+  const response = await axios.post<TokenResponse>(
     SPOTIFY_TOKEN_URL,
     new URLSearchParams({
       client_id: clientId,
diff --git a/src/components/ConfigDropdown.tsx b/src/components/ConfigDropdown.tsx
index 98c824e2..5fe2612f 100644
--- a/src/components/ConfigDropdown.tsx
+++ b/src/components/ConfigDropdown.tsx
@@ -5,8 +5,14 @@ import { withTranslation, WithTranslation } from "react-i18next"
 import { Dropdown, Form } from "react-bootstrap"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 
+export interface ExportConfig {
+  includeArtistsData: boolean
+  includeAudioFeaturesData: boolean
+  includeAlbumData: boolean
+}
+
 interface ConfigDropdownProps extends WithTranslation {
-  onConfigChanged: (config: any) => void
+  onConfigChanged: (config: ExportConfig) => void
 }
 
 class ConfigDropdown extends React.Component<ConfigDropdownProps> {
diff --git a/src/components/Paginator.tsx b/src/components/Paginator.tsx
index 76dbcb69..8349920e 100644
--- a/src/components/Paginator.tsx
+++ b/src/components/Paginator.tsx
@@ -8,13 +8,13 @@ interface PaginatorProps {
 }
 
 class Paginator extends React.Component<PaginatorProps> {
-  nextClick = (e: any) => {
+  nextClick = (e: React.MouseEvent) => {
     e.preventDefault()
 
     this.props.onPageChanged(this.props.currentPage + 1)
   }
 
-  prevClick = (e: any) => {
+  prevClick = (e: React.MouseEvent) => {
     e.preventDefault()
 
     this.props.onPageChanged(this.props.currentPage - 1)
diff --git a/src/components/PlaylistExporter.test.ts b/src/components/PlaylistExporter.test.ts
index 57e1d94a..7255a88a 100644
--- a/src/components/PlaylistExporter.test.ts
+++ b/src/components/PlaylistExporter.test.ts
@@ -4,6 +4,7 @@ import { pagedGet, spotifyGet } from "../mocks/handlers"
 import { csvHeaders, csvRecords } from "../test/csv"
 import { API, buildArtist, buildPlaylist, buildPlaylistItem, buildTrack, buildUser } from "../test/fixtures/spotify/builders"
 import PlaylistExporter from "./PlaylistExporter"
+import { Track } from "../spotify"
 
 const baseHeaders = [
   "Track URI", "Track Name", "Artist URI(s)", "Artist Name(s)", "Album URI", "Album Name", "Album Artist URI(s)",
@@ -13,7 +14,9 @@ const baseHeaders = [
 
 const playlist = buildPlaylist({ id: 'p1', name: 'Mixtape', tracks: { total: 1 } })
 
-const serveTracks = (...tracks: object[]) =>
+const noExtraData = { includeArtistsData: false, includeAudioFeaturesData: false, includeAlbumData: false }
+
+const serveTracks = (...tracks: Track[]) =>
   server.use(pagedGet(`${API}/playlists/p1/tracks`, tracks.map(track => buildPlaylistItem({ track, added_by: buildUser({ id: 'dj' }), added_at: '2024-01-02T03:04:05Z' }))))
 
 beforeEach(() => {
@@ -24,7 +27,7 @@ describe("PlaylistExporter", () => {
   test("puts base track columns before the item columns", async () => {
     serveTracks(buildTrack())
 
-    const csv = await new PlaylistExporter(playlist, {}).csvData()
+    const csv = await new PlaylistExporter(playlist, noExtraData).csvData()
 
     expect(csvHeaders(csv)).toEqual(baseHeaders)
   })
@@ -51,7 +54,7 @@ describe("PlaylistExporter", () => {
   test("quotes every field so commas, quotes and newlines survive", async () => {
     serveTracks(buildTrack({ id: 't1', name: 'Say "Hi",\nthen leave', artists: [buildArtist({ name: 'A, B' })] }))
 
-    const csv = await new PlaylistExporter(playlist, {}).csvData()
+    const csv = await new PlaylistExporter(playlist, noExtraData).csvData()
 
     expect(csvRecords(csv)).toEqual([expect.objectContaining({
       "Track URI": "spotify:track:t1",
@@ -68,7 +71,7 @@ describe("PlaylistExporter", () => {
     ['tabs\tand "quotes"', 'tabs_and_quotes_'],
     ['Déjà Vu', 'déjà_vu'],
   ])("names the file for %j as %j", (name, fileName) => {
-    const exporter = new PlaylistExporter({ ...playlist, name }, {})
+    const exporter = new PlaylistExporter({ ...playlist, name }, noExtraData)
 
     expect(exporter.fileName(false)).toBe(fileName)
     expect(exporter.fileName()).toBe(`${fileName}.csv`)
diff --git a/src/components/PlaylistExporter.tsx b/src/components/PlaylistExporter.tsx
index ddbcddb5..7b608e82 100644
--- a/src/components/PlaylistExporter.tsx
+++ b/src/components/PlaylistExporter.tsx
@@ -1,22 +1,24 @@
 import { saveAs } from "file-saver"
 import i18n from "../i18n/config"
 
-import TracksData from "components/data/TracksData"
-import TracksBaseData from "components/data/TracksBaseData"
+import TracksData, { CsvValue } from "components/data/TracksData"
+import TracksBaseData, { TrackItem } from "components/data/TracksBaseData"
 import TracksArtistsData from "components/data/TracksArtistsData"
 import TracksAudioFeaturesData from "components/data/TracksAudioFeaturesData"
 import TracksAlbumData from "components/data/TracksAlbumData"
+import { ExportablePlaylist } from "components/data/PlaylistsData"
+import { ExportConfig } from "components/ConfigDropdown"
 
 class TracksCsvFile {
-  playlist: any
-  trackItems: any
+  playlist: ExportablePlaylist
+  trackItems: TrackItem[]
   columnNames: string[]
-  lineData: Map<string, string[]>
+  lineData: Map<string, CsvValue[]>
 
   lineTrackUris: string[]
-  lineTrackData: string[][]
+  lineTrackData: CsvValue[][]
 
-  constructor(playlist: any, trackItems: any) {
+  constructor(playlist: ExportablePlaylist, trackItems: TrackItem[]) {
     this.playlist = playlist
     this.trackItems = trackItems
     this.columnNames = [
@@ -25,8 +27,8 @@ class TracksCsvFile {
     ]
 
     this.lineData = new Map()
-    this.lineTrackUris = trackItems.map((i: any) => i.track.uri)
-    this.lineTrackData = trackItems.map((i: any) => [
+    this.lineTrackUris = trackItems.map((i) => i.track.uri)
+    this.lineTrackData = trackItems.map((i) => [
       i.added_by == null ? '' : i.added_by.uri,
       i.added_at
     ])
@@ -39,7 +41,7 @@ class TracksCsvFile {
       this.columnNames.push(...tracksData.dataLabels())
     }
 
-    const data: Map<string, string[]> = await tracksData.data()
+    const data = await tracksData.data()
 
     this.lineTrackUris.forEach((uri: string, index: number) => {
       if (data.has(uri)) {
@@ -64,17 +66,17 @@ class TracksCsvFile {
     return csvContent
   }
 
-  sanitize(string: string): string {
-    return '"' + String(string).replace(/"/g, '""') + '"'
+  sanitize(value: CsvValue): string {
+    return '"' + String(value).replace(/"/g, '""') + '"'
   }
 }
 
 // Handles exporting a single playlist as a CSV file
 class PlaylistExporter {
-  playlist: any
-  config: any
+  playlist: ExportablePlaylist
+  config: ExportConfig
 
-  constructor(playlist: any, config: any) {
+  constructor(playlist: ExportablePlaylist, config: ExportConfig) {
     this.playlist = playlist
     this.config = config
   }
diff --git a/src/components/PlaylistRow.tsx b/src/components/PlaylistRow.tsx
index de9ce1f9..acad48a9 100644
--- a/src/components/PlaylistRow.tsx
+++ b/src/components/PlaylistRow.tsx
@@ -4,10 +4,12 @@ import { Button } from "react-bootstrap"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 
 import PlaylistExporter from "./PlaylistExporter"
+import { ExportablePlaylist, PlaylistPlaceholder } from "./data/PlaylistsData"
+import { ExportConfig } from "./ConfigDropdown"
 
 interface PlaylistRowProps extends WithTranslation {
-  playlist: any,
-  config: any
+  playlist: ExportablePlaylist | PlaylistPlaceholder,
+  config: ExportConfig
   onApiError: (error: unknown) => void
 }
 
@@ -16,12 +18,12 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
     exporting: false
   }
 
-  exportPlaylist = () => {
+  exportPlaylist = (playlist: ExportablePlaylist) => {
     this.setState(
       { exporting: true },
       () => {
         (new PlaylistExporter(
-          this.props.playlist,
+          playlist,
           this.props.config
         )).export().catch(this.props.onApiError).finally(() => {
           this.setState({ exporting: false })
@@ -30,7 +32,7 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
     )
   }
 
-  renderTickCross(condition: boolean) {
+  renderTickCross(condition?: boolean) {
     if (condition) {
       return <FontAwesomeIcon icon={['far', 'check-circle']} size="sm" />
     } else {
@@ -38,7 +40,7 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
     }
   }
 
-  renderIcon(playlist: any) {
+  renderIcon(playlist: ExportablePlaylist | PlaylistPlaceholder) {
     if (playlist.id === 'liked') {
       return <FontAwesomeIcon icon={['far', 'heart']} style={{ color: 'red' }} />;
     } else {
@@ -48,7 +50,6 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
 
   render() {
     const playlist = this.props.playlist
-    const icon = ['fas', (this.state.exporting ? 'sync' : 'download')]
 
     if (playlist.uri == null) return (
       <tr>
@@ -70,10 +71,8 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
         <td className="d-none d-sm-table-cell">{this.renderTickCross(playlist.public)}</td>
         <td className="d-none d-md-table-cell">{this.renderTickCross(playlist.collaborative)}</td>
         <td className="text-end">
-          {/* @ts-expect-error - custom xs size from index.scss */}
-          <Button type="submit" variant="primary" size="xs" onClick={this.exportPlaylist} disabled={this.state.exporting} className="text-nowrap">
-            {/* @ts-expect-error - icon is a plain string array */}
-            <FontAwesomeIcon icon={icon} size="sm" spin={this.state.exporting} /> {this.props.i18n.t("playlist.export")}
+          <Button type="submit" variant="primary" onClick={() => this.exportPlaylist(playlist)} disabled={this.state.exporting} className="text-nowrap btn-xs">
+            <FontAwesomeIcon icon={['fas', this.state.exporting ? 'sync' : 'download']} size="sm" spin={this.state.exporting} /> {this.props.i18n.t("playlist.export")}
           </Button>
         </td>
       </tr>
diff --git a/src/components/PlaylistSearch.tsx b/src/components/PlaylistSearch.tsx
index 8ff621d6..4d035dca 100644
--- a/src/components/PlaylistSearch.tsx
+++ b/src/components/PlaylistSearch.tsx
@@ -7,7 +7,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 
 interface PlaylistSearchProps extends WithTranslation {
   onPlaylistSearch: (query: string) => void
-  onPlaylistSearchCancel: () => Promise<any>
+  onPlaylistSearchCancel: () => Promise<void>
 }
 
 class PlaylistSearch extends React.Component<PlaylistSearchProps> {
diff --git a/src/components/PlaylistTable.test.tsx b/src/components/PlaylistTable.test.tsx
index 96e02583..65e425af 100644
--- a/src/components/PlaylistTable.test.tsx
+++ b/src/components/PlaylistTable.test.tsx
@@ -7,6 +7,7 @@ import FileSaver from "file-saver"
 import JSZip from "jszip"
 
 import PlaylistTable from "./PlaylistTable"
+import { ExportConfig } from "./ConfigDropdown"
 
 import "../icons"
 import { server } from "../mocks/server"
@@ -112,8 +113,8 @@ const localTrack = (name: string, artist: string, durationMs: number) => ({
 
 const requestedUrls = () => handlerCalled.mock.calls.map(([url]) => url)
 
-const renderTable = (config = {}) =>
-  render(<PlaylistTable config={config} onSetSubtitle={vi.fn()} />)
+const renderTable = (config: Partial<ExportConfig> = {}) =>
+  render(<PlaylistTable config={{ includeArtistsData: false, includeAudioFeaturesData: false, includeAlbumData: false, ...config }} onSetSubtitle={vi.fn()} />)
 
 async function savedFile() {
   const saveAs = vi.mocked(FileSaver.saveAs)
@@ -524,7 +525,7 @@ describe("when an export fails unexpectedly", () => {
 
   test("Export All stays busy until the zip is saved", async () => {
     let finishZip: (zip: Blob) => void = () => {}
-    generateAsync().mockReturnValue(new Promise(resolve => { finishZip = resolve }) as any)
+    generateAsync().mockReturnValue(new Promise<Blob>(resolve => { finishZip = resolve }))
     renderTable()
     const button = await screen.findByRole('button', { name: /Export All/ })
 
diff --git a/src/components/PlaylistTable.tsx b/src/components/PlaylistTable.tsx
index cb1913d8..a701fb2f 100644
--- a/src/components/PlaylistTable.tsx
+++ b/src/components/PlaylistTable.tsx
@@ -4,16 +4,17 @@ import { Alert, ProgressBar } from "react-bootstrap"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 
 import Bugsnag from "@bugsnag/js"
-import PlaylistsData from "./data/PlaylistsData"
-import ConfigDropdown, { ConfigDropdownRef } from "./ConfigDropdown"
+import PlaylistsData, { ExportablePlaylist, PlaylistPlaceholder } from "./data/PlaylistsData"
+import ConfigDropdown, { ConfigDropdownRef, ExportConfig } from "./ConfigDropdown"
 import PlaylistSearch, { PlaylistSearchRef } from "./PlaylistSearch"
 import PlaylistRow from "./PlaylistRow"
 import Paginator from "./Paginator"
 import PlaylistsExporter from "./PlaylistsExporter"
 import { apiCall, apiCallErrorHandler, ApiError } from "helpers"
+import { CurrentUser } from "spotify"
 
 interface PlaylistTableProps extends WithTranslation {
-  config?: any,
+  config?: ExportConfig,
   onSetSubtitle: (subtitile: React.JSX.Element) => void
 }
 
@@ -29,7 +30,7 @@ class PlaylistTable extends React.Component<PlaylistTableProps> {
     initialized: false,
     apiError: null as ApiError | null,
     searchQuery: "",
-    playlists: [],
+    playlists: [] as (ExportablePlaylist | PlaylistPlaceholder)[],
     playlistCount: 0,
     likedSongs: {
       limit: 0,
@@ -162,7 +163,7 @@ class PlaylistTable extends React.Component<PlaylistTableProps> {
     })
   }
 
-  handleConfigChanged = (config: any) => {
+  handleConfigChanged = (config: ExportConfig) => {
     Bugsnag.leaveBreadcrumb(`Config updated to ${JSON.stringify(config)}`)
 
     this.setState({ config: config })
@@ -181,10 +182,10 @@ class PlaylistTable extends React.Component<PlaylistTableProps> {
 
   async componentDidMount() {
     try {
-      const user = await apiCall("https://api.spotify.com/v1/me")
+      const user = await apiCall<CurrentUser>("https://api.spotify.com/v1/me")
         .then(response => response.data)
 
-      Bugsnag.setUser(user.id, user.uri, user.display_name)
+      Bugsnag.setUser(user.id, user.uri, user.display_name ?? undefined)
 
       this.userId = user.id
       this.playlistsData = new PlaylistsData(
@@ -255,7 +256,7 @@ class PlaylistTable extends React.Component<PlaylistTableProps> {
                 </tr>
               </thead>
               <tbody>
-                {this.state.playlists.map((playlist: any, i) => {
+                {this.state.playlists.map((playlist, i) => {
                   return <PlaylistRow
                     playlist={playlist}
                     key={playlist.id || i}
diff --git a/src/components/PlaylistsExporter.tsx b/src/components/PlaylistsExporter.tsx
index cce0f49c..856fe1f4 100644
--- a/src/components/PlaylistsExporter.tsx
+++ b/src/components/PlaylistsExporter.tsx
@@ -7,11 +7,12 @@ import JSZip from "jszip"
 
 import PlaylistExporter from "./PlaylistExporter"
 import PlaylistsData from "./data/PlaylistsData"
+import { ExportConfig } from "./ConfigDropdown"
 
 interface PlaylistsExporterProps extends WithTranslation {
   playlistsData: PlaylistsData
   searchQuery: string
-  config: any
+  config: ExportConfig
   onPlaylistExportStarted: (playlistName: string, doneCount: number) => void
   onPlaylistsExportDone: () => void
   onApiError: (error: unknown) => void
@@ -23,7 +24,7 @@ class PlaylistsExporter extends React.Component<PlaylistsExporterProps> {
     exporting: false
   }
 
-  async export(playlistsData: PlaylistsData, searchQuery: string, config: any) {
+  async export(playlistsData: PlaylistsData, searchQuery: string, config: ExportConfig) {
     const playlistFileNames = new Set<string>()
     const playlistCsvExports = new Array<string>()
 
@@ -77,8 +78,7 @@ class PlaylistsExporter extends React.Component<PlaylistsExporterProps> {
   render() {
     const text = this.props.searchQuery === "" ? this.props.i18n.t("export_all") : this.props.i18n.t("export_search_results")
 
-    // @ts-expect-error - custom xs size from index.scss
-    return <Button type="submit" variant="outline-secondary" size="xs" onClick={this.exportPlaylists} className="text-nowrap" disabled={this.state.exporting} >
+    return <Button type="submit" variant="outline-secondary" onClick={this.exportPlaylists} className="text-nowrap btn-xs" disabled={this.state.exporting} >
       <FontAwesomeIcon icon={['far', 'file-archive']} /> {text}
     </Button >
   }
diff --git a/src/components/__snapshots__/PlaylistTable.test.tsx.snap b/src/components/__snapshots__/PlaylistTable.test.tsx.snap
index 835b582c..04e43e09 100644
--- a/src/components/__snapshots__/PlaylistTable.test.tsx.snap
+++ b/src/components/__snapshots__/PlaylistTable.test.tsx.snap
@@ -142,7 +142,7 @@ exports[`playlist loading 1`] = `
               class="export text-end"
             >
               <button
-                class="text-nowrap btn btn-outline-secondary btn-xs"
+                class="text-nowrap btn-xs btn btn-outline-secondary"
                 type="submit"
               >
                 <svg
@@ -238,7 +238,7 @@ exports[`playlist loading 1`] = `
               class="text-end"
             >
               <button
-                class="text-nowrap btn btn-primary btn-xs"
+                class="text-nowrap btn-xs btn btn-primary"
                 type="submit"
               >
                 <svg
@@ -331,7 +331,7 @@ exports[`playlist loading 1`] = `
               class="text-end"
             >
               <button
-                class="text-nowrap btn btn-primary btn-xs"
+                class="text-nowrap btn-xs btn btn-primary"
                 type="submit"
               >
                 <svg
diff --git a/src/components/data/PlaylistsData.test.ts b/src/components/data/PlaylistsData.test.ts
index 2e97934d..6c72aee6 100644
--- a/src/components/data/PlaylistsData.test.ts
+++ b/src/components/data/PlaylistsData.test.ts
@@ -20,7 +20,7 @@ function servePlaylists(playlists: object[]) {
   )
 }
 
-const names = (playlists: any[]) => playlists.map(p => p.name)
+const names = (playlists: { name?: string }[]) => playlists.map(p => p.name)
 
 describe("PlaylistsData", () => {
   test("puts the liked tracks playlist first in the first slice", async () => {
diff --git a/src/components/data/PlaylistsData.ts b/src/components/data/PlaylistsData.ts
index 3be02bfd..41eec7c9 100644
--- a/src/components/data/PlaylistsData.ts
+++ b/src/components/data/PlaylistsData.ts
@@ -1,15 +1,35 @@
 import { apiCall } from "helpers"
+import { Paging, SavedTrack, SimplifiedPlaylist } from "spotify"
+
+// Liked Songs isn't a playlist on Spotify, so it's built from /me/tracks and exported alongside them
+export interface LikedSongsPlaylist {
+  id: "liked"
+  name: string
+  public: false
+  collaborative: false
+  owner: { id: string; display_name: string; uri: string }
+  tracks: { href: string; limit: number; total: number }
+  uri: string
+}
+
+export type ExportablePlaylist = SimplifiedPlaylist | LikedSongsPlaylist
+
+// Stands in for a playlist that hasn't been loaded yet
+export type PlaylistPlaceholder = { [K in keyof SimplifiedPlaylist]?: undefined }
+
+const isLoaded = (playlist: SimplifiedPlaylist | PlaylistPlaceholder | null): playlist is SimplifiedPlaylist =>
+  playlist != null && Object.keys(playlist).length > 0
 
 // Handles cached loading of all or subsets of playlist data
 class PlaylistsData {
   PLAYLIST_LIMIT = 50
-  PLACEHOLDER = {}
+  PLACEHOLDER: PlaylistPlaceholder = {}
 
   userId: string
   private onPlaylistsLoadingStarted?: () => void
   private onPlaylistsLoadingDone?: () => void
-  private data: any[]
-  private likedTracksPlaylist: any
+  private data: (SimplifiedPlaylist | PlaylistPlaceholder | null)[]
+  private likedTracksPlaylist: LikedSongsPlaylist | null
   private dataInitialized = false
 
   constructor(userId: string, onPlaylistsLoadingStarted?: () => void, onPlaylistsLoadingDone?: () => void) {
@@ -28,31 +48,32 @@ class PlaylistsData {
     return this.data.filter(p => p).length
   }
 
-  async slice(start: number, end: number) {
+  async slice(start: number, end: number): Promise<(ExportablePlaylist | PlaylistPlaceholder)[]> {
     await this.loadSlice(start, end)
-    await this.loadLikedTracksPlaylist()
+    const likedTracksPlaylist = await this.loadLikedTracksPlaylist()
+    const playlists = this.data.slice(start, end).filter(p => p != null)
 
     // It's a little ugly, but we slip in liked tracks with the first slice
     if (start === 0) {
-      return [this.likedTracksPlaylist, ...this.data.slice(start, end).filter(p => p)]
+      return [likedTracksPlaylist, ...playlists]
     } else {
-      return this.data.slice(start, end).filter(p => p)
+      return playlists
     }
   }
 
-  async all() {
+  async all(): Promise<ExportablePlaylist[]> {
     await this.loadAll()
-    await this.loadLikedTracksPlaylist()
+    const likedTracksPlaylist = await this.loadLikedTracksPlaylist()
 
     // Remove any uninitialized playlists when exporting
-    return [this.likedTracksPlaylist, ...this.data.filter(p => p && Object.keys(p).length > 0)]
+    return [likedTracksPlaylist, ...this.data.filter(isLoaded)]
   }
 
-  async search(query: string) {
+  async search(query: string): Promise<SimplifiedPlaylist[]> {
     await this.loadAll()
 
     // Remove any uninitialized playlists when exporting
-    const results = this.data.filter(p => p && Object.keys(p).length > 0)
+    const results = this.data.filter(isLoaded)
 
     if (query.startsWith("public:")) {
       return results.filter(p => p.public === query.endsWith(":true"))
@@ -99,7 +120,7 @@ class PlaylistsData {
     }
 
     const playlistsUrl = `https://api.spotify.com/v1/me/playlists?offset=${start}&limit=${end - start}`
-    const playlistsResponse = await apiCall(playlistsUrl)
+    const playlistsResponse = await apiCall<Paging<SimplifiedPlaylist | null>>(playlistsUrl)
     const playlistsData = playlistsResponse.data
 
     if (!this.dataInitialized) {
@@ -110,13 +131,13 @@ class PlaylistsData {
     this.data.splice(start, playlistsData.items.length, ...playlistsData.items)
   }
 
-  private async loadLikedTracksPlaylist() {
+  private async loadLikedTracksPlaylist(): Promise<LikedSongsPlaylist> {
     if (this.likedTracksPlaylist !== null) {
-      return
+      return this.likedTracksPlaylist
     }
 
     const likedTracksUrl = `https://api.spotify.com/v1/me/tracks`
-    const likedTracksResponse = await apiCall(likedTracksUrl)
+    const likedTracksResponse = await apiCall<Paging<SavedTrack>>(likedTracksUrl)
     const likedTracksData = likedTracksResponse.data
 
     this.likedTracksPlaylist = {
@@ -136,6 +157,8 @@ class PlaylistsData {
       },
       "uri": "spotify:user:" + this.userId + ":saved"
     }
+
+    return this.likedTracksPlaylist
   }
 }
 
diff --git a/src/components/data/TracksAlbumData.ts b/src/components/data/TracksAlbumData.ts
index 66eb720a..0ebe9970 100644
--- a/src/components/data/TracksAlbumData.ts
+++ b/src/components/data/TracksAlbumData.ts
@@ -1,13 +1,14 @@
 import i18n from "../../i18n/config"
 import TracksData from "./TracksData"
 import { apiCall } from "helpers"
+import { Album, AlbumsResponse, Track } from "spotify"
 
 class TracksAlbumData extends TracksData {
   ALBUM_LIMIT = 20
 
-  tracks: any[]
+  tracks: Track[]
 
-  constructor(tracks: any[]) {
+  constructor(tracks: Track[]) {
     super()
     this.tracks = tracks
   }
@@ -21,7 +22,7 @@ class TracksAlbumData extends TracksData {
   }
 
   async data() {
-    const albumIds = Array.from(new Set(this.tracks.filter((track: any) => track.album.id).map((track: any) => track.album.id)))
+    const albumIds = Array.from(new Set(this.tracks.map((track) => track.album.id).filter((id): id is string => Boolean(id))))
 
     const requests = []
 
@@ -29,24 +30,24 @@ class TracksAlbumData extends TracksData {
       requests.push(`https://api.spotify.com/v1/albums?ids=${albumIds.slice(offset, offset + this.ALBUM_LIMIT)}`)
     }
 
-    const albumPromises = requests.map((request) => apiCall(request))
+    const albumPromises = requests.map((request) => apiCall<AlbumsResponse>(request))
     const albumResponses = await Promise.all(albumPromises)
 
     const albumDataById = new Map<string, string[]>(
-      albumResponses.flatMap((response) => response.data.albums.map((album: any) => {
+      albumResponses.flatMap((response) => response.data.albums.filter((album): album is Album => album != null).map((album) => {
         return [
-          album == null ? "" : album.id,
+          album.id,
           [
-            album == null ? "" : album.genres.join(", "),
-            album == null ? "" : album.label,
-            album == null ? "" : album.copyrights.map((c: any) => `${c.type} ${c.text}`).join(", ")
+            album.genres.join(", "),
+            album.label,
+            album.copyrights.map((c) => `${c.type} ${c.text}`).join(", ")
           ]
         ]
       }))
     )
 
     return new Map<string, string[]>(
-      this.tracks.map((track: any) => [track.uri, albumDataById.get(track.album.id) || ["", "", ""]])
+      this.tracks.map((track) => [track.uri, (track.album.id && albumDataById.get(track.album.id)) || ["", "", ""]])
     )
   }
 }
diff --git a/src/components/data/TracksArtistsData.ts b/src/components/data/TracksArtistsData.ts
index 0176645d..c1664a3e 100644
--- a/src/components/data/TracksArtistsData.ts
+++ b/src/components/data/TracksArtistsData.ts
@@ -1,13 +1,14 @@
 import i18n from "../../i18n/config"
 import TracksData from "./TracksData"
 import { apiCall } from "helpers"
+import { ArtistsResponse, Track } from "spotify"
 
 class TracksArtistsData extends TracksData {
   ARTIST_LIMIT = 50
 
-  tracks: any[]
+  tracks: Track[]
 
-  constructor(tracks: any[]) {
+  constructor(tracks: Track[]) {
     super()
     this.tracks = tracks
   }
@@ -19,12 +20,12 @@ class TracksArtistsData extends TracksData {
   }
 
   async data() {
-    const artistIds = Array.from(new Set(this.tracks.flatMap((track: any) => {
+    const artistIds = Array.from(new Set(this.tracks.flatMap((track) => {
       return track
         .artists
-        .filter((a: any) => a.type === "artist")
-        .map((a: any) => a.id)
-        .filter((i: string) => i)
+        .filter((a) => a.type === "artist")
+        .map((a) => a.id)
+        .filter((id): id is string => Boolean(id))
     })))
 
     const requests = []
@@ -33,18 +34,19 @@ class TracksArtistsData extends TracksData {
       requests.push(`https://api.spotify.com/v1/artists?ids=${artistIds.slice(offset, offset + this.ARTIST_LIMIT)}`)
     }
 
-    const artistPromises = requests.map(request => { return apiCall(request) })
+    const artistPromises = requests.map(request => { return apiCall<ArtistsResponse>(request) })
     const artistResponses = await Promise.all(artistPromises)
 
-    const artistsById = new Map(artistResponses.flatMap((response) => response.data.artists).map((artist: any) => [artist.id, artist]))
+    const artistsById = new Map(artistResponses.flatMap((response) => response.data.artists).map((artist) => [artist.id, artist]))
 
-    return new Map<string, string[]>(this.tracks.map((track: any) => {
+    return new Map<string, string[]>(this.tracks.map((track) => {
       return [
         track.uri,
         [
-          track.artists.map((a: any) => {
-            return artistsById.has(a.id) ? artistsById.get(a.id)!.genres.filter((g: string) => g).join(',') : ""
-          }).filter((g: string) => g).join(",")
+          track.artists.map((a) => {
+            const artist = a.id == null ? undefined : artistsById.get(a.id)
+            return artist ? artist.genres.filter((g) => g).join(',') : ""
+          }).filter((g) => g).join(",")
         ]
       ]
     }))
diff --git a/src/components/data/TracksAudioFeaturesData.ts b/src/components/data/TracksAudioFeaturesData.ts
index 83bf4a77..774f93a4 100644
--- a/src/components/data/TracksAudioFeaturesData.ts
+++ b/src/components/data/TracksAudioFeaturesData.ts
@@ -1,13 +1,14 @@
 import i18n from "../../i18n/config"
-import TracksData from "./TracksData"
+import TracksData, { CsvValue } from "./TracksData"
 import { apiCall } from "helpers"
+import { AudioFeatures, AudioFeaturesResponse, Track } from "spotify"
 
 class TracksAudioFeaturesData extends TracksData {
   AUDIO_FEATURES_LIMIT = 100
 
-  tracks: any[]
+  tracks: Track[]
 
-  constructor(tracks: any[]) {
+  constructor(tracks: Track[]) {
     super()
     this.tracks = tracks
   }
@@ -30,7 +31,7 @@ class TracksAudioFeaturesData extends TracksData {
   }
 
   async data() {
-    const trackIds = this.tracks.map((track: any) => track.id)
+    const trackIds = this.tracks.map((track) => track.id)
 
     const requests = []
 
@@ -38,10 +39,10 @@ class TracksAudioFeaturesData extends TracksData {
       requests.push(`https://api.spotify.com/v1/audio-features?ids=${trackIds.slice(offset, offset + this.AUDIO_FEATURES_LIMIT)}`)
     }
 
-    const audioFeaturesPromises = requests.map(request => { return apiCall(request) })
+    const audioFeaturesPromises = requests.map(request => { return apiCall<AudioFeaturesResponse>(request) })
     const audioFeatures = (await Promise.all(audioFeaturesPromises)).flatMap((response) => response.data.audio_features)
 
-    const audioFeaturesData = new Map<string, string[]>(audioFeatures.filter((af: any) => af).map((audioFeatures: any) => {
+    const audioFeaturesData = new Map<string, CsvValue[]>(audioFeatures.filter((af): af is AudioFeatures => af != null).map((audioFeatures) => {
       return [
         audioFeatures.uri,
         [
diff --git a/src/components/data/TracksBaseData.ts b/src/components/data/TracksBaseData.ts
index b2ce2665..916442a5 100644
--- a/src/components/data/TracksBaseData.ts
+++ b/src/components/data/TracksBaseData.ts
@@ -1,11 +1,22 @@
 import i18n from "../../i18n/config"
 import TracksData from "./TracksData"
 import { apiCall } from "helpers"
+import { Paging, PlaylistItem, SavedTrack, Track, UserReference } from "spotify"
+import { ExportablePlaylist } from "./PlaylistsData"
+
+// What playlist items and saved tracks have in common, once items whose track is gone are left out
+export interface TrackItem {
+  added_at: string
+  added_by?: UserReference | null
+  track: Track
+}
+
+const hasTrack = (item: PlaylistItem | SavedTrack): item is TrackItem => item.track != null
 
 class TracksBaseData extends TracksData {
-  playlist: any
+  playlist: ExportablePlaylist
 
-  constructor(playlist: any) {
+  constructor(playlist: ExportablePlaylist) {
     super()
     this.playlist = playlist
   }
@@ -47,12 +58,12 @@ class TracksBaseData extends TracksData {
         [
           item.track.uri,
           item.track.name,
-          item.track.artists.map((a: any) => { return a.uri }).join(', '),
-          item.track.artists.map((a: any) => { return String(a.name).replace(/,/g, "\\,") }).join(', '),
+          item.track.artists.map((a) => { return a.uri }).join(', '),
+          item.track.artists.map((a) => { return (a.name ?? "").replace(/,/g, "\\,") }).join(', '),
           item.track.album.uri == null ? '' : item.track.album.uri,
           item.track.album.name,
-          item.track.album.artists.map((a: any) => { return a.uri }).join(', '),
-          item.track.album.artists.map((a: any) => { return String(a.name).replace(/,/g, "\\,") }).join(', '),
+          item.track.album.artists.map((a) => { return a.uri }).join(', '),
+          item.track.album.artists.map((a) => { return (a.name ?? "").replace(/,/g, "\\,") }).join(', '),
           item.track.album.release_date == null ? '' : item.track.album.release_date,
           item.track.album.images[0] == null ? '' : item.track.album.images[0].url,
           item.track.disc_number,
@@ -68,7 +79,7 @@ class TracksBaseData extends TracksData {
   }
 
   // Memoization supporting multiple calls
-  private playlistItems: any[] = []
+  private playlistItems: TrackItem[] = []
   private async getPlaylistItems() {
     if (this.playlistItems.length > 0) {
       return this.playlistItems
@@ -81,11 +92,11 @@ class TracksBaseData extends TracksData {
       requests.push(`${this.playlist.tracks.href.split('?')[0]}?offset=${offset}&limit=${limit}`)
     }
 
-    const trackPromises = requests.map(request => { return apiCall(request) })
+    const trackPromises = requests.map(request => { return apiCall<Paging<PlaylistItem | SavedTrack>>(request) })
     const trackResponses = await Promise.all(trackPromises)
 
     this.playlistItems = trackResponses.flatMap(response => {
-      return response.data.items.filter((i: any) => i.track) // Exclude null track attributes
+      return response.data.items.filter(hasTrack) // Exclude null track attributes
     })
   }
 }
diff --git a/src/components/data/TracksData.test.ts b/src/components/data/TracksData.test.ts
index 062149b6..c321fcc1 100644
--- a/src/components/data/TracksData.test.ts
+++ b/src/components/data/TracksData.test.ts
@@ -6,6 +6,7 @@ import {
   buildPlaylistItem, buildSavedTrack, buildTrack,
 } from "../../test/fixtures/spotify/builders"
 import TracksBaseData from "./TracksBaseData"
+import { LikedSongsPlaylist } from "./PlaylistsData"
 import TracksArtistsData from "./TracksArtistsData"
 import TracksAudioFeaturesData from "./TracksAudioFeaturesData"
 import TracksAlbumData from "./TracksAlbumData"
@@ -34,7 +35,12 @@ describe("TracksBaseData", () => {
   })
 
   test("loads liked tracks 50 at a time", async () => {
-    const likedPlaylist = { id: 'liked', tracks: { href: `${API}/me/tracks`, limit: 20, total: 60 } }
+    const likedPlaylist: LikedSongsPlaylist = {
+      id: 'liked', name: 'Liked', public: false, collaborative: false,
+      owner: { id: 'me', display_name: 'me', uri: 'spotify:user:me' },
+      tracks: { href: `${API}/me/tracks`, limit: 20, total: 60 },
+      uri: 'spotify:user:me:saved',
+    }
     server.use(pagedGet(`${API}/me/tracks`, range(60).map(i => buildSavedTrack({ track: buildTrack({ id: `t${i}` }) }))))
 
     const trackItems = await new TracksBaseData(likedPlaylist).trackItems()
@@ -77,6 +83,19 @@ describe("TracksBaseData", () => {
       1, 4, 215000, '', true, 70, '',
     ])
   })
+
+  test("blanks the artist names of podcast episodes, which Spotify sends as null", async () => {
+    const show = buildArtist({ id: 's1', name: null, type: 'Song Exploder', uri: 'spotify:show:s1' })
+    const episode = buildTrack({
+      id: 'e1', type: 'episode', uri: 'spotify:episode:e1', artists: [show], album: buildAlbum({ id: 's1', type: 'show', artists: [show] }),
+    })
+    server.use(pagedGet(`${API}/playlists/p1/tracks`, [buildPlaylistItem({ track: episode })]))
+
+    const data = await new TracksBaseData(buildPlaylist({ id: 'p1', tracks: { total: 1 } })).data()
+
+    const [, , artistUris, artistNames, , , albumArtistUris, albumArtistNames] = data.get('spotify:episode:e1')!
+    expect([artistUris, artistNames, albumArtistUris, albumArtistNames]).toEqual(['spotify:show:s1', '', 'spotify:show:s1', ''])
+  })
 })
 
 describe("TracksArtistsData", () => {
diff --git a/src/components/data/TracksData.ts b/src/components/data/TracksData.ts
index 1c21fc3c..7401f11d 100644
--- a/src/components/data/TracksData.ts
+++ b/src/components/data/TracksData.ts
@@ -1,6 +1,8 @@
+export type CsvValue = string | number | boolean
+
 abstract class TracksData {
   abstract dataLabels(): string[]
-  abstract data(): Promise<Map<string, string[]>>
+  abstract data(): Promise<Map<string, CsvValue[]>>
 }
 
 export default TracksData
diff --git a/src/helpers.test.ts b/src/helpers.test.ts
index c795ceaa..ec924447 100644
--- a/src/helpers.test.ts
+++ b/src/helpers.test.ts
@@ -1,4 +1,6 @@
 import { http, HttpResponse } from "msw"
+import { Event as BugsnagEvent } from "@bugsnag/js"
+import { AxiosError } from "axios"
 import { server } from "./mocks/server"
 import { apiCall, apiCallErrorHandler, prepareReport } from "./helpers"
 import { redirectTo } from "./navigation"
@@ -34,7 +36,7 @@ function respondWith(...responses: (() => Response)[]) {
 async function settle<T>(promise: Promise<T>) {
   const result = promise.then(value => ({ value }), error => ({ error }))
   await vi.runAllTimersAsync()
-  return result as Promise<{ value?: T, error?: any }>
+  return result as Promise<{ value?: T, error?: AxiosError }>
 }
 
 // Bottleneck remembers when it last ran, so the clock never goes back between tests
@@ -68,7 +70,7 @@ describe("a request that fails with no response", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.code).toBe("ERR_NETWORK")
+    expect(error?.code).toBe("ERR_NETWORK")
     expect(attempts.delays()).toEqual([1000, 2000, 4000, 8000, 16000])
   })
 
@@ -96,7 +98,7 @@ describe("a request that fails with no response", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.code).toBe("ERR_NETWORK")
+    expect(error?.code).toBe("ERR_NETWORK")
     expect(attempts).toHaveLength(1)
   })
 
@@ -125,7 +127,7 @@ describe("a 429", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.response.status).toBe(429)
+    expect(error?.response?.status).toBe(429)
     expect(attempts).toHaveLength(3)
   })
 
@@ -134,7 +136,7 @@ describe("a 429", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.response.status).toBe(429)
+    expect(error?.response?.status).toBe(429)
     expect(attempts).toHaveLength(1)
   })
 })
@@ -162,7 +164,7 @@ describe("a 5xx", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.response.status).toBe(500)
+    expect(error?.response?.status).toBe(500)
     expect(attempts).toHaveLength(3)
   })
 
@@ -187,7 +189,7 @@ describe("a client error", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.response.status).toBeGreaterThanOrEqual(400)
+    expect(error?.response?.status).toBeGreaterThanOrEqual(400)
     expect(attempts).toHaveLength(1)
     expect(reports).toEqual([])
   })
@@ -252,7 +254,7 @@ describe("an expiring session", () => {
 
     const { error } = await settle(apiCall(url))
 
-    expect(error.response.status).toBe(401)
+    expect(error?.response?.status).toBe(401)
     expect(tokenRequests).toHaveLength(1)
     expect(sentTokens).toHaveLength(2)
   })
@@ -350,7 +352,7 @@ describe("an expiring session", () => {
 
 describe("preparing a Bugsnag report", () => {
   const eventFor = (originalError: unknown) =>
-    ({ originalError, request: { url: "https://exportify.app/?access_token=SECRET" } }) as any
+    ({ originalError, request: { url: "https://exportify.app/?access_token=SECRET" } }) as unknown as BugsnagEvent
 
   test("redacts the page URL and groups axios errors by message", () => {
     const event = eventFor({ isAxiosError: true, message: "Network Error" })
diff --git a/src/helpers.ts b/src/helpers.ts
index 87db28fa..cfc7632a 100644
--- a/src/helpers.ts
+++ b/src/helpers.ts
@@ -1,8 +1,9 @@
-import Bugsnag, { Event } from "@bugsnag/js"
-import axios from "axios"
+import Bugsnag, { Event, NotifiableError } from "@bugsnag/js"
+import axios, { AxiosError, AxiosResponse } from "axios"
 import Bottleneck from "bottleneck"
 import { clearAccessToken, currentAccessToken, loadAccessToken, refreshAccessToken, SessionExpiredError } from "./auth"
 import { redirectTo } from "./navigation"
+import { ErrorResponse } from "./spotify"
 
 const REQUEST_RETRY_BUFFER = 1000
 const MAX_RATE_LIMIT_RETRIES = 2 // 3 attempts in total
@@ -67,26 +68,26 @@ limiter.on("failed", async (error, jobInfo) => {
   }
 })
 
-function get(url: string, accessToken: string | null) {
-  return axios.get(url, { headers: { 'Authorization': 'Bearer ' + accessToken } })
+function get<T>(url: string, accessToken: string | null) {
+  return axios.get<T>(url, { headers: { 'Authorization': 'Bearer ' + accessToken } })
 }
 
 // A 401 gets one retry with a renewed token, which another request or tab may already have fetched
-async function request(_queuedAs: number, url: string) {
+async function request<T>(_queuedAs: number, url: string): Promise<AxiosResponse<T>> {
   const accessToken = await currentAccessToken()
 
   try {
-    return await get(url, accessToken)
-  } catch (error: any) {
-    if (error.response?.status !== 401) { throw error }
+    return await get<T>(url, accessToken)
+  } catch (error) {
+    if (!axios.isAxiosError(error) || error.response?.status !== 401) { throw error }
 
     const storedToken = loadAccessToken()
-    return get(url, storedToken !== accessToken ? storedToken : await refreshAccessToken())
+    return get<T>(url, storedToken !== accessToken ? storedToken : await refreshAccessToken())
   }
 }
 
-export function apiCall(url: string) {
-  return limiter.schedule(request, ++requestsQueued, url)
+export function apiCall<T>(url: string) {
+  return limiter.schedule(request<T>, ++requestsQueued, url)
 }
 
 export type ApiError = {
@@ -95,20 +96,20 @@ export type ApiError = {
   detail?: string // Spotify's own reason, untranslated
 }
 
-function describeApiError(error: any): ApiError {
+function describeApiError(error: AxiosError<Partial<ErrorResponse>>): ApiError {
   const status: number | undefined = error.response?.status
 
   if (status === undefined) { return { kind: "network" } }
   if (status === 429) { return { kind: "rate_limited", status } }
   if (status >= 500) { return { kind: "unavailable", status } }
 
-  return { kind: "refused", status, detail: error.response.data?.error?.message }
+  return { kind: "refused", status, detail: error.response?.data?.error?.message }
 }
 
 // Handles a request that has run out of retries, returning what to tell the user if anything
-export function apiCallErrorHandler(error: any): ApiError | undefined {
-  if (!error?.isAxiosError && !(error instanceof SessionExpiredError)) {
-    Bugsnag.notify(error)
+export function apiCallErrorHandler(error: unknown): ApiError | undefined {
+  if (!axios.isAxiosError<Partial<ErrorResponse>>(error) && !(error instanceof SessionExpiredError)) {
+    Bugsnag.notify(error as NotifiableError)
     return { kind: "unexpected" }
   }
   if (pageUnloading) { return }
diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts
index 0f8a47ae..0ce3b712 100644
--- a/src/mocks/handlers.ts
+++ b/src/mocks/handlers.ts
@@ -3,6 +3,7 @@ import {
   API, apiError, buildAlbum, buildArtist, buildAudioFeatures, buildFullAlbum, buildFullArtist, buildLocalTrack, buildMe,
   buildPage, buildPlaylist, buildPlaylistItem, buildSavedTrack, buildTrack, buildUser, pageAt,
 } from '../test/fixtures/spotify/builders'
+import { Track } from '../spotify'
 
 export const handlerCalled = vi.fn()
 
@@ -41,7 +42,7 @@ const peanutButterBlues = buildAlbum({
   release_date_precision: 'year',
   images: image('306e7640be17c5b3468e6e80'),
 })
-const ghostpoetTrack = (overrides: Record<string, any>) =>
+const ghostpoetTrack = (overrides: Partial<Track>) =>
   buildTrack({ artists: [ghostpoet], album: peanutButterBlues, disc_number: 1, explicit: false, ...overrides })
 const oneTwos = ghostpoetTrack({
   id: '7ATyvp3TmYBmGW7YuC8DJ3',
@@ -72,7 +73,7 @@ const ghostpoetPlaylist = buildPlaylist({
 })
 const playlistsUrl = `${API}/me/playlists`
 export const ghostpoetTracksUrl = `${API}/playlists/4XOGDpHMrVoH33uJEwHWU5/tracks`
-const addedByWatsonbox = (track: object | null, added_at = '2020-11-03T15:19:04Z') =>
+const addedByWatsonbox = (track: Track | null, added_at = '2020-11-03T15:19:04Z') =>
   buildPlaylistItem({ track, added_at, added_by: watsonbox })
 
 export const errorResponse = (status: number, message?: string, headers: Record<string, string> = {}) => () => {
@@ -161,7 +162,7 @@ export const nullTrackHandlers = [
   tracksPage([buildPlaylistItem({ track: null, added_at: '2020-11-08T22:12:50Z', added_by: buildUser({ id: '' }) })]),
 ]
 
-const addedByOtherUser = (track: object) =>
+const addedByOtherUser = (track: Track) =>
   buildPlaylistItem({ track, added_at: '2021-02-24T06:12:40Z', added_by: buildUser({ id: 'u8ins5esg43wtxk4h66o5d1nb' }) })
 
 export const localTrackHandlers = [
diff --git a/src/spotify.ts b/src/spotify.ts
new file mode 100644
index 00000000..fa2eddff
--- /dev/null
+++ b/src/spotify.ts
@@ -0,0 +1,157 @@
+// Spotify Web API responses as the app receives them, modelled on the recorded fixtures in src/test/fixtures/spotify
+
+export interface Paging<T> {
+  href: string
+  items: T[]
+  limit: number
+  next: string | null
+  offset: number
+  previous: string | null
+  total: number
+}
+
+export interface ExternalUrls { spotify?: string }
+
+export interface Image { height: number | null; url: string; width: number | null }
+
+export interface UserReference {
+  external_urls: ExternalUrls
+  href: string
+  id: string
+  type: string
+  uri: string
+}
+
+export interface PublicUser extends UserReference { display_name: string | null }
+
+export interface CurrentUser extends PublicUser {
+  followers: { href: string | null; total: number }
+  images: Image[]
+}
+
+// Episodes in playlists come back track-shaped, with the show as their album and artist and the show's name as the artist type
+export interface SimplifiedArtist {
+  external_urls: ExternalUrls
+  href: string | null
+  id: string | null
+  name: string | null
+  type: string
+  uri: string | null
+}
+
+export interface Artist extends SimplifiedArtist {
+  id: string
+  name: string
+  uri: string
+  followers: { href: string | null; total: number }
+  genres: string[]
+  images: Image[]
+  popularity: number
+}
+
+// Local tracks have no album id, uri, release date or images
+export interface SimplifiedAlbum {
+  album_type: string | null
+  artists: SimplifiedArtist[]
+  available_markets: string[]
+  external_urls: ExternalUrls
+  href: string | null
+  id: string | null
+  images: Image[]
+  name: string
+  release_date: string | null
+  release_date_precision: string | null
+  total_tracks?: number
+  type: string
+  uri: string | null
+}
+
+export interface Album extends SimplifiedAlbum {
+  id: string
+  uri: string
+  copyrights: { text: string; type: string }[]
+  external_ids: { upc?: string; ean?: string; isrc?: string }
+  genres: string[]
+  label: string
+  popularity: number
+}
+
+export interface Track {
+  album: SimplifiedAlbum
+  artists: SimplifiedArtist[]
+  available_markets?: string[]
+  disc_number: number
+  duration_ms: number
+  explicit: boolean
+  external_ids: { isrc?: string; ean?: string; upc?: string; spotify?: string }
+  external_urls: ExternalUrls
+  href: string | null
+  id: string | null
+  is_local: boolean
+  is_playable?: boolean
+  name: string
+  popularity: number
+  preview_url: string | null
+  track_number: number
+  type: string
+  uri: string
+}
+
+// Tracks removed from Spotify come back as a null track
+export interface PlaylistItem {
+  added_at: string
+  added_by: UserReference | null
+  is_local: boolean
+  item: Track | null
+  track: Track | null
+}
+
+export interface SavedTrack {
+  added_at: string
+  track: Track
+}
+
+export interface SimplifiedPlaylist {
+  collaborative: boolean
+  description: string | null
+  external_urls: ExternalUrls
+  href: string
+  id: string
+  images: Image[] | null
+  items: { href: string; total: number }
+  name: string
+  owner: PublicUser
+  public: boolean
+  snapshot_id: string
+  tracks: { href: string; total: number }
+  type: string
+  uri: string
+}
+
+export interface AudioFeatures {
+  acousticness: number
+  analysis_url: string
+  danceability: number
+  duration_ms: number
+  energy: number
+  id: string
+  instrumentalness: number
+  key: number
+  liveness: number
+  loudness: number
+  mode: number
+  speechiness: number
+  tempo: number
+  time_signature: number
+  track_href: string
+  type: string
+  uri: string
+  valence: number
+}
+
+// Ids with no album or audio features, such as a show's or an episode's, come back as null
+export interface ArtistsResponse { artists: Artist[] }
+export interface AlbumsResponse { albums: (Album | null)[] }
+export interface AudioFeaturesResponse { audio_features: (AudioFeatures | null)[] }
+
+export interface ErrorResponse { error: { status: number; message: string } }
diff --git a/src/test/bugsnag.ts b/src/test/bugsnag.ts
index 56704977..751682c0 100644
--- a/src/test/bugsnag.ts
+++ b/src/test/bugsnag.ts
@@ -1,13 +1,13 @@
 import Bugsnag, { Event } from "@bugsnag/js"
 
-export type BugsnagReport = { error: any, groupingHash?: string, metadata: Record<string, unknown> }
+export type BugsnagReport = { error: Error, groupingHash?: string, metadata: Record<string, unknown> }
 
 // Stubs Bugsnag.notify and returns what each report would send after its onError callback
 export function captureBugsnagReports() {
   const reports: BugsnagReport[] = []
 
   vi.spyOn(Bugsnag, "notify").mockImplementation((error, onError) => {
-    const report: BugsnagReport = { error, metadata: {} }
+    const report: BugsnagReport = { error: error as Error, metadata: {} }
     const event = {
       set groupingHash(hash: string) { report.groupingHash = hash },
       addMetadata: (section: string, values: unknown) => { report.metadata[section] = values },
diff --git a/src/test/fixtures/spotify/builders.test.ts b/src/test/fixtures/spotify/builders.test.ts
index c4157d98..6a22689a 100644
--- a/src/test/fixtures/spotify/builders.test.ts
+++ b/src/test/fixtures/spotify/builders.test.ts
@@ -11,6 +11,7 @@ import playlistTracks from './live/playlists-fakeplaylist0000000001-tracks-offse
 import artists from './live/artists-1.json'
 import albums from './live/albums-1.json'
 import audioFeatures from './live/audio-features-1.json'
+import { Paging } from '../../../spotify'
 import page1 from './live/playlists-37i9dQZF1DWYBF1dYDPlHw-tracks-offset-0-limit-100.json'
 import page2 from './live/playlists-37i9dQZF1DWYBF1dYDPlHw-tracks-offset-100-limit-100.json'
 import page3 from './live/playlists-37i9dQZF1DWYBF1dYDPlHw-tracks-offset-200-limit-100.json'
@@ -20,7 +21,7 @@ import error503 from './documented/error-503.json'
 
 const keys = (value: object) => Object.keys(value).sort()
 const withoutLocale = (url: string | null) => url && url.replace(/&locale=[^&]*/, '')
-const pageFields = ({ items, ...page }: any) => ({
+const pageFields = ({ items, ...page }: Paging<unknown>) => ({
   ...page, href: withoutLocale(page.href), next: withoutLocale(page.next), previous: withoutLocale(page.previous),
 })
 
@@ -74,9 +75,9 @@ describe('entity builders', () => {
     const item = buildPlaylistItem({ track: buildTrack({ name: 'Song' }), added_by: buildUser({ id: 'someone' }) })
 
     expect(keys(item)).toEqual(keys(liveItem))
-    expect(keys(item.track)).toEqual(keys(liveItem.track))
+    expect(keys(item.track!)).toEqual(keys(liveItem.track))
     expect(item.item).toEqual(item.track)
-    expect(item.track.name).toBe('Song')
+    expect(item.track!.name).toBe('Song')
     expect(item.added_by).toEqual({
       external_urls: { spotify: 'https://open.spotify.com/user/someone' },
       href: `${API}/users/someone`,
diff --git a/src/test/fixtures/spotify/builders.ts b/src/test/fixtures/spotify/builders.ts
index c5de2e53..13d74f4a 100644
--- a/src/test/fixtures/spotify/builders.ts
+++ b/src/test/fixtures/spotify/builders.ts
@@ -8,50 +8,58 @@ import audioFeatures from './live/audio-features-1.json'
 import error401 from './documented/error-401.json'
 import error429 from './documented/error-429.json'
 import error503 from './documented/error-503.json'
-
-type Json = Record<string, any>
+import {
+  Album, Artist, AudioFeatures, CurrentUser, Paging, PlaylistItem, PublicUser, SavedTrack, SimplifiedAlbum, SimplifiedArtist,
+  SimplifiedPlaylist, Track, UserReference,
+} from '../../../spotify'
 
 export const API = 'https://api.spotify.com/v1'
 
-const savedTrackTemplate = savedTracks.body.items[0]
-const playlistTemplate = playlists.body.items.find(playlist => playlist.owner.id === me.body.id)!
-const playlistItemTemplate = playlistTracks.body.items[0]
+// Typing the templates checks the response types against the recorded fixtures
+const meTemplate: CurrentUser = me.body
+const savedTrackTemplate: SavedTrack = savedTracks.body.items[0]
+const playlistTemplate: SimplifiedPlaylist = playlists.body.items.find(playlist => playlist.owner.id === me.body.id)!
+const playlistItemTemplate: PlaylistItem & { added_by: UserReference, track: Track } = playlistTracks.body.items[0]
+const fullArtistTemplate: Artist = artists.body.artists[0]
+const fullAlbumTemplate: Album = albums.body.albums[0]
+const audioFeaturesTemplate: AudioFeatures = audioFeatures.body.audio_features[0]
 const documentedErrors = [error401, error429, error503]
 
-const links = (type: string) => (id: string) => ({
+const links = (type: string) => (id: string | null) => ({
   external_urls: { spotify: `https://open.spotify.com/${type}/${id}` },
   href: `${API}/${type}s/${id}`,
   uri: `spotify:${type}:${id}`,
 })
 
-const build = (template: Json, overrides: Json, derive: (id: string) => Json): Json =>
+// Typed as the template refined by what's derived and overridden, so a built id or uri is known not to be null
+const build = <T extends { id: string | null }, D extends object, O extends Partial<T>>(template: T, overrides: O, derive: (id: string | null) => D): T & D & O =>
   ({ ...template, ...derive(overrides.id ?? template.id), ...overrides })
 
 // Keeps exactly the template's keys, so a value takes the live shape of the context it's used in
-const conform = (template: Json, value: Json) =>
-  Object.fromEntries(Object.keys(template).map(key => [key, key in value ? value[key] : template[key]]))
+const conform = <T extends object>(template: T, value: object): T =>
+  Object.fromEntries(Object.keys(template).map(key => [key, (key in value ? value : template)[key as keyof object]])) as T
 
-export const buildMe = (overrides: Json = {}) => build(me.body, overrides, links('user'))
+export const buildMe = <O extends Partial<CurrentUser>>(overrides = {} as O) => build(meTemplate, overrides, links('user'))
 
-export const buildUser = (overrides: Json = {}) =>
+export const buildUser = <O extends Partial<PublicUser>>(overrides = {} as O) =>
   build({ ...playlistTemplate.owner, display_name: overrides.id ?? playlistTemplate.owner.display_name }, overrides, links('user'))
 
-export const buildArtist = (overrides: Json = {}) => build(savedTrackTemplate.track.artists[0], overrides, links('artist'))
+export const buildArtist = <O extends Partial<SimplifiedArtist>>(overrides = {} as O) => build(savedTrackTemplate.track.artists[0], overrides, links('artist'))
 
-export const buildFullArtist = (overrides: Json = {}) => build(artists.body.artists[0], overrides, links('artist'))
+export const buildFullArtist = <O extends Partial<Artist>>(overrides = {} as O) => build(fullArtistTemplate, overrides, links('artist'))
 
-export const buildAlbum = (overrides: Json = {}) => build(savedTrackTemplate.track.album, overrides, links('album'))
+export const buildAlbum = <O extends Partial<SimplifiedAlbum>>(overrides = {} as O) => build(savedTrackTemplate.track.album, overrides, links('album'))
 
-export const buildFullAlbum = (overrides: Json = {}) => build(albums.body.albums[0], overrides, id => ({
+export const buildFullAlbum = <O extends Partial<Album>>(overrides = {} as O) => build(fullAlbumTemplate, overrides, id => ({
   ...links('album')(id),
   tracks: buildPage([], { url: `${API}/albums/${id}/tracks`, limit: 50 }),
 }))
 
-export const buildTrack = (overrides: Json = {}) => build(savedTrackTemplate.track, overrides, links('track'))
+export const buildTrack = <O extends Partial<Track>>(overrides = {} as O) => build(savedTrackTemplate.track, overrides, links('track'))
 
 const plusEncode = (value: string) => encodeURIComponent(value).replace(/%20/g, '+')
 
-export function buildLocalTrack({ name, artist, album, duration_ms }: { name: string; artist: string; album: string; duration_ms: number }) {
+export function buildLocalTrack({ name, artist, album, duration_ms }: { name: string; artist: string; album: string; duration_ms: number }): Track {
   return {
     album: {
       album_type: null, artists: [], available_markets: [], external_urls: {}, href: null, id: null, images: [],
@@ -76,10 +84,12 @@ export function buildLocalTrack({ name, artist, album, duration_ms }: { name: st
   }
 }
 
-export const buildSavedTrack = (overrides: Json = {}) =>
+export const buildSavedTrack = (overrides: Partial<SavedTrack> = {}): SavedTrack =>
   ({ added_at: savedTrackTemplate.added_at, track: buildTrack(), ...overrides })
 
-export function buildPlaylistItem({ track = buildTrack(), added_by = buildUser(), ...overrides }: Json = {}): Json {
+type PlaylistItemOverrides = Partial<Omit<PlaylistItem, 'added_by'>> & { added_by?: UserReference }
+
+export function buildPlaylistItem({ track = buildTrack(), added_by = buildUser(), ...overrides }: PlaylistItemOverrides = {}): PlaylistItem {
   const playlistTrack = track && conform(playlistItemTemplate.track, track)
 
   return {
@@ -92,7 +102,9 @@ export function buildPlaylistItem({ track = buildTrack(), added_by = buildUser()
   }
 }
 
-export function buildPlaylist({ tracks, ...overrides }: Json = {}) {
+type PlaylistOverrides = Partial<Omit<SimplifiedPlaylist, 'tracks'>> & { tracks?: { total: number } }
+
+export function buildPlaylist({ tracks, ...overrides }: PlaylistOverrides = {}) {
   const total = tracks?.total ?? playlistTemplate.tracks.total
 
   return build(playlistTemplate, overrides, id => ({
@@ -102,7 +114,7 @@ export function buildPlaylist({ tracks, ...overrides }: Json = {}) {
   }))
 }
 
-export const buildAudioFeatures = (overrides: Json = {}) => build(audioFeatures.body.audio_features[0], overrides, id => ({
+export const buildAudioFeatures = <O extends Partial<AudioFeatures>>(overrides = {} as O) => build(audioFeaturesTemplate, overrides, id => ({
   uri: `spotify:track:${id}`,
   track_href: `${API}/tracks/${id}`,
   analysis_url: `${API}/audio-analysis/${id}`,
@@ -110,7 +122,7 @@ export const buildAudioFeatures = (overrides: Json = {}) => build(audioFeatures.
 
 interface PageOptions { url: string; offset?: number; limit?: number; total?: number }
 
-export function buildPage<T>(items: T[], { url, offset = 0, limit = 20, total = items.length }: PageOptions) {
+export function buildPage<T>(items: T[], { url, offset = 0, limit = 20, total = items.length }: PageOptions): Paging<T> {
   const pageUrl = (pageOffset: number) => `${url}?offset=${pageOffset}&limit=${limit}`
 
   return {
diff --git a/src/test/fixtures/spotify/scrub.ts b/src/test/fixtures/spotify/scrub.ts
index 5d7db481..b1cb151b 100644
--- a/src/test/fixtures/spotify/scrub.ts
+++ b/src/test/fixtures/spotify/scrub.ts
@@ -1,6 +1,10 @@
 import { createHash } from 'crypto'
 
-export interface RawResponse { url: string; status: number; headers: Record<string, string>; body: any }
+// Captures hold whatever any endpoint returned, so their bodies stay untyped
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type RawBody = any
+
+export interface RawResponse { url: string; status: number; headers: Record<string, string>; body: RawBody }
 export interface Fixture extends RawResponse { method: 'GET' }
 export interface IndexEntry { file: string; method: 'GET'; url: string; status: number; note?: string }
 export interface PrivateValueHash { label: string; length: number; sha256: string }
@@ -44,7 +48,7 @@ function privateValues(raw: RawResponse[]): PrivateValue[] {
   ].filter(({ value }) => value)
 }
 
-function mapStrings(value: any, fn: (s: string) => string): any {
+function mapStrings(value: RawBody, fn: (s: string) => string): RawBody {
   if (typeof value === 'string') return fn(value)
   if (Array.isArray(value)) return value.map(item => mapStrings(item, fn))
   if (value && typeof value === 'object') {
@@ -53,7 +57,7 @@ function mapStrings(value: any, fn: (s: string) => string): any {
   return value
 }
 
-function trimMarkets(value: any): any {
+function trimMarkets(value: RawBody): RawBody {
   if (Array.isArray(value)) return value.map(trimMarkets)
   if (value && typeof value === 'object') {
     return Object.fromEntries(Object.entries(value).map(([key, child]) =>

From b7203b5d06774eef4388a9c8cf723befa1074327 Mon Sep 17 00:00:00 2001
From: Howard Wilson <howard@watsonbox.net>
Date: Tue, 20 Oct 2026 19:21:03 +0200
Subject: [PATCH 2/2] Allow a null public flag on playlists

Spotify documents playlist public as nullable, which @types/spotify-api models and the hand-written types didn't.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 src/components/PlaylistRow.tsx | 2 +-
 src/spotify.ts                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/PlaylistRow.tsx b/src/components/PlaylistRow.tsx
index acad48a9..10efd3f6 100644
--- a/src/components/PlaylistRow.tsx
+++ b/src/components/PlaylistRow.tsx
@@ -32,7 +32,7 @@ class PlaylistRow extends React.Component<PlaylistRowProps> {
     )
   }
 
-  renderTickCross(condition?: boolean) {
+  renderTickCross(condition?: boolean | null) {
     if (condition) {
       return <FontAwesomeIcon icon={['far', 'check-circle']} size="sm" />
     } else {
diff --git a/src/spotify.ts b/src/spotify.ts
index fa2eddff..04959a9a 100644
--- a/src/spotify.ts
+++ b/src/spotify.ts
@@ -121,7 +121,7 @@ export interface SimplifiedPlaylist {
   items: { href: string; total: number }
   name: string
   owner: PublicUser
-  public: boolean
+  public: boolean | null
   snapshot_id: string
   tracks: { href: string; total: number }
   type: string