買うものリスト（材料新規追加）の動作確認

frontend/src/constants/errorMessages.ts

@@ -21,3 +21,11 @@ export const TASK_ERRORS = {
   UPDATE_FAILED: 'タスクの更新に失敗しました',
   DELETE_FAILED: 'タスクの削除に失敗しました',
 };
+
+// 買うものリスト関連のエラーメッセージ
+export const TOBUY_ERRORS = {
+  FETCH_FAILED: '買うものリストの取得に失敗しました',
+  CREATE_FAILED: '買うものリストの作成に失敗しました',
+  UPDATE_FAILED: '買うものリストの更新に失敗しました',
+  DELETE_FAILED: '買うものリストの削除に失敗しました',
+};

frontend/src/pages/TaskListPage.tsx

@@ -146,7 +146,7 @@ const TaskListPage: React.FC = () => {
       <div style={{ border: '3px solid black', borderRadius: '8px', backgroundColor: '#add8e6', height: 'auto', padding: '20px' }}>
         <List>
           {/* タスク一覧をマップして各タスクをリストアイテムとして表示 */}
-          {tobuys.map((tobuy) => (
+          {tobuys && tobuys.map((tobuy) => (
             <ListItem
               key={tobuy.tobuy_id}
               sx={{

frontend/src/services/api.ts

@@ -4,7 +4,7 @@
  * 認証、タスク管理などの機能を提供
  */
 import { LoginCredentials, RegisterCredentials, AuthResponse, Task, ToBuy, Stuff, Stock } from '../types/types';
-import { AUTH_ERRORS, TASK_ERRORS } from '../constants/errorMessages';
+import { AUTH_ERRORS, TASK_ERRORS, TOBUY_ERRORS } from '../constants/errorMessages';
 
 // APIのベースURL - 環境変数から取得するか、デフォルト値を使用
 const API_BASE_URL = process.env.REACT_APP_API_BASE_URL || 'http://localhost:8080';
@@ -93,34 +93,35 @@ export const toBuyApi = {
    * @returns 買うものリスト一覧
    */
   getToBuys: async (): Promise<{ "tobuy_array": ToBuy[] }> => {
-    // const response = await fetch(`${API_BASE_URL}/api/tobuy/get`, {
-    //   headers: getHeaders(), // 認証トークンを含むヘッダー
-    // });
-
-    // if (!response.ok) {
-    //   throw new Error(TASK_ERRORS.FETCH_FAILED);
-    // }
-
-    // return response.json();
+    const response = await fetch(`${API_BASE_URL}/api/tobuy/get`, {
+      headers: getHeaders(), // 認証トークンを含むヘッダー
+    });
 
-    return {
-      "tobuy_array": [
-        {
-          "tobuy_id": 1,
-          "stuff_id": 2,
-          "stuff_name": "じゃがいも",
-          "amount": 3,
-          "shop": "shopXXX"
-        },
-        {
-          "tobuy_id": 2,
-          "stuff_id": 5,
-          "stuff_name": "にんじん",
-          "amount": 1
-        }
-      ]
+    if (!response.ok) {
+      throw new Error(TOBUY_ERRORS.FETCH_FAILED);
     }
 
+    const tobuy_array = await response.json();
+    return {tobuy_array};
+
+    // return {
+    //   "tobuy_array": [
+    //     {
+    //       "tobuy_id": 1,
+    //       "stuff_id": 2,
+    //       "stuff_name": "じゃがいも",
+    //       "amount": 3,
+    //       "shop": "shopXXX"
+    //     },
+    //     {
+    //       "tobuy_id": 2,
+    //       "stuff_id": 5,
+    //       "stuff_name": "にんじん",
+    //       "amount": 1
+    //     }
+    //   ]
+    // }
+
   },
 
   /**
@@ -129,24 +130,25 @@ export const toBuyApi = {
    * @returns 作成された材料情報
    */
   addToBuy: async (tobuy: Omit<ToBuy, 'stuff_id' | 'tobuy_id'> & { stuff_id: number | null, category: string }): Promise<any> => {
-    // const response = await fetch(`${API_BASE_URL}/api/tasks`, {
-    //   method: 'POST',
-    //   headers: getHeaders(),
-    //   body: JSON.stringify(tobuy),
-    // });
+    const response = await fetch(`${API_BASE_URL}/api/tobuy/add`, {
+      method: 'POST',
+      headers: getHeaders(),
+      body: JSON.stringify(tobuy),
+    });
 
-    // if (!response.ok) {
-    //   throw new Error(TASK_ERRORS.CREATE_FAILED);
-    // }
+    if (!response.ok) {
+      throw new Error(TOBUY_ERRORS.CREATE_FAILED);
+    }
 
     // return response.json();
+    return {result: true}
 
-    return {
-      "result": true,
-      "tobuy_id": 1,
-      "stuff_id": 6,
-      "message": "追加に成功しました",
-    }
+    // return {
+    //   "result": true,
+    //   "tobuy_id": 1,
+    //   "stuff_id": 6,
+    //   "message": "追加に成功しました",
+    // }
 
   },
 
@@ -155,19 +157,21 @@ export const toBuyApi = {
    * @param id 削除対象の買うものリストID
    */
   deleteToBuy: async (tobuy_id: number): Promise<{ result: boolean }> => {
-    // const response = await fetch(`${API_BASE_URL}/api/tobuy/delete`, {
-    //   method: 'DELETE',
-    //   headers: getHeaders(),
-    //   body: JSON.stringify({tobuy_id}),
-    // });
-
-    // if (!response.ok) {
-    //   throw new Error(TASK_ERRORS.DELETE_FAILED);
-    // }
+    const response = await fetch(`${API_BASE_URL}/api/tobuy/delete`, {
+      method: 'DELETE',
+      headers: getHeaders(),
+      body: JSON.stringify({tobuy_id}),
+    });
 
-    return {
-      "result": true
+    if (!response.ok) {
+      throw new Error(TOBUY_ERRORS.DELETE_FAILED);
     }
+
+    return response.json()
+
+    // return {
+    //   "result": true
+    // }
   },
 }