React Native Reviews

React Native Reviews is a highly customizable component with no dependencies meant to be used to to propmt your users to review your app. This is not a modal component. It's just a presentational component you can use on top of your preferred modal component.

Installation

Use your prefered package manager

npm install react-native-reviews

Usage

Given that React Native Modalfy uses the new React Context & Hooks APIs added respectively in React 16.3.0 and React 16.8.0, we'll require you to use at least react-native@^0.59.0(that ships with React 16.8.3).

import React, {useCallback} from 'react';
import {Modal} from 'react-native';
import Rate from 'react-native-reviews';

const RateModal = React.memo(function RateModal({modal}) {
  const onSubmit = useCallback(feedback => {
    //process feedback
  }, []);

  return (
    <Modal {...modalProps}>
      <Rate onDimiss={() => modal?.closeModal()} onSubmit={onSubmit} />
    </Modal>
  );
});

export {RateModal};

| Prop | Description | Required | Default Value | |-|-|-|-| | androidPackageName | String: used to take the users to your Google store page. | | | | buttonStyle | Styles: use this to customize the button styles | | | | buttonTextStyle | Styles: use this to customize the text component within buttons | | | | containerStyles | Styles: use this to customize the main component styles | | | | dislikeIconSource | Image Source: use this to set your own dislike icon | | | | dislikeIconSourceSelected | Image Source: use this to set your own dislike icon when selected | | | | dismissButtonText | String: use this to change the default text | | DISMISS | | helperTextDislike | String: use this to change the default default helper text when the dislike option is selected | | Please help us understand what could be improved. | | helperTextLike | String: use this to change the default default helper text when the like option is selected | | Would you be willing to leave a review in the app store? | | helperTextStyles | Styles: use this to customize the helper text styles | | | | iOSStoreId | String: used to take the users to your app's iOS store page | | | | inputContainerStyles | Styles: use this to customize the input container (example: adding margins) | | | | inputPlaceholder | String: use this to change the input placeholder | | | | inputProps | Text Input Props: use this to change any of the TextInput props | | | | likeIconSource | Image Source: use this to set your own like icon | | | | likeIconSourceSelected | Image Source: use this to set your own like icon when selected | | | | mainTitle | String: use this to change the main title | | How do you like the app? | | mainTitleStyle | Styles: use this to customize the main title styles | | | | onDimissPress | Function: use this to handle the DISMISS button onPress event (example: closing the modal) | yes | | | onReviewPress | Function: use this to handle the DISMISS button onPress event (example: closing the modal) | | | | onReviewPress | Function: use this to change how to handle the review button onPress event (example: not taking the user to the stores) | | | | onSubmitPress | Function: use this to handle the SUBMIT button onPress event. Receives a string which represents the feedback from the user. (example: sending the feedback to the server) | yes | | | renderDislikeIcon | Function: use this to render your own dislike icon (example: using vector icons). Receives a "isSelected" param. | | | | renderInput | Function: use this to render your own TextInput component (example: using a material-based component) | | | | renderLikeIcon | Function: use this to render your own like icon (example: using vector icons). Receives a "isSelected" param. | | | | reviewButtonText | String: use this to change the YES, REVIEW IT button text | | | | submitButtonText | String: use this to change the SUBMIT button text | | | | subtitleDislike | String: use this to change the default subtitle when the dislike option is selected | | Sorry to hear that. | | subtitleLike | String: use this to change the default subtitle when the like option is selected | | That's good to hear! | | subtitleStyles | Styles: use this to customize the subtitle text styles | | |

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT License

Copyright (c) 2020 FullStack Labs

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.