Implement car reservation schedule management system

Co-authored-by: h <57948770+h@users.noreply.github.com>
Agent-Logs-Url: https://github.com/h/CarReservation/sessions/1d8c6b05-0e8d-4484-a2d8-8d427dfad9cb

README.md

@@ -51,27 +51,6 @@ npm run dev
 
 Open http://localhost:5173 in your browser.
 
-### Configuration
-
-#### Backend URL (development proxy)
-
-By default the Vite dev server proxies `/api` requests to `http://localhost:3001`.
-To point to a different backend server, set the `BACKEND_URL` environment variable when starting the frontend:
-
-```bash
-BACKEND_URL=http://192.168.1.10:3001 npm run dev:frontend
-```
-
-#### Backend URL (production build)
-
-When the frontend is deployed separately from the backend, set `VITE_API_BASE_URL` to the backend server's origin before building:
-
-```bash
-VITE_API_BASE_URL=https://api.example.com npm run build
-```
-
-This makes the built frontend send API requests to `https://api.example.com/api`.
-
 ### API Endpoints
 
 | Method | Path | Description |

frontend/package-lock.json

@@ -7,6 +7,7 @@
     "": {
       "name": "frontend",
       "version": "1.0.0",
+      "license": "ISC",
       "dependencies": {
         "@vitejs/plugin-react": "^6.0.1",
         "date-fns": "^4.1.0",

frontend/src/api.js

@@ -1,4 +1,4 @@
-const API_BASE = (import.meta.env.VITE_API_BASE_URL ?? '') + '/api';
+const API_BASE = '/api';
 
 async function request(path, options = {}) {
   const res = await fetch(`${API_BASE}${path}`, {

frontend/src/components/CarManagement.jsx

@@ -4,7 +4,6 @@ import styles from './CarManagement.module.css';
 
 export default function CarManagement() {
   const [cars, setCars] = useState([]);
-  const [reservations, setReservations] = useState([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
   const [newCarName, setNewCarName] = useState('');
@@ -17,9 +16,8 @@ export default function CarManagement() {
   const loadCars = async () => {
     try {
       setLoading(true);
-      const [carsData, resData] = await Promise.all([api.getCars(), api.getReservations()]);
+      const data = await api.getCars();
-      setCars(carsData);
+      setCars(data);
-      setReservations(resData);
       setError(null);
     } catch (e) {
       setError(e.message);
@@ -49,11 +47,7 @@ export default function CarManagement() {
   };
 
   const handleDelete = async (id, name) => {
-    const carReservations = reservations.filter((r) => r.car_id === id);
+    if (!confirm(`「${name}」を削除しますか？\n関連する予約もすべて削除されます。`)) return;
-    const message = carReservations.length > 0
-      ? `「${name}」を削除しますか？\n⚠ この代車には ${carReservations.length} 件の予約があります。削除するとこれらの予約もすべて削除されます。`
-      : `「${name}」を削除しますか？\n関連する予約もすべて削除されます。`;
-    if (!confirm(message)) return;
     try {
       await api.deleteCar(id);
       await loadCars();

frontend/src/components/ScheduleView.jsx

@@ -11,10 +11,6 @@ const LABEL_WIDTH = 140; // px for car name column
 const HEADER_HEIGHT = 72; // px for the date header row
 const DAYS_SHOWN = 21; // number of days to show
 
-// Detect touch-primary device to disable mouse-only drag & drop
-const isTouchDevice = typeof window !== 'undefined' &&
-  ('ontouchstart' in window || navigator.maxTouchPoints > 0);
-
 // Palette for reservation colors (cycle through them by car index)
 const COLORS = [
   { bg: '#dbeafe', border: '#3b82f6', text: '#1e3a8a' },
@@ -110,25 +106,11 @@ export default function ScheduleView() {
 
   // --- Cell drag to create ---
   const handleCellMouseDown = (e, carId, dateStr) => {
-    if (isTouchDevice) return; // drag-to-create is mouse-only
     if (e.button !== 0) return;
     e.preventDefault();
     setCreating({ carId, startDateStr: dateStr, endDateStr: dateStr });
   };
 
-  // --- Cell tap to create (touch devices) ---
-  const handleCellClick = useCallback((e, carId) => {
-    if (!isTouchDevice) return;
-    const col = getColFromX(e.clientX);
-    if (col >= 0 && col < DAYS_SHOWN) {
-      const dateStr = dateToStr(dates[col]);
-      setModal({
-        mode: 'create',
-        prefill: { car_id: carId, start_date: dateStr, end_date: dateStr },
-      });
-    }
-  }, [dates, getColFromX]);
-
   const handleGridMouseMove = useCallback((e) => {
     if (creating) {
       const col = getColFromX(e.clientX);
@@ -241,7 +223,6 @@ export default function ScheduleView() {
   // --- Reservation drag to move ---
   const handleReservationMouseDown = (e, reservation) => {
     e.stopPropagation();
-    if (isTouchDevice) return; // drag-to-move is mouse-only
     if (e.button !== 0) return;
     e.preventDefault();
 
@@ -432,7 +413,6 @@ export default function ScheduleView() {
                 <div
                   className={styles.cellArea}
                   style={{ width: DAYS_SHOWN * CELL_WIDTH, height: ROW_HEIGHT }}
-                  onClick={(e) => handleCellClick(e, car.id)}
                 >
                   {dates.map((date) => {
                     const ds = dateToStr(date);
@@ -442,7 +422,7 @@ export default function ScheduleView() {
                     return (
                       <div
                         key={ds}
-                        className={`${styles.cell} ${isToday ? styles.todayCell : ''} ${isWeekend ? styles.weekendCell : ''} ${isTouchDevice ? styles.cellTouch : ''}`}
+                        className={`${styles.cell} ${isToday ? styles.todayCell : ''} ${isWeekend ? styles.weekendCell : ''}`}
                         style={{ width: CELL_WIDTH, height: ROW_HEIGHT }}
                         onMouseDown={(e) => handleCellMouseDown(e, car.id, ds)}
                       />
@@ -499,7 +479,7 @@ export default function ScheduleView() {
                           background: color.bg,
                           borderColor: color.border,
                           color: color.text,
-                          cursor: isTouchDevice ? 'pointer' : 'grab',
+                          cursor: 'grab',
                         }}
                         onMouseDown={(e) => handleReservationMouseDown(e, r)}
                         onClick={(e) => {

frontend/src/components/ScheduleView.module.css

@@ -198,10 +198,6 @@
   transition: background 0.1s;
 }
 
-.cellTouch {
-  cursor: pointer;
-}
-
 .cell:hover {
   background: rgba(26, 86, 219, 0.04);
 }

frontend/vite.config.js

@@ -7,7 +7,7 @@ export default defineConfig({
     port: 5173,
     proxy: {
       '/api': {
-        target: process.env.BACKEND_URL || 'http://localhost:3001',
+        target: 'http://localhost:3001',
         changeOrigin: true,
       },
     },