fixed bug: can't scroll on draggable list

src/Components/Card/index.js

@@ -11,7 +11,6 @@ export default function Card({ children, cardTopicText, cardBackgroundColor }) {
       : cardBackgroundColor;
 
   return (
-    <>
     <View
       style={{
         paddingTop: 10,
@@ -44,6 +43,5 @@ export default function Card({ children, cardTopicText, cardBackgroundColor }) {
         {children}
       </View>
     </View>
-    </>
   );
 }

src/Screens/Device/index.js

@@ -77,9 +77,9 @@ export default function DeviceScreen({ navigation }) {
         onPress={() => setSelectedView(2)}
       />
 
-      <ScrollView style={{ height: "100%" }}>
+      <View style={{ flex: 1 }}>
         <SelectedView />
-      </ScrollView>
+      </View>
     </View>
   );
 }

src/Screens/Device/scene.js

@@ -19,6 +19,8 @@ import { Divider } from "../../Components/Divider";
 import { MyColorSwatch } from "../../Components/ColorPicker";
 import { MyDotsModal } from "../../Components/Modal";
 import DraggableFlatList, {
+  NestableDraggableFlatList,
+  NestableScrollContainer,
   ScaleDecorator,
 } from "react-native-draggable-flatlist";
 
@@ -69,9 +71,9 @@ export default function SceneView({ navigation }) {
     (a) => a.sceneId === device.selectedScene
   );
 
+  const DropdownCard = (style) => {
     return (
-    <>
+      <Card style={style}>
-      <Card>
         <MyDropdown
           label={t("screens.device.scenes.dropdownSceneSelection.label")}
           onPress={() =>
@@ -82,18 +84,23 @@ export default function SceneView({ navigation }) {
           selectedItemLabel={getSelectedDeviceSceneName()}
         />
       </Card>
+    );
+  };
 
+  return (
+    <>
       {device.selectedScene === "" ? (
+        <>
+          <DropdownCard />
+
           <MyResult
             text={t("screens.device.scenes.infoNoSceneSelected")}
             iconName={"selection-search"}
           />
+        </>
       ) : (
         <DraggableFlatList
-          style={{ marginTop: 10 }}
-          scrollEnabled={false}
           data={deviceSceneActions}
-          simultaneousHandlers
           onDragEnd={({ data }) =>
             // TODO: api: save sorting new order
             appContext.setDeviceSceneActions((arr) => {
@@ -109,6 +116,7 @@ export default function SceneView({ navigation }) {
             })
           }
           keyExtractor={(item) => item.actionId}
+          ListHeaderComponent={<DropdownCard style={{ marginBottom: 10 }} />}
           ListEmptyComponent={
             <MyResult
               text={t("screens.device.scenes.infoNoActionsAvailableInScene")}

src/Screens/Device/settings.js

@@ -1,4 +1,4 @@
-import { Text, View } from "react-native";
+import { ScrollView, Text, View } from "react-native";
 import Card from "../../Components/Card";
 import { useContext, useEffect, useState } from "react";
 import { AppContext, AppSelectedUserDevice, AppStyles } from "../../utils";
@@ -23,7 +23,7 @@ export default function SettingsView({ navigation }) {
   }, []);
 
   return (
-    <>
+    <ScrollView>
       <Card cardTopicText={t("screens.device.settings.settingsTitle")}>
         <View
           style={{
@@ -149,6 +149,6 @@ export default function SettingsView({ navigation }) {
           {device.firmware.lastUpdated}
         </Text>
       </Card>
-    </>
+    </ScrollView>
   );
 }