Merge commit '95f498e89418c9bb8c551987f0b3f1b693c05c1d'

components/Settings/DataSourceSettings.tsx

@@ -1,6 +1,5 @@
-import React, { useState, useEffect, useRef } from "react";
+import React, { useState, useEffect } from "react";
 import {
-  Alert,
   View,
   Text,
   ScrollView,
@@ -12,7 +11,6 @@ import {
 import { Switch } from "@rneui/themed";
 import { useNavigation } from "@react-navigation/native";
 import { MaterialCommunityIcons } from "@expo/vector-icons";
-import Swipeable from "react-native-gesture-handler/Swipeable";
 import { SheetHeaderItem } from "@/components/atom/SheetHeaderItem";
 import { AS } from "../../storageControl";
 import { STORAGE_KEYS } from "@/constants";
@@ -304,7 +302,6 @@ export const DataSourceSettings = () => {
     useState<JrDataSystemUiVariant>(
       getJrDataSystemUiVariant(DEFAULT_JR_DATA_SYSTEM_ENV),
     );
-  const recordingSwipeRefs = useRef<Record<string, { close: () => void } | null>>({});
 
   const applyJrDataSystemEnv = (env: JrDataSystemEnvironmentKey) => {
     setJrDataSystemEnv(env);
@@ -361,28 +358,6 @@ export const DataSourceSettings = () => {
     applyJrDataSystemEnv(env);
   };
 
-  const closeRecordingSwipe = (id: string) => {
-    recordingSwipeRefs.current[id]?.close();
-  };
-
-  const confirmDeleteRecording = (id: string, label: string) => {
-    closeRecordingSwipe(id);
-    Alert.alert(
-      "録画を削除",
-      `${label} の録画を削除しますか？`,
-      [
-        { text: "キャンセル", style: "cancel" },
-        {
-          text: "削除",
-          style: "destructive",
-          onPress: () => {
-            void deleteRecording(id);
-          },
-        },
-      ],
-    );
-  };
-
   return (
     <View style={[styles.container, { backgroundColor: fixed.primary }]}>
       <SheetHeaderItem
@@ -578,16 +553,13 @@ export const DataSourceSettings = () => {
                       month: 'numeric', day: 'numeric',
                       hour: '2-digit', minute: '2-digit',
                     });
-                    const recordingRow = (
-                      <TouchableOpacity
-                        onPress={() => startPlayback(rec.id)}
-                        disabled={isPlaying}
-                        activeOpacity={0.72}
+                    return (
+                      <View
+                        key={rec.id}
                         style={{
                           flexDirection: 'row', alignItems: 'center',
                           backgroundColor: colors.backgroundSecondary,
-                          borderRadius: 8, padding: 12, gap: 10,
-                          opacity: isPlaying ? 0.6 : 1,
+                          borderRadius: 8, padding: 10, gap: 8,
                         }}
                       >
                         <View style={{ flex: 1 }}>
@@ -598,71 +570,29 @@ export const DataSourceSettings = () => {
                             {rec.snapshotCount} コマ  /  {durationLabel}
                           </Text>
                         </View>
-                        <View style={{ alignItems: 'flex-end', gap: 4 }}>
-                          <View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
-                            <MaterialCommunityIcons
-                              name={isPlaying ? 'pause-circle-outline' : 'play-circle-outline'}
-                              size={18}
-                              color={isPlaying ? colors.textTertiary : '#43a047'}
-                            />
-                            <Text
-                              style={{
-                                color: isPlaying ? colors.textTertiary : colors.textPrimary,
-                                fontSize: 12,
-                                fontWeight: '600',
-                              }}
-                            >
-                              {isPlaying ? '再生中は操作不可' : 'タップで再生'}
-                            </Text>
-                          </View>
-                          {!isPlaying && (
-                            <Text style={{ color: colors.textTertiary, fontSize: 10 }}>
-                              左へスワイプで削除
-                            </Text>
-                          )}
-                        </View>
-                        <MaterialCommunityIcons
-                          name="chevron-right"
-                          size={18}
-                          color={colors.iconSecondary}
-                        />
-                      </TouchableOpacity>
-                    );
-
-                    if (isPlaying) {
-                      return <View key={rec.id}>{recordingRow}</View>;
-                    }
-
-                    return (
-                      <Swipeable
-                        key={rec.id}
-                        ref={(instance) => {
-                          recordingSwipeRefs.current[rec.id] = instance;
-                        }}
-                        friction={2}
-                        overshootRight={false}
-                        rightThreshold={48}
-                        renderRightActions={() => (
-                          <View
+                        {!isPlaying && (
+                          <TouchableOpacity
+                            onPress={() => startPlayback(rec.id)}
                             style={{
-                              width: 96,
-                              borderRadius: 8,
-                              backgroundColor: '#e53935',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              marginLeft: 6,
+                              backgroundColor: '#43a047', borderRadius: 6,
+                              paddingHorizontal: 10, paddingVertical: 6,
                             }}
                           >
-                            <MaterialCommunityIcons name="trash-can-outline" size={18} color="#fff" />
-                            <Text style={{ color: '#fff', fontSize: 11, fontWeight: 'bold', marginTop: 4 }}>
-                              削除
-                            </Text>
-                          </View>
+                            <Text style={{ color: '#fff', fontWeight: 'bold', fontSize: 12 }}>▶</Text>
+                          </TouchableOpacity>
                         )}
-                        onSwipeableOpen={() => confirmDeleteRecording(rec.id, dateLabel)}
-                      >
-                        {recordingRow}
-                      </Swipeable>
+                        {!isPlaying && (
+                          <TouchableOpacity
+                            onPress={() => deleteRecording(rec.id)}
+                            style={{
+                              borderColor: '#e53935', borderWidth: 1, borderRadius: 6,
+                              paddingHorizontal: 10, paddingVertical: 6,
+                            }}
+                          >
+                            <Text style={{ color: '#e53935', fontSize: 12 }}>削除</Text>
+                          </TouchableOpacity>
+                        )}
+                      </View>
                     );
                   })}
                 </View>