Allow displaying a link base on the props values

Author: ygpedroso

README.md

@@ -38,6 +38,7 @@ class Example extends Component {
 * `message` Message that will be show to the user: (Type `String`, Default value: 'Cookies help us deliver our services. By using our services, you agree to our use of cookies.')
 * `buttonMessage` Text of the submit action button: (Type: `String`, Default value: 'OK')
 * `expiresIn` Time needed for the cookie to expire: (Type: `Number`, Default value: 365)
+* `link` Link for more information pages: (Type: `Object`, Default values: { url: undefined, text: undefined, target: '_blank'})
 
 ## Styling
 
@@ -49,6 +50,7 @@ class Example extends Component {
  1. `.cookies-consent`: Entire Component container.
  2. `.cookies-consent-text`: Container of the message showed to the user.
  3. `.cookies-consent-button` Container of the Button for accepting the use of cookies.  
+ 4. `.cookies-consent-link` Container of the `a` tag for the link.  
 
 ## License
 

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cuban-engineer/react-cookies-consent",
-    "version": "1.0.2",
+    "version": "1.0.3",
     "description": "React component for the managing the user awareness regarding cookies usage",
     "main": "lib/index.js",
     "module": "lib/index.es.js",

src/index.js

@@ -36,13 +36,22 @@ export default class CookiesConsent extends Component {
     };
 
     render() {
-        const { message, buttonMessage } = this.props;
+        const { message, buttonMessage, link } = this.props;
         const { cookiesConsent } = this.state;
         return (
             <div>
                 {cookiesConsent === false && (
                     <div className="cookies-consent">
                         <span className="cookies-consent-text">{message}</span>
+                        {link &&
+                            link.url &&
+                            link.text && (
+                                <span className="cookies-consent-link">
+                                    <a href={link.url} target={link.target}>
+                                        {link.text}
+                                    </a>
+                                </span>
+                            )}
                         <span>
                             <button
                                 type="button"
@@ -63,11 +72,21 @@ CookiesConsent.propTypes = {
     message: PropTypes.string,
     buttonMessage: PropTypes.string,
     expiresIn: PropTypes.number,
+    link: PropTypes.shape({
+        url: PropTypes.string,
+        text: PropTypes.string,
+        target: PropTypes.string,
+    }),
 };
 
 CookiesConsent.defaultProps = {
     cookieId: COOKIES_ID,
     message: COOKIES_CONSENT_DEFAULT_MESSAGE,
     buttonMessage: COOKIES_CONSENT_BUTTON_MESSAGE,
     expiresIn: COOKIES_EXPIRES,
+    link: {
+        url: undefined,
+        text: undefined,
+        target: '_blank',
+    },
 };