fix client errors

Author: bradcypert

client/src/components/auth/login-form.ts

@@ -208,7 +208,7 @@ export class LoginForm extends LitElement {
     }
   `;
 
-  private handleServerChange(event: CustomEvent) {
+  private handleServerChange(_event: CustomEvent) {
     // Refresh app state when server changes
     this.appStateService.refreshAfterServerChange();
   }

client/src/components/dust-app.ts

@@ -46,8 +46,7 @@ export class DustApp extends LitElement {
   @state()
   private currentGenreId: number | null = null;
 
-  @state()
-  private currentServerId: string | null = null;
+  // Removed unused state variable
 
   static styles = css`
     :host {
@@ -146,9 +145,8 @@ export class DustApp extends LitElement {
     window.addEventListener("popstate", this.handleNavigation);
     this.handleNavigation();
 
-    // Initialize current server ID
-    const activeServer = serverManager.getActiveServer();
-    this.currentServerId = activeServer?.id || null;
+    // Initialize server connection
+    serverManager.getActiveServer();
   }
 
   disconnectedCallback() {
@@ -216,9 +214,7 @@ export class DustApp extends LitElement {
   private handleServerChange(event: CustomEvent) {
     console.log('Server changed:', event.detail.server);
 
-    // Update current server ID to trigger re-renders
-    const newServer = event.detail.server;
-    this.currentServerId = newServer.id;
+    // Server changed - trigger re-render via app state refresh
 
     // Refresh the app state to load data from the new server
     this.appStateService.refreshAfterServerChange();
@@ -248,7 +244,7 @@ export class DustApp extends LitElement {
           @book-select=${this.handleBookSelect}
           @author-select=${this.handleAuthorSelect}
           @genre-select=${this.handleGenreSelect}
-          @navigate-back=${(e: CustomEvent) => {
+          @navigate-back=${(_e: CustomEvent) => {
             // Navigate back based on current context
             if (this.currentPage === "author-detail") {
               this.navigateTo("authors");

client/src/components/layout/app-header.ts

@@ -201,7 +201,7 @@ export class AppHeader extends LitElement {
           <div
             class="user-avatar"
             @click=${this.handleProfileClick}
-            title=${this.user?.display_name || "Profile"}
+            title=${this.user?.displayName || "Profile"}
           >
             ${this.getUserInitials()}
           </div>

client/src/components/pages/authors-page.ts

@@ -7,7 +7,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { consume } from '@lit/context';
 
 import { appStateContext, AppStateService } from '../../services/app-state.js';
-import type { Book } from '../../types/app.js';
+// Unused import removed
 
 interface Author {
   id: number;

client/src/components/pages/completed-reading-page.ts

@@ -7,6 +7,7 @@ import { customElement, state } from 'lit/decorators.js';
 import { consume } from '@lit/context';
 
 import { appStateContext, AppStateService } from '../../services/app-state.js';
+import { apiService } from '../../services/api.js';
 import type { Book, ReadingProgress } from '../../types/app.js';
 
 @customElement('completed-reading-page')
@@ -258,7 +259,7 @@ export class CompletedReadingPage extends LitElement {
   private async loadCompletedBooks() {
     this.isLoading = true;
     try {
-      const response = await this.appStateService.api.getCompletedBooks();
+      const response = await apiService.getCompletedBooks();
       this.completedBooks = response.books;
     } catch (error) {
       console.error('Failed to load completed books:', error);

client/src/components/pages/currently-reading-page.ts

@@ -7,7 +7,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { consume } from '@lit/context';
 
 import { appStateContext, AppStateService } from '../../services/app-state.js';
-import type { Book } from '../../types/app.js';
+// Unused import removed
 
 interface CurrentlyReadingBook {
   // Reading progress data

client/src/components/pages/library-page.ts

@@ -3,13 +3,13 @@
  */
 
 import { LitElement, html, css } from "lit";
-import { customElement, property, state } from "lit/decorators.js";
+import { customElement, state } from "lit/decorators.js";
 import { consume } from "@lit/context";
 
 import { appStateContext, AppStateService } from "../../services/app-state.js";
 import { serverManager } from "../../services/server-manager.js";
-import type { MultiServerState } from "../../types/server.js";
-import type { Book, AppState } from "../../types/app.js";
+// Unused import removed
+import type { Book } from "../../types/app.js";
 
 @customElement("library-page")
 export class LibraryPage extends LitElement {

client/src/components/pages/series-page.ts

@@ -3,12 +3,11 @@
  */
 
 import { LitElement, html, css } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
+import { customElement } from 'lit/decorators.js';
 
 @customElement('series-page')
 export class SeriesPage extends LitElement {
-  @state()
-  private isLoading = false;
+  // Removed unused state variable
 
   static styles = css`
     :host {

client/src/services/api.ts

@@ -12,7 +12,6 @@ import type {
   CreateUserRequest,
   UpdateUserRequest,
   DashboardStats,
-  ApiResponse
 } from '../types/api.js';
 
 import { serverManager } from './server-manager.js';
@@ -61,9 +60,9 @@ export class ApiService {
     const token = this.getCurrentToken();
 
     const url = `${server.baseUrl}${endpoint}`;
-    const headers: HeadersInit = {
+    const headers: Record<string, string> = {
       'Content-Type': 'application/json',
-      ...options.headers,
+      ...((options.headers as Record<string, string>) || {}),
     };
 
     if (token) {

client/src/services/app-state.ts

@@ -3,7 +3,7 @@
  */
 
 import { createContext } from '@lit/context';
-import type { AppState, User, Book, ReadingProgress, Toast } from '../types/app.js';
+import type { AppState, Book, ReadingProgress, Toast } from '../types/app.js';
 import { apiService, ApiError } from './api.js';
 import { serverManager } from './server-manager.js';
 
@@ -453,7 +453,7 @@ export class AppStateService {
     this.notifyListeners();
 
     // Auto-remove toast after duration
-    if (newToast.duration > 0) {
+    if (newToast.duration && newToast.duration > 0) {
       setTimeout(() => this.removeToast(id), newToast.duration);
     }