React-feedbacky NPM

react-feedbacky

Feedbacky is a feedback tool added to your own codebase. The backend is an area where these feedbacks are recorded. You can collect all your feedback by deploying the backend part to your own servers.

Getting Started

npm install react-feedbacky

Usage

import { Feedbacky } from "react-feedbacky";
export default function App() {
  const props = {
    projectId: "STORIES_FEEDBACKY",
    styleThemeColor: "#f37919",
    styleFontColor: "#fff",
    styleOpenButtonImageSrc: "https://avatars.githubusercontent.com/u/17431441?v=4",
    styleCloseButtonImageSrc: "https://avatars.githubusercontent.com/u/17431441?v=4",
    styleButtonText: "Send Feedback",
    styleFormPlaceHolder: "Enter your message",
    styleFormTitle: "Send Your Feedback",
    requestFeedbackBackEndUrl: "https://ty-resobyte-ext-feedback-be.herokuapp.com/v1/api/feedbacks", 
    extraHttpHeaders: {'Access-Control-Allow-Credentials' : 'true'},
    extraHttpBodyParams: {'screen': 'recorder'},
  };

  return (
    <div className="App">
      <Feedbacky {...props} />
    </div>
  );
}

Configuration

Props	Description	type	required	default
projectId	Your Project ID for Backend feedbacks	string	false	"STORIES_FEEDBACKY"
styleThemeColor	Your Project Theme Color	string	false	"#f37919"
styleFontColor	Your Project Font Color	string	false	"#fff"
styleButtonText	Your Project Send Button Text	string	false	"Send Feedback"
styleOpenButtonImageSrc	Feedbacky Button Open Image Source	string	false	Project Default Svg
styleCloseButtonImageSrc	Feedbacky Button Close Image Source	string	false	Project Default Svg
styleFormPlaceHolder	Your Project Input Placeholder	string	false	"Enter your message"
styleFormTitle	Your Project Modal Title	string	false	"Send Feedback"
requestFeedbackBackEndUrl	Your Project BackEnd request url	string	false	"https://ty-resobyte-ext-feedback-be.herokuapp.com/v1/api/feedbacks"
extraHttpHeaders	Backend project extra HttpHeaders	object	false	{}
extraHttpBodyParams	Backend project extra BodyParams	object	false	{}