chore(components): adding deprecation warning to KeyboardAwareScrollView

Author: William Porto

template/src/components/KeyboardAwareScrollView/KeyboardAwareScrollView.tsx

@@ -8,6 +8,9 @@ interface KeyboardAwareScrollViewComponentProps extends KeyboardAwareScrollViewP
   children: ReactNode;
 }
 
+/**
+ * @deprecated https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/494#issuecomment-900089166
+ */
 const KeyboardAwareScrollViewComponent: FC<KeyboardAwareScrollViewComponentProps> = ({
   children,
   ...rest

template/src/screens/Form/Form.tsx

@@ -1,11 +1,11 @@
 import React, { FC, useRef, MutableRefObject, useState } from 'react';
+import { ScrollView } from 'react-native';
 import { useForm, Controller } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 
-import { Column, Input, InputRef, Button, KeyboardAwareScrollView } from 'src/components';
+import { Column, Input, InputRef, Button } from 'src/components';
 
 import { FormExampleSchema } from 'src/utils';
-import { padding } from 'styled-system';
 
 interface FormExampleData {
   email: string;
@@ -41,7 +41,7 @@ const Form: FC = () => {
 
   return (
     <Column flex={1}>
-      <KeyboardAwareScrollView
+      <ScrollView
         contentContainerStyle={{
           flex: 1,
           justifyContent: 'center',
@@ -87,7 +87,7 @@ const Form: FC = () => {
         <Button text='Submit form' onPress={handleSubmit(onSubmit)} mt={20} />
 
         <Button variant='secondary' text='Reset form' onPress={() => reset()} />
-      </KeyboardAwareScrollView>
+      </ScrollView>
     </Column>
   );
 };

template/storybook/stories/Button/index.js

@@ -8,10 +8,10 @@ export default function Button({ onPress, children }) {
 
 Button.defaultProps = {
   children: null,
-  onPress: () => {},
+  onPress: () => {}
 };
 
 Button.propTypes = {
   children: PropTypes.node,
-  onPress: PropTypes.func,
+  onPress: PropTypes.func
 };

template/storybook/stories/CenterView/index.js

@@ -8,9 +8,9 @@ export default function CenterView({ children }) {
 }
 
 CenterView.defaultProps = {
-  children: null,
+  children: null
 };
 
 CenterView.propTypes = {
-  children: PropTypes.node,
+  children: PropTypes.node
 };

template/storybook/stories/CenterView/style.js

@@ -3,6 +3,6 @@ export default {
     flex: 1,
     justifyContent: 'center',
     alignItems: 'center',
-    backgroundColor: '#F5FCFF',
-  },
+    backgroundColor: '#F5FCFF'
+  }
 };

template/storybook/stories/Welcome/index.js

@@ -7,20 +7,20 @@ export default class Welcome extends React.Component {
     wrapper: {
       flex: 1,
       padding: 24,
-      justifyContent: 'center',
+      justifyContent: 'center'
     },
     header: {
       fontSize: 18,
-      marginBottom: 18,
+      marginBottom: 18
     },
     content: {
       fontSize: 12,
       marginBottom: 10,
-      lineHeight: 18,
-    },
+      lineHeight: 18
+    }
   };
 
-  showApp = (event) => {
+  showApp = event => {
     const { showApp } = this.props;
     event.preventDefault();
 
@@ -49,9 +49,9 @@ export default class Welcome extends React.Component {
 }
 
 Welcome.defaultProps = {
-  showApp: null,
+  showApp: null
 };
 
 Welcome.propTypes = {
-  showApp: PropTypes.func,
+  showApp: PropTypes.func
 };