'How to use swipeable component in react native to make new "View" after swiping ride?

I am new to React-Native, using the swipeable componet to render the new "View" for delete purpose. after swiping right it does not work. It gives WARN, which below I have mentioned.

import React from 'react';

import { 
  View,
  Text,
  StyleSheet,
  
 } from 'react-native';

 import Swipeable from 'react-native-gesture-handler/Swipeable';

function App(props) {
  return (
    <Swipeable renderRightActions={()=> (
      <View style={{backgroundColor:'red', width:70}}>

      </View>
    )}>
    <View style={styles.container}>
      <Text style={styles.text}> Swipe right to Delete</Text>
    </View>
    </Swipeable>
  );
}


const styles = StyleSheet.create({
  container:{
    flexDirection:"row",
    backgroundColor:'lightgray',
    width: "100%",
    height:70,
    justifyContent:'center',
    alignItems:'center',
  },
  text:{
    fontWeight:'bold',
    fontSize:18,
  }
})
export default App;

WARN [react-native-gesture-handler] Seems like you're using an old API with gesture components, check out new Gestures system! PanGestureHandler@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.swipeabletest&modulesOnly=false&runModule=true:110702:38 Swipeable@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.swipeabletest&modulesOnly=false&runModule=true:110053:36 App RCTView View RCTView View AppContainer@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.swipeabletest&modulesOnly=false&runModule=true:77006:36 swipeableTest(RootComponent)@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.swipeabletest&modulesOnly=false&runModule=true:83408:28



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source