treewide: fix TypeScript type errors in API client

- Update api-client types to match server responses (null vs undefined)
- Add proper typed route helpers for Vote, File, Task, Organization, Channel
- Fix unwrapResponse to handle Eden Treaty's unknown data type
- Fix SignInForm constant binding error (use value instead of bind:value)
- Use unwrapResponse consistently across components

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <[email protected]>

Author: aster-void

CLAUDE.md

@@ -38,11 +38,11 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 ## Import Aliases
 
-| Alias | Path |
-|-------|------|
-| `@` | `src/` |
+| Alias         | Path              |
+| ------------- | ----------------- |
+| `@`           | `src/`            |
 | `$components` | `src/components/` |
-| `@apps/{pkg}` | `apps/{pkg}/` |
+| `@apps/{pkg}` | `apps/{pkg}/`     |
 
 </architecture>
 
@@ -80,10 +80,10 @@ import type { App } from "@apps/server";
 
 const client = treaty<App>("http://localhost:8080");
 
-await client.products.get();                              // GET
-await client.products["123"].get();                       // Dynamic param
-await client.products.get({ query: { category: "foo" }}); // Query
-await client.products.post({ name: "bar", price: 100 });  // POST
+await client.products.get(); // GET
+await client.products["123"].get(); // Dynamic param
+await client.products.get({ query: { category: "foo" } }); // Query
+await client.products.post({ name: "bar", price: 100 }); // POST
 ```
 
 </framework-elysia>
@@ -117,8 +117,8 @@ UI [.svelte] → controller [.svelte.ts] → processor [.svelte.ts] → utility
 
 毎回の作業前、タスクの種類に応じて `docs/skills/` 内の該当ドキュメントを読む。
 
-| Skill | File | Usage |
-|-------|------|-------|
+| Skill     | File                       | Usage                |
+| --------- | -------------------------- | -------------------- |
 | UI Design | `docs/skills/ui-design.md` | UI実装、デザイン判断 |
 
 </skills>

apps/api-client/src/route-helpers.ts

@@ -1,60 +1,47 @@
 import type { ApiClient } from "./index.ts";
 import type {
-  DynamicRoute,
+  ChannelRoute,
+  FileRoute,
   MessagesRoute,
   OrganizationRoute,
+  TaskRoute,
+  VoteRoute,
 } from "./route-types.ts";
 
 /**
  * Helper functions for type-safe dynamic route access.
  * Eden Treaty uses Proxy to enable dynamic route access at runtime.
- * The functions use explicit return type annotations instead of type assertions.
  */
 
-export function getOrganization<T extends string>(
+export function getOrganization(
   client: ApiClient,
-  id: T,
+  id: string,
 ): OrganizationRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.organizations[id];
 }
 
-export function getChannel<T extends string>(
-  client: ApiClient,
-  id: T,
-): DynamicRoute<unknown> {
+export function getChannel(client: ApiClient, id: string): ChannelRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.channels[id];
 }
 
-export function getMessage<T extends string>(
-  client: ApiClient,
-  id: T,
-): MessagesRoute {
+export function getMessage(client: ApiClient, id: string): MessagesRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.messages[id];
 }
 
-export function getVote<T extends string>(
-  client: ApiClient,
-  id: T,
-): DynamicRoute<unknown> {
+export function getVote(client: ApiClient, id: string): VoteRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.votes[id];
 }
 
-export function getTask<T extends string>(
-  client: ApiClient,
-  id: T,
-): DynamicRoute<unknown> {
+export function getTask(client: ApiClient, id: string): TaskRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.tasks[id];
 }
 
-export function getFile<T extends string>(
-  client: ApiClient,
-  id: T,
-): DynamicRoute<unknown> {
+export function getFile(client: ApiClient, id: string): FileRoute {
   // @ts-expect-error - Eden Treaty Proxy allows dynamic property access
   return client.files[id];
 }

apps/api-client/src/route-types.ts

@@ -3,62 +3,60 @@
  * These types describe the structure of dynamically accessed routes.
  */
 
+import type {
+  Channel,
+  File,
+  Organization,
+  Reaction,
+  Task,
+  Vote,
+} from "./types.ts";
+
+type ApiResponse<T> = Promise<{
+  data?: T | { message: string } | null;
+  error?: { status: unknown; value: unknown } | null;
+}>;
+
 export type DynamicRoute<T> = {
-  get: () => Promise<{ data?: T; error?: { status: number; value: unknown } }>;
-  patch: (
-    body?: Partial<T>,
-  ) => Promise<{ data?: T; error?: { status: number; value: unknown } }>;
-  delete: () => Promise<{
-    data?: { success: boolean };
-    error?: { status: number; value: unknown };
-  }>;
+  get: () => ApiResponse<T>;
+  patch: (body?: Partial<T>) => ApiResponse<T>;
+  delete: () => ApiResponse<{ success: boolean }>;
+};
+
+export type VoteRoute = DynamicRoute<Vote> & {
   cast?: {
-    post: (body: {
-      votedOptions: number[];
-    }) => Promise<{
-      data?: unknown;
-      error?: { status: number; value: unknown };
-    }>;
+    post: (body: { votedOptions: number[] }) => ApiResponse<Vote>;
   };
 };
 
+export type FileRoute = DynamicRoute<File>;
+
+export type TaskRoute = DynamicRoute<Task>;
+
 export type OrganizationMembersRoute = {
-  get: () => Promise<{
-    data?: unknown;
-    error?: { status: number; value: unknown };
-  }>;
-  post: (body: {
-    userId: string;
-    permission: string;
-  }) => Promise<{ data?: unknown; error?: { status: number; value: unknown } }>;
+  get: () => ApiResponse<unknown>;
+  post: (body: { userId: string; permission: string }) => ApiResponse<unknown>;
 } & {
   [userId: string]: {
-    delete: () => Promise<{
-      data?: unknown;
-      error?: { status: number; value: unknown };
-    }>;
+    delete: () => ApiResponse<unknown>;
   };
 };
 
-export type OrganizationRoute = DynamicRoute<unknown> & {
+export type OrganizationRoute = DynamicRoute<Organization> & {
   members: OrganizationMembersRoute;
 };
 
+export type ChannelRoute = DynamicRoute<Channel>;
+
 export type MessageReactionsRoute = {
-  get: () => Promise<{
-    data?: unknown;
-    error?: { status: number; value: unknown };
-  }>;
-  post: (body: {
-    emoji: string;
-  }) => Promise<{ data?: unknown; error?: { status: number; value: unknown } }>;
+  get: () => ApiResponse<Reaction[]>;
+  post: (body: { emoji: string }) => ApiResponse<Reaction>;
 } & {
-  [emoji: string]: {
-    delete: () => Promise<{
-      data?: unknown;
-      error?: { status: number; value: unknown };
-    }>;
-  };
+  [emoji: string]:
+    | {
+        delete: () => ApiResponse<{ success: boolean }>;
+      }
+    | undefined;
 };
 
 export type MessagesRoute = {

apps/api-client/src/types.ts

@@ -2,29 +2,29 @@
 
 export interface User {
   id: string;
-  email: string;
-  name?: string;
-  emailVerified?: Date;
-  image?: string;
+  email?: string | null;
+  name?: string | null;
+  emailVerified?: Date | null;
+  image?: string | null;
   createdAt: Date;
   updatedAt: Date;
 }
 
 export interface Organization {
   id: string;
   name: string;
-  description?: string;
+  description?: string | null;
   ownerId: string;
   createdAt: Date;
   updatedAt: Date;
-  permission?: string;
-  role?: string;
+  permission?: "admin" | "member" | "visitor";
+  role?: string | null;
 }
 
 export interface Channel {
   id: string;
   name: string;
-  description?: string;
+  description?: string | null;
   organizationId: string;
   createdAt: Date;
   updatedAt: Date;
@@ -36,8 +36,8 @@ export interface Message {
   content: string;
   author: string;
   userId: string;
-  parentId?: string;
-  voteId?: string;
+  parentId?: string | null;
+  voteId?: string | null;
   createdAt: Date;
   updatedAt: Date;
   // Extended fields (may be populated by joins or separate queries)

apps/desktop/src/components/chat/Personalization.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import type { User } from "@apps/api-client";
-  import { getApiClient, useQuery } from "@/lib/api.svelte";
+  import { getApiClient, unwrapResponse, useQuery } from "@/lib/api.svelte";
 
   // organizationId not used in this component currently
   // const { organizationId }: { organizationId: string } = $props();
@@ -9,17 +9,11 @@
 
   const identity = useQuery<User>(async () => {
     const res = await api.users.me.get();
-    if (!res.data) {
-      throw new Error("No user data returned");
-    }
-    return res.data;
+    return unwrapResponse<User>(res);
   });
   const personalization = useQuery<User>(async () => {
     const res = await api.users.me.get();
-    if (!res.data) {
-      throw new Error("No user data returned");
-    }
-    return res.data;
+    return unwrapResponse<User>(res);
   }); // TODO: Replace with actual personalization endpoint
   let iconURL = $state<string | null>("");
   let imageURL = $derived(iconURL || identity.data?.image);

apps/desktop/src/components/chat/ReactionButtons.svelte

@@ -38,7 +38,11 @@
   const removeReaction = useMutation(
     async ({ messageId: mid, emoji }: { messageId: string; emoji: string }) => {
       const messageRoute = getMessage(api, mid);
-      const response = await messageRoute.reactions[emoji].delete();
+      const emojiRoute = messageRoute.reactions[emoji];
+      if (!emojiRoute) {
+        throw new Error(`Reaction route for ${emoji} not found`);
+      }
+      const response = await emojiRoute.delete();
       return unwrapResponse(response);
     },
   );

apps/desktop/src/components/chat/messageInputApi.svelte.ts

@@ -38,15 +38,16 @@ export class MessageInputApi {
    * Returns undefined if creation fails.
    */
   async createVote(vote: Vote): Promise<string | undefined> {
-    const voteResponse = await this.api.votes.post({
-      title: vote.title,
-      maxVotes: vote.maxVotes,
-      voteOptions: vote.voteOptions,
-    });
-
-    if (!voteResponse.error && voteResponse.data) {
-      return voteResponse.data.id;
+    try {
+      const voteResponse = await this.api.votes.post({
+        title: vote.title,
+        maxVotes: vote.maxVotes,
+        voteOptions: vote.voteOptions,
+      });
+      const data = unwrapResponse<{ id: string }>(voteResponse);
+      return data.id;
+    } catch {
+      return undefined;
     }
-    return undefined;
   }
 }

apps/desktop/src/components/chat/messageList.controller.svelte.ts

@@ -27,7 +27,9 @@ export class MessageListController {
   reactionPaletteVisibleFor = $state<string | null>(null);
 
   // Mutations
-  addReaction: ReturnType<typeof useMutation>;
+  addReaction: ReturnType<
+    typeof useMutation<{ messageId: string; emoji: string }, unknown>
+  >;
 
   constructor(props: () => { organizationId: string; channelId: string }) {
     const api = getApiClient();

apps/desktop/src/features/files/upload/uploader.svelte.ts

@@ -1,4 +1,4 @@
-import { getApiClient } from "@/lib/api.svelte";
+import { getApiClient, unwrapResponse } from "@/lib/api.svelte";
 
 export const MAX_FILES = 10;
 // constants
@@ -75,35 +75,22 @@ export class FileUploader {
   }
 
   private async uploadFile(file: File): Promise<UploadedFile> {
-    // For now, create a simple file upload directly via the API
-    // In a real implementation, this would use a proper storage service
     const response = await this.api.files.post({
-      storageId: `temp-${Date.now()}-${Math.random()}`, // Temporary storage ID
+      storageId: `temp-${Date.now()}-${Math.random()}`,
       filename: file.name,
       originalFilename: file.name,
       mimeType: file.type,
       size: file.size,
       organizationId: this.organizationId,
     });
 
-    if (response.error) {
-      throw new Error(
-        typeof response.error.value === "string"
-          ? response.error.value
-          : JSON.stringify(response.error.value),
-      );
-    }
-
-    if (!response.data) {
-      throw new Error("No file data returned");
-    }
-
+    const data = unwrapResponse<UploadedFile>(response);
     return {
-      id: response.data.id,
-      filename: response.data.filename,
-      originalFilename: response.data.originalFilename,
-      mimeType: response.data.mimeType,
-      size: response.data.size,
+      id: data.id,
+      filename: data.filename,
+      originalFilename: data.originalFilename,
+      mimeType: data.mimeType,
+      size: data.size,
     };
   }
 }