add components

@@ -2,6 +2,7 @@ import React from 'react';
 import { View, Text} from 'react-native';
 import {connect} from 'react-redux'
 import Icon from 'react-native-vector-icons/FontAwesome';
+import RateMessage from '../RateMessage/RateMessage';
 import RateSentence from '../RateSentence/RateSentence';
 import RateBar from '../RateBar/RateBar';
 import RateLine from '../RateLine/RateLine';
@@ -10,8 +11,9 @@ import scoring from '../../lib/scoring';
 const Rate = ({score}) => {
     return(
         <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0, justifyContent:'center',alignItems:'center'}}>
+            <RateMessage />
             <RateSentence />
-            <RateBar score={score}/>
+            <RateBar score={score}/>           
             <RateLine />
         </View>
     )
@@ -28,6 +30,6 @@ RateContainer.navigationOptions={
 
 export default connect(
     ({search})=>({
-        score: scoring(search.result.return_data)
+        score: search.score
     })
 )(RateContainer);
\ No newline at end of file

@@ -10,7 +10,7 @@ export default RateBar = (props) => {
     return (
         <Surface style={styles.surface}>
             
-            {props.score.msg.length ?
+            {props.score.msg ?
             <>
             <View style={styles.container}>
                 <Text style={styles.Text}>총 점수 : {props.score.full}</Text>

@@ -38,7 +38,7 @@ const RateLine = ({load,pastScore }) => {
 const styles = StyleSheet.create({
     surface: {
         padding: 8,
-        flex: 0.4,
+        flex: 0.3,
         width: '95%',
         alignItems: 'center',
         justifyContent: 'center',

+import React,{ useState } from 'react';
+import { Surface, Text } from 'react-native-paper';
+import { StyleSheet,View } from 'react-native';
+import {connect} from 'react-redux';
+import PromptSearchRate from '../PromptSearch/PromptSearchRate';
+
+const SentenceInfo = (props) => (
+    <View>
+        <Text style={[styles.Text,{color:props.color}]}>{props.Text}</Text>
+    </View> 
+)
+
+const RateMessage = ({keywordText, score }) => {
+
+    return (
+        <Surface style={styles.surface} >
+            { keywordText ?
+                <>
+                <View style={{textAlign:"center", height:35}}>
+                <Text >길잡이가 교정해준 문장을 확인하세요!</Text>
+                </View>
+                <View>
+                <Text style={styles.msg} >{score.msg}</Text>
+                </View>
+                <View>
+                    <SentenceInfo Text={keywordText} color={'#281e94'} />
+                </View> 
+                </>
+                : <PromptSearchRate />
+            }
+        </Surface>
+    )
+}
+
+ const styles = StyleSheet.create({
+    surface: {
+        padding: 8,
+        flex: 0.3,
+        width: '95%',
+        alignItems: 'center',
+        justifyContent: 'center',
+        elevation: 2,
+        marginTop: 10
+    },
+    Text:{
+        fontSize: 25,
+        textAlign:'center'
+    },
+    infoText:{
+        fontSize: 20,
+        textAlign:'center'
+    },
+    msg:{
+        fontSize: 20,
+        textAlign:'center',
+    },
+});
+
+
+const RateMessageContainer = ( { keywordText, score } ) => (
+    <RateMessage keywordText={keywordText} score={score} />
+);
+
+export default connect(
+    ({search})=>({
+        keywordText: search.result.return_data.keywordText,
+        score : search.score
+    })
+)(RateMessageContainer);
\ No newline at end of file