updated buy now button

Author: Pallavi024

components/buybutton.js

@@ -13,27 +13,30 @@ export default class BuyNow extends React.PureComponent {
    *  @static
    * @memberof BuyNow
    */
-       clicked () {
-         console.log('the button is clicked');
-       } 
-   
+
+  clicked (){
+    console.log('the button is clicked'); //eslint-disable-line no-console
+  }
 
   render() {
     return (
       <React.Fragment>
         <style jsx>{`
           button {
             background-color: #e33812;
-    color: white;
-    padding: 15px 32px;
-    text-align: center;
-    display: inline-block;
-    font-size: 16px;
-    border-radius: 12px;
+            color: white;
+            padding: 15px 32px;
+            text-align: center;
+            display: inline-block;
+            font-size: 16px;
+            border-radius: 12px;
     
           }
         `}</style>
-         <button onClick={this.clicked} >Buy Now</button>
+        
+        <button onClick={this.props.onClick}>
+          {this.props.children}
+        </button>
       </React.Fragment>
     );
   }

pages/index.js

@@ -50,12 +50,11 @@ export default class IndexPage extends React.PureComponent {
               <Item id={id} name={name} />
             ))}
           </ul>
-          </main>
-      
+        </main>
+        
       </React.Fragment>
     );
   }
-
   /**
    * This is for demo purposes.
    * Once the component has mounted, we fetch items from our API and sets them to state.