stockpageを編集しました

frontend/src/pages/StockPage.tsx

@@ -129,6 +129,7 @@ const StockPage: React.FC = () => {
 
                 setSelectedRow(editStock); // `selectedRow` を更新して変更を即時反映
                 fetchStocks(); // 最新データを取得してテーブルに反映
+                setSelectedRow(null); // セルの選択を解除
             } catch (error) {
                 console.error(`${STOCK_ERRORS.UPDATE_FAILED}:`, error);
             }
@@ -152,7 +153,7 @@ const StockPage: React.FC = () => {
             });
         }
     };
-    
+
     /** 編集ダイアログを閉じる */
     const handleCloseEdit = () => {
         setIsEditOpen(false);
@@ -214,15 +215,7 @@ const StockPage: React.FC = () => {
                     <DialogContent>
                         {editStock && (
                             <>
-                                <Typography variant="body1">選択した食材の在庫を編集します</Typography>
+                                <Typography variant="h4">{editStock.stuffName}</Typography>
-                                <TextField
-                                    label="食材名"
-                                    fullWidth
-                                    margin="normal"
-                                    name="stuffName"
-                                    value={editStock.stuffName}
-                                    onChange={handleChange}
-                                />
                                 <TextField
                                     label="数量"
                                     fullWidth
@@ -258,7 +251,7 @@ const StockPage: React.FC = () => {
                                     onChange={handleChange}
                                 />
 
-                                <Button onClick={() => setIsEditOpen(false)} sx={{ mt: 3, mb: 2, left: '68%' }}>キャンセル</Button>
+                                <Button onClick={() => {setIsEditOpen(false); setSelectedRow(null);}} sx={{ mt: 3, mb: 2, left: '68%' }}>キャンセル</Button>
                                 <Button
                                     variant="contained"
                                     color="success"
@@ -284,12 +277,13 @@ const StockPage: React.FC = () => {
                     <DialogContent>
                         {selectedRow && (
                             <>
-                                <Typography variant="body1">この操作は取り消せません。本当に削除しますか？</Typography>
+                                <Typography variant="h4">{selectedRow.stuffName}を削除します。</Typography>
-                                <Typography variant="body2" color="error">⚠️ 注意: 削除すると復元できません。</Typography>
+                                <Typography variant="body1" color="error">⚠️ 注意: 削除すると復元できません。</Typography>
-                                <Button onClick={() => setIsDeleteOpen(false)} sx={{ mt: 3, mb: 2, left: '70%' }}>キャンセル</Button>
+                                <Button onClick={() => {setIsDeleteOpen(false); setSelectedRow(null);}} sx={{ mt: 3, mb: 2, left: '70%' }}>キャンセル</Button>
                                 <Button variant="contained" color="error" onClick={() => {
                                     handleDeleteStock(selectedRow.stockId);
                                     setIsDeleteOpen(false); // 削除処理後にダイアログを閉じる
+                                    setSelectedRow(null); // セルの選択を解除
                                 }}
                                     style={{ marginTop: "10px" }} sx={{ mt: 3, mb: 2, left: '72%' }}>削除</Button>
                             </>