update ratting

package.json

@@ -42,6 +42,7 @@
     "react-native-linear-gradient": "^2.5.6",
     "react-native-modal": "^11.7.0",
     "react-native-modal-dropdown": "^1.0.0",
+    "react-native-ratings": "^8.0.4",
     "react-native-reanimated": "^1.13.2",
     "react-native-safe-area-context": "^3.1.9",
     "react-native-screens": "^2.17.1",

src/Screens/Feedback/FeedbackView.js

@@ -23,6 +23,17 @@ import PickerImg from '../../components/Picker/PickerImg';
 import {HEIGHTXD, WIDTHXD, getFontXD} from '../../Config/Functions';
 import R from '../../assets/R';
 import Button from '../../components/Button';
+import I18n from '../../helper/i18/i18n';
+import AppText from '../../components/AppText';
+import {Rating, AirbnbRating} from 'react-native-ratings';
+
+const radio_props = [
+  {label: I18n.t('VeryBad'), value: 0},
+  {label: I18n.t('Bad'), value: 1},
+  {label: I18n.t('Normal'), value: 2},
+  {label: I18n.t('Good'), value: 3},
+  {label: I18n.t('VeryGood'), value: 4},
+];
 
 const FeedbackView = (props) => {
   const [isSelected, setIsSelected] = useState('');
@@ -47,43 +58,23 @@ const FeedbackView = (props) => {
     setImageAdd(temp);
   };
 
+  const ratingCompleted = (rating) => {
+    console.log('Rating is: ' + rating);
+  };
   return (
     <KeyboardAvoidingView
       behavior={Platform.Os === 'ios' ? 'padding' : 'height'}
-      style={{flex: 1}}
+      style={{flex: 1, backgroundColor: 'white'}}
       keyboardVerticalOffset={-50}>
       <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
         <View style={{flex: 1}}>
           <HeaderBack isWhite={true} title={'SendFeedback'} />
           <View style={styles.container}>
-            <Text style={styles.txt}>Review</Text>
-
-            <RadioForm animation={true}>
-              {radio_props.map((obj, i) => (
-                <RadioButton labelHorizontal={true} key={i}>
-                  <RadioButtonInput
-                    obj={obj}
-                    index={i}
-                    isSelected={isSelected === i}
-                    onPress={onPress}
-                    r
-                    borderWidth={1}
-                    buttonColor={isSelected === i ? '#1473E6' : '#C5C5C5'}
-                    buttonSize={10}
-                    buttonOuterSize={18}
-                    buttonStyle={{marginLeft: 20, marginVertical: 10}}
-                  />
-                  <RadioButtonLabel
-                    obj={obj}
-                    index={i}
-                    labelColor={'#001C51'}
-                    onPress={onPress}
-                    labelStyle={{fontSize: 16, paddingLeft: 16}}
-                  />
-                </RadioButton>
-              ))}
-            </RadioForm>
-
+            <AppText style={styles.txt} i18nKey={'FeedBackDCV'} />
+            <Rating
+              onFinishRating={ratingCompleted}
+              style={{paddingVertical: 10}}
+            />
             <View style={styles.footer}>
               <TextInput
                 style={styles.txtInput}
@@ -107,6 +98,7 @@ const FeedbackView = (props) => {
                           imageStyle={{
                             width: WIDTHXD(330),
                             height: HEIGHTXD(250),
+                            borderRadius: 5,
                           }}
                           style={{
                             width: WIDTHXD(330),
@@ -122,7 +114,7 @@ const FeedbackView = (props) => {
                             }}
                             onPress={() => onClickClose(index)}>
                             <Image
-                              style={{height: 30, width: 30}}
+                              style={{height: 20, width: 20}}
                               source={R.images.iconClose}
                             />
                           </TouchableOpacity>
@@ -131,7 +123,7 @@ const FeedbackView = (props) => {
                     ))}
                   </ScrollView>
                 ) : (
-                  <PickerImg title={'addd'} onClickImage={onClickImages} />
+                  <PickerImg title={''} onClickImage={onClickImages} />
                 )}
               </View>
             </View>
@@ -182,6 +174,7 @@ const styles = StyleSheet.create({
   },
   containerBtn: {
     marginBottom: 30,
+    backgroundColor: 'white',
   },
 });
 

src/helper/i18/locales/en.js

@@ -65,6 +65,7 @@ export default {
   Update: 'Update',
   Send: 'Send',
   ContactCode: 'Contact code',
+
   TraddingAccountName: 'Tradding account name',
   TraddingAccountNumber: 'Tradding account number',
   GeneralInformation: 'General information',
@@ -225,4 +226,5 @@ export default {
   HotLine: 'HotLine:',
   WorkingTime: 'Working time:',
   ContentRequire: 'Content require:',
+  FeedBackDCV: 'Feedback for DCV Invest',
 };

src/helper/i18/locales/vn.js

@@ -228,4 +228,5 @@ export default {
   HotLine: 'Đường dây nóng:',
   WorkingTime: 'Thời gian làm việc:',
   ContentRequire: 'Nội dung yêu cầu:',
+  FeedBackDCV: 'Đánh giá dịch vụ của DCV Invest',
 };

yarn.lock

@@ -6720,6 +6720,13 @@ react-native-modal@^11.7.0:
     prop-types "^15.6.2"
     react-native-animatable "1.3.3"
 
+react-native-ratings@^8.0.4:
+  version "8.0.4"
+  resolved "https://registry.yarnpkg.com/react-native-ratings/-/react-native-ratings-8.0.4.tgz#efd5ebad8acc08bf98d34d39b18fb7a6813ef991"
+  integrity sha512-Xczu5lskIIRD6BEdz9A0jDRpEck/SFxRqiglkXi0u67yAtI1/pcJC76P4MukCbT8K4BPVl+42w83YqXBoBRl7A==
+  dependencies:
+    lodash "^4.17.15"
+
 react-native-reanimated@^1.13.2:
   version "1.13.2"
   resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-1.13.2.tgz"