feat: split schedule view horizontal axis into AM/PM half-day slots

Agent-Logs-Url: https://github.com/h/CarReservation/sessions/b0f3486c-edf5-4c08-b1e8-161b380aa0a0

Co-authored-by: h <57948770+h@users.noreply.github.com>

backend/server.js

@@ -68,6 +68,7 @@ if (!carCols.includes('sort_order')) {
   db.exec('ALTER TABLE cars ADD COLUMN sort_order INTEGER DEFAULT 0');
   db.exec('UPDATE cars SET sort_order = id');
 }
+db.prepare("UPDATE cars SET tire_type = 'スタッドレス' WHERE tire_type = 'スタットレス'").run();
 
 // Migrate: add period fields to reservations if they don't exist yet
 const resCols = db.prepare("PRAGMA table_info(reservations)").all().map((c) => c.name);
@@ -99,13 +100,17 @@ function broadcast(message) {
   });
 }
 
-// for future use
+function normalizeTireType(value) {
+  return value === 'スタットレス' ? 'スタッドレス' : value;
+}
+
 function normalizeCar(car) {
   if (!car) {
     return car;
   }
   return {
     ...car,
+    tire_type: normalizeTireType(car.tire_type),
   };
 }
 

frontend/src/components/ScheduleView.jsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useRef, useCallback } from 'react';
-import { format, addDays, parseISO, differenceInDays } from 'date-fns';
+import { format, addDays, startOfWeek, parseISO, differenceInDays } from 'date-fns';
 import { ja } from 'date-fns/locale';
 import { api } from '../api.js';
 import { isInspectionExpirySoon, formatDateRange, formatReservationTooltip } from '../utils/carUtils.js';
@@ -43,8 +43,10 @@ export default function ScheduleView({ reloadKey = 0 }) {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
 
-  // The first date shown in the grid (start from today)
-  const [viewStart, setViewStart] = useState(() => new Date());
+  // The first date shown in the grid
+  const [viewStart, setViewStart] = useState(() =>
+    startOfWeek(new Date(), { weekStartsOn: 1 })
+  );
 
   // Drag-to-create state
   const [creating, setCreating] = useState(null);
@@ -90,7 +92,7 @@ export default function ScheduleView({ reloadKey = 0 }) {
   // --- Navigation ---
   const prevWeek = () => setViewStart((d) => addDays(d, -7));
   const nextWeek = () => setViewStart((d) => addDays(d, 7));
-  const goToday = () => setViewStart(new Date());
+  const goToday = () => setViewStart(startOfWeek(new Date(), { weekStartsOn: 1 }));
 
   // --- Grid position helpers ---
   // Given a mouse clientX within the grid scroll area, get the half-day slot index (0-based)

frontend/src/components/TimelineView.jsx

@@ -136,9 +136,9 @@ export default function TimelineView({ reloadKey = 0 }) {
   const carColorMap = {};
   cars.forEach((car, i) => { carColorMap[car.id] = getColor(i); });
 
-  // Sort reservations by start_date descending (newest first) then car
+  // Sort reservations by start_date then car
   const sortedReservations = [...reservations].sort((a, b) => {
-    if (a.start_date !== b.start_date) return a.start_date > b.start_date ? -1 : 1;
+    if (a.start_date !== b.start_date) return a.start_date < b.start_date ? -1 : 1;
     return a.car_id - b.car_id;
   });