Merge pull request #15 from cloudhx/iss12

New feature added

Author: cloudhx

package-lock.json

@@ -4,6 +4,7 @@
   "private": true,
   "dependencies": {
     "bootstrap": "^4.3.1",
+    "bootstrap-social": "^5.1.1",
     "react": "^16.10.2",
     "react-dom": "^16.10.2",
     "react-redux": "^7.1.1",

package.json

@@ -0,0 +1,17 @@
+import React from "react";
+import { Link } from "react-router-dom";
+
+const SignIn = () => {
+  return (
+    <div className="jumbotron">
+      <div class="text-center my-5">
+        <p>To access your issues, please sign in with your GitHub token</p>
+        <Link to="token" className="btn btn-primary btn-lg mt-1">
+          Sign in with your GitHub Token
+        </Link>
+      </div>
+    </div>
+  );
+};
+
+export default SignIn;

src/components/common/SignIn.js

@@ -5,13 +5,14 @@ import PropTypes from "prop-types";
 import { bindActionCreators } from "redux";
 import IssueList from "./IssueList";
 import Spinner from "../common/Spinner";
+import SignIn from "../common/SignIn";
 import { toast } from "react-toastify";
 
 class IssuesPage extends React.Component {
   componentDidMount() {
-    const { issues, actions } = this.props;
+    const { issues, user, actions } = this.props;
 
-    if (issues.length === 0) {
+    if (typeof user.login !== "undefined" && issues.length === 0) {
       actions.loadIssues().catch(error => {
         alert("Loading issues failed" + error);
       });
@@ -37,7 +38,9 @@ class IssuesPage extends React.Component {
     return (
       <>
         <h2>Open Issues</h2>
-        {this.props.loading ? (
+        {typeof this.props.user.login === "undefined" ? (
+          <SignIn />
+        ) : this.props.loading ? (
           <Spinner />
         ) : (
           <IssueList