Refactored samples to pass linter

teodosii · Sep 2, 2018 · f94778e · f94778e
1 parent 2747814
commit f94778e
Show file tree

Hide file tree

Showing 12 changed files with 44 additions and 38 deletions.
diff --git a/samples/js/components/Content.js b/samples/js/components/Content.js
@@ -1,12 +1,12 @@
 import React from "react";
 import Highlight from "react-highlight";
-import { install, usage } from "../helpers/code";
-import ContainerExample from "./examples/ContainerExample";
-import TypeExample from "./examples/TypeExample";
-import InsertExample from "./examples/InsertExample";
-import AnimationWrapper from "./examples/AnimationExample";
-import CustomContentExample from "./examples/CustomContentExample";
-import UsageExample from "./examples/UsageExample";
+import { install, } from "helpers/code";
+import ContainerExample from "components/examples/ContainerExample";
+import TypeExample from "components/examples/TypeExample";
+import InsertExample from "components/examples/InsertExample";
+import AnimationWrapper from "components/examples/AnimationExample";
+import CustomContentExample from "components/examples/CustomContentExample";
+import UsageExample from "components/examples/UsageExample";
 
 function NPMInstall() {
   return (
@@ -34,7 +34,7 @@ function ExampleHeading() {
       </div>
     </div>
   );
-};
+}
 
 const Examples = ({ addNotification }) => {
   return (

diff --git a/samples/js/components/Header.js b/samples/js/components/Header.js
@@ -1,6 +1,6 @@
 import React from "react";
 
-export default function Header({ instance }) {
+export default function Header() {
   return (
     <div className="header">
       <div className="header-content">
@@ -9,6 +9,7 @@ export default function Header({ instance }) {
         <div className="header-buttons">
           <a
             target="_blank"
+            rel="noopener noreferrer"
             className="btn btn-primary no-corner"
             href={"https://github.com/teodosii/react-notifications-component"}
           >

diff --git a/samples/js/components/examples/AnimationExample.js b/samples/js/components/examples/AnimationExample.js
@@ -1,11 +1,10 @@
 import React from "react";
-import notification from "../../helpers/notification";
+import notification from "helpers/notification";
 import {
   getContainer,
   getType,
-  getMessage,
-  getTitle
-} from "../../helpers/randomize";
+  getMessage
+} from "helpers/randomize";
 
 function AnimationInExample({ addNotification }) {
   const add = (htmlClasses) => {

diff --git a/samples/js/components/examples/ContainerExample.js b/samples/js/components/examples/ContainerExample.js
@@ -1,10 +1,10 @@
 import React from "react";
-import notification from "../../helpers/notification";
+import notification from "helpers/notification";
 import {
   getType,
   getMessage,
   getTitle
-} from "../../helpers/randomize";
+} from "helpers/randomize";
 
 export default class ContainerExample extends React.Component {
   constructor(props) {

diff --git a/samples/js/components/examples/CustomContentExample.js b/samples/js/components/examples/CustomContentExample.js
@@ -1,7 +1,7 @@
 import React from "react";
-import notification from "../../helpers/notification";
-import reactImage from "../../../images/react.png";
-import { getContainer } from "../../helpers/randomize";
+import notification from "helpers/notification";
+import reactImage from "images/react.png";
+import { getContainer } from "helpers/randomize";
 
 export default class CustomContentExample extends React.Component {
   constructor(props) {

diff --git a/samples/js/components/examples/InsertExample.js b/samples/js/components/examples/InsertExample.js
@@ -1,11 +1,10 @@
 import React from "react";
-import notification from "../../helpers/notification";
+import notification from "helpers/notification";
 import {
-  getContainer,
   getType,
   getMessage,
   getTitle
-} from "../../helpers/randomize";
+} from "helpers/randomize";
 
 export default function InsertExample({ addNotification }) {
   const add = (insert) => {

diff --git a/samples/js/components/examples/TypeExample.js b/samples/js/components/examples/TypeExample.js
@@ -1,10 +1,10 @@
 import React from "react";
-import notification from "../../helpers/notification";
+import notification from "helpers/notification";
 import {
   getContainer,
   getMessage,
   getTitle
-} from "../../helpers/randomize";
+} from "helpers/randomize";
 
 export default class TypeExample extends React.Component {
   constructor(props) {

diff --git a/samples/js/components/examples/UsageExample.js b/samples/js/components/examples/UsageExample.js
@@ -1,10 +1,8 @@
 import React from "react";
 import Highlight from "react-highlight";
-import { usage } from "../../helpers/code";
-import notification from "../../helpers/notification";
-import notificationObject from "../../../../tests/mocks/notification.mock";
+import { usage } from "helpers/code";
 
-export default function UsageExample({ addNotification }) {
+export default function UsageExample() {
   return (
     <div className="row">
       <div className="col-lg-8 offset-lg-2 column col-md-10 offset-md-1 col-sm-12 heading">

diff --git a/samples/js/helpers/code.js b/samples/js/helpers/code.js
@@ -7,10 +7,11 @@ class App extends React.Component {
   constructor(props) {
     super(props);
     this.addNotification = this.addNotification.bind(this);
+    this.notificationDOMRef = React.createRef();
   }
 
   addNotification() {
-    this.notificationDOMRef.addNotification({
+    this.notificationDOMRef.current.addNotification({
       title: "Awesomeness",
       message: "Awesome Notifications!",
       type: "success",
@@ -26,7 +27,7 @@ class App extends React.Component {
   render() {
     return (
       <div className="app-content">
-        <ReactNotification ref={input => this.notificationDOMRef = input} />
+        <ReactNotification ref={this.notificationDOMRef} />
         <button onClick={this.addNotification} className="btn btn-primary">
           Add Awesome Notification
         </button>

diff --git a/samples/js/helpers/notification.js b/samples/js/helpers/notification.js
@@ -1,5 +1,3 @@
-import React from "react";
-
 export default {
   title: "Awesomeness",
   message: "Awesome Notifications!",
@@ -47,7 +45,7 @@ export default {
       delay: 0
     }
   },
-  
+
   dismiss: {
     duration: 5000
   }

diff --git a/samples/js/helpers/randomize.js b/samples/js/helpers/randomize.js
@@ -1,8 +1,18 @@
-import React from "react";
-
-const containers = ["top-left", "top-right", "bottom-left", "bottom-right"];
+const containers = [
+  "top-left",
+  "top-right",
+  "bottom-left",
+  "bottom-right"
+];
 
-const types = ["success", "danger", "warning", "default", "info", "awesome"];
+const types = [
+  "success",
+  "danger",
+  "warning",
+  "default",
+  "info",
+  "awesome"
+];
 
 const successMessages = [
   "All your data has been successfully updated",

diff --git a/samples/js/index.js b/samples/js/index.js
@@ -1,7 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom";
-import App from "./components/App";
-import "../styles/stylesheet.scss";
+import App from "components/App";
+import "styles/stylesheet.scss";
 import "@babel/polyfill";
 
 ReactDOM.render(<App />, document.getElementById("root"));