Added issue comment and close issue feature

dist/index.html

@@ -246,6 +246,9 @@
                 </div>
             </div>
             <button style="display: none" id="emptyCommandMsgDisplayer" type="submit" data-toggle="modal" data-target="#emptyCommandMessageModal"></button>
+            <div class="overlay">
+                <div id="loading-img"></div>
+            </div>
             <!-- Cards -->
             <div class="card-group" id="conversations">
                 <div class="card">

public/index.html

@@ -139,7 +139,7 @@
             </div>
             <!-- Widgets -->
             <div class="card-group" id="widgets">
-                <div class="card hide widget good" id="createissue">
+                <div id="createissue" class="card hide widget good">
                     <!-- <img class="card-img-top" src="..." alt="Card image cap"> -->
                     <div class="card-body">
                         <h5 class="card-title">Create Issue</h5>
@@ -172,7 +172,7 @@
                         </form>
                     </div>
                 </div>
-                <div class="card hide widget good" id="addcollab">
+                <div id="addcollab" class="card hide widget good">
                     <!-- <img class="card-img-top" src="..." alt="Card image cap"> -->
                     <div class="card-body">
                         <h5 class="card-title">Create Collaborator</h5>
@@ -187,7 +187,34 @@
                                     <input type="text" class="form-control" id="repoForCollab" placeholder="Repository To Add collaborator on ...." required>
                                 </div>
                             </div>
-                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitAddCollab   " data-target="#submitConfirm">Submit</button>
+                            <div class="form-group">
+                                <label for="comment">Comment:</label>
+                                <textarea class="form-control" rows="3" id="comment"></textarea>
+                            </div>
+                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitAddCollab" data-target="#submitConfirm">Submit</button>
+                        </form>
+                    </div>
+                </div>
+                <div id="addissuecomment" class="card hide widget good">
+                    <!-- <img class="card-img-top" src="..." alt="Card image cap"> -->
+                    <div class="card-body">
+                        <h5 class="card-title">Add Comment</h5>
+                        <form>
+                            <div class="form-row">
+                                <div class="form-group col-md-6 col-sm-6 col-lg-6 col-xs-6 mb-3">
+                                    <label for="repoForIssueComment">Repository Name</label>
+                                    <input type="text" class="form-control" id="repoForIssueComment" placeholder="Repository Name...." required>
+                                </div>
+                                <div class="form-group col-md-6 col-sm-6 col-lg-6 col-xs-6 mb-3">
+                                    <label for="issueNumber">Issue Number</label>
+                                    <input type="text" class="form-control" id="issueNumber" placeholder="Issue To Comment On..." required>
+                                </div>
+                            </div>
+                            <div class="form-group">
+                                <label for="issueComment">Comment:</label>
+                                <textarea class="form-control" rows="3" id="issueComment"></textarea>
+                            </div>
+                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitAddComment" data-target="#submitConfirm">Submit</button>
                         </form>
                     </div>
                 </div>
@@ -200,7 +227,25 @@
                                     <p>View Repositories for the user mohiit1502?</p>
                                 </div>
                             </div>
-                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitAddCollab   " data-target="#submitConfirm">Submit</button>
+                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitViewRepo" data-target="#submitConfirm">Submit</button>
+                        </form>
+                    </div>
+                </div>
+                <div id="closeissue" class="card hide widget good">
+                    <div class="card-body">
+                        <h5 class="card-title">Close Issue</h5>
+                        <form>
+                            <div class="form-row">
+                                <div class="form-group col-md-6 col-sm-6 col-lg-6 col-xs-6 mb-3">
+                                    <label for="repoForIssueClose">Repository Name</label>
+                                    <input type="text" class="form-control" id="repoForIssueClose" placeholder="Repository Name...." required>
+                                </div>
+                                <div class="form-group col-md-6 col-sm-6 col-lg-6 col-xs-6 mb-3">
+                                    <label for="issueNumerToClose">Issue To Close</label>
+                                    <input type="text" class="form-control" id="issueNumerToClose" placeholder="Specify issue number..." required>
+                                </div>
+                            </div>
+                            <button class="btn btn-primary" type="button" data-toggle="modal" data-dismiss="modal" id="btnSubmitCloseIssue" data-target="#submitConfirm">Submit</button>
                         </form>
                     </div>
                 </div>
@@ -246,6 +291,9 @@
                 </div>
             </div>
             <button style="display: none" id="emptyCommandMsgDisplayer" type="submit" data-toggle="modal" data-target="#emptyCommandMessageModal"></button>
+            <div class="overlay">
+                <div id="loading-img"></div>
+            </div>
             <!-- Cards -->
             <div class="card-group" id="conversations">
                 <div class="card">

public/login.html

@@ -4,9 +4,12 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>Document</title>
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" crossorigin="anonymous">
+    <title>Login</title>
 </head>
 <body id="login">
-    <a href="https://github.com/login/oauth/authorize?scope=user:email:repo&client_id=f6f649a1fe2dfea082ba">Click here</a> to begin!
+    <!-- <div class="container"><button class="btn btn-primary" id="git_bridge">Login</button></div>  -->
+    <a href="https://github.com/login/oauth/authorize?scope=user repo notifications delete_repo&client_id=f6f649a1fe2dfea082ba" class="btn btn-primary">Login!</a>
+    <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
 </body>
 </html>

public/validate.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Document</title>
+    <style>
+    #loading-img {
+        background: url(http://preloaders.net/preloaders/360/Velocity.gif) center center no-repeat;
+        height: 100%;
+        z-index: 20;
+    }
+
+    .overlay {
+        background: #e9e9e9;
+        display: none;
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        opacity: 0.5;
+    }
+    </style>
+</head>
+<body>
+    <div class="overlay">
+        <div id="loading-img"></div>
+    </div>
+</body>
+</html>

src/js/bot/recast-ops.js

@@ -32,6 +32,7 @@ module.exports = class Recast {
                 if(intent !== undefined) {
                     domManipulator.displayIntentBox(intent);
                     domManipulator.showWidget(intent);
+                    domManipulator.addGitOperationHistory(command, 'command');
                     domManipulator.populateRecastData(intent, bodyRelevant);
                   //  self.processIntent(intent);
                 }

src/js/config.js

@@ -25,8 +25,32 @@ module.exports = {
             "cardDataUrl": "html_url",
             "cardDataName": "title"
         },
+        'closeissue' : {
+            "requestMethod": 'post',
+            "intentMessage": "Close an issue in Github",
+            "getDataOperation": "getCloseIssueJson",
+            "githubOperation": "closeIssue",
+            "showWidgetOperation": "showCloseIssueWidget",
+            "populateDataOperation": "populateCloseIssueData",
+            "successMessage": "Issue Closed!",
+            "cardMsg": "Issue Closed as requested!",
+            "cardDataUrl": "html_url",
+            "cardDataName": "title"
+        },
+        'addissuecomment' : {
+            "requestMethod": 'post',
+            "intentMessage": "Add a comment on an issue in Github",
+            "getDataOperation": "getAddCommentJson",
+            "githubOperation": "addIssueComment",
+            "showWidgetOperation": "showAddCommentWidget",
+            "populateDataOperation": "populateAddCommentData",
+            "successMessage": "Comment Added!",
+            "cardMsg": "Comment Added as Requested, view here: ",
+            "cardDataUrl": "html_url",
+            "cardDataName": "title"
+        },
         'addcollab' : {
-            "Method": 'post',
+            "requestMethod": 'post',
             "intentMessage": "Add a collaborator",
             "getDataOperation": "getAddCollaboratorJson",
             "githubOperation": "addCollaborator",

src/js/dom-ops.js

@@ -239,6 +239,27 @@ module.exports = class DomManipulator {
         }
     }
 
+    populateAddCommentData(recastResponse) {
+        var repoForIssueCommentTextField = document.getElementById('repoForIssueComment');
+        var issueNumberTextField = document.getElementById('issueNumber');
+        var issueCommentTextArea = document.getElementById('issueComment');
+        if(repoForIssueCommentTextField && recastResponse && recastResponse.entities['git-repository'] && recastResponse.entities['git-repository'].length > 0 
+                && recastResponse.entities['git-repository']['0']['value']) {
+            var repoForIssueComment = recastResponse.entities['git-repository']['0']['value'];
+            repoForIssueCommentTextField.value = repoForIssueComment;
+        }
+        if(issueNumberTextField && recastResponse && recastResponse.entities['issue_id'] && recastResponse.entities['issue_id'].length > 0 
+                && recastResponse.entities['issue_id']['0']['value']) {
+            var issueNumber = recastResponse.entities['issue_id']['0']['value'];
+            issueNumberTextField.value = issueNumber;
+        }
+        if(issueCommentTextArea && recastResponse && recastResponse.entities['issue_comment'] && recastResponse.entities['issue_comment'].length > 0 
+                && recastResponse.entities['issue_comment']['0']['value']) {
+            var issueComment = recastResponse.entities['issue_comment']['0']['value'];
+            issueCommentTextArea.value = issueComment ;
+        }
+    }
+
     isVisible(element) {
         return element ? !element.classList.contains('hide') : false;
     }
@@ -286,6 +307,16 @@ module.exports = class DomManipulator {
         return data;
     }
 
+    getCloseIssueJson() {
+        var data = {};
+        data.urlParams = {};
+        if(this.isVisible(document.getElementById("closeissue"))) {
+            data.urlParams.issueId = document.getElementById("issueNumerToClose").value;
+            data.urlParams.repoName = document.getElementById("repoForIssueClose").value;
+        }
+        return data;
+    }
+
     getAddCollaboratorJson() {
         var data = {};
         data.urlParams = {};
@@ -296,6 +327,19 @@ module.exports = class DomManipulator {
         return data;
     }
 
+    getAddCommentJson() {
+        var data = {};
+        data.urlParams = {};
+        var request = {};
+        if(this.isVisible(document.getElementById("addissuecomment"))) {
+            request.body = document.getElementById('issueComment').value;
+            data.urlParams.issueId = document.getElementById("issueNumber").value;
+            data.urlParams.repoName = document.getElementById("repoForIssueComment").value;
+        }
+        data.request = request;
+        return data;
+    }
+
     addGitOperationHistory(data, type) {
         var intent = $('#' + $config.costants.hiddenIntentFieldId).val();
         var requestMethod = $config.intentSlugToOperations[intent].requestMethod;
@@ -305,6 +349,8 @@ module.exports = class DomManipulator {
         var card = document.createElement('div');
         var cardBody = document.createElement('div');
         var cardTitle = document.createElement('h5');
+        var closeAnchor = document.createElement('a');
+        var closeHeader = document.createElement('h6');
         var cardText = document.createElement('p');
         var cardFooter = document.createElement('div');
         var textMuted = document.createElement('small');
@@ -315,11 +361,16 @@ module.exports = class DomManipulator {
         card.classList.add('card', type);
         cardBody.classList.add('card-body');
         cardTitle.classList.add('card-title');
+        closeAnchor.classList.add('close');
+        // closeAnchor.setAttribute('href', '#');
         cardText.classList.add('card-text');
         cardFooter.classList.add('card-footer');
         textMuted.classList.add('text-muted');
         underCardLine.classList.add('line');
 
+        // Add content
+        closeHeader.innerHTML = 'x';
+
         var x = this.display_ct(0, textMuted);
         if(type === 'command') {
             // Add content
@@ -349,6 +400,8 @@ module.exports = class DomManipulator {
         }
 
         // Associations
+        closeAnchor.appendChild(closeHeader);
+        cardTitle.appendChild(closeAnchor);
         cardBody.appendChild(cardTitle);
         cardBody.appendChild(cardText);
         cardFooter.appendChild(textMuted);
@@ -437,7 +490,7 @@ module.exports = class DomManipulator {
             td_2.innerHTML = "<a href='" + currentRepo.html_url + "' class='repoLink'>" + currentRepo.id + "</a>";
             td_3.innerHTML = currentRepo.created_at;
             td_4.innerHTML = "<a href='" + currentRepo.owner.html_url + "' class='btn btn-info'>" + currentRepo.owner.login + "</a>";
-            td_5.innerHTML = "<a href='" + currentRepo.owner.url + "' class='btn btn-info'>View</a>";
+            td_5.innerHTML = "<a href='" + currentRepo.url + "' class='btn btn-info'>View</a>";
             td_6.innerHTML = "<a href='" + currentRepo.owner.html_url + "' class='btn btn-danger'>Delete</a>";
 
             // Associations
@@ -455,6 +508,10 @@ module.exports = class DomManipulator {
         return table;
     } 
 
+    concealCodeInUrl() {
+        window.location = "http://localhost:8080";
+    }
+
     toggleModals(response) {
         var self = this;
         var promise = response.json();
@@ -477,6 +534,7 @@ module.exports = class DomManipulator {
             $('#dangerAlert').removeClass('hide');
             self.addGitOperationHistory(response.status);
         }
+        $('#' + $config.costants.hiddenIntentFieldId).val('');
     }
 
     display_ct (start, element) {

src/js/event-toggles.js

@@ -8,6 +8,8 @@ const $config = require('./config.js');
 
 
 module.exports = $(document).ready(function () {
+    // console.log('test');
+    app.setToken();
     $('#sidebarCollapse').on('click', function () {
         $('#sidebar').toggleClass('active');
         $('.hideable').toggleClass('hide');
@@ -32,7 +34,6 @@ module.exports = $(document).ready(function () {
             if (command) {
                 var text = { "text": command };
                 recastclient.getAndCallProcessIntent(command, text);
-                dom.addGitOperationHistory(command, 'command');
             } else {
                 dom.showEmptyCommandMessage();
             }
@@ -55,30 +56,26 @@ module.exports = $(document).ready(function () {
     $("#hideSuccessAlert").on('click', function () {
         $('#successAlert').addClass('hide');
     });
-    $('.close').click(function () {
+    $('#conversations').on('click', '.close', function () {
         var $target = $(this).closest('.card');
+        var line = $target.next();
         $target.hide('slow', function () { $target.remove(); });
+        line.hide('slow', function () { line.remove(); });
     });
     $("#hideDangerAlert").on('click', function () {
         $('#dangerAlert').addClass('hide');
     });
-
+    $('#git_bridge').on('click', function() {
-    var urlParam = getUrlParameter('code');
+        window.location.href = 'https://github.com/login/oauth/authorize?scope=user:email:repo&client_id=f6f649a1fe2dfea082ba';
-    app.getToken(urlParam);
+        // var user = app.getCurrentUser();
-
+        // if(user) {
-});
+        //     window.location.href = './../continue.html'
-
+        // } else {
-var getUrlParameter = function getUrlParameter(sParam) {
+        //     window.location.href = 'https://github.com/login/oauth/authorize?scope=user:email:repo&client_id=f6f649a1fe2dfea082ba';
-    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
+        // }
-        sURLVariables = sPageURL.split('&'),
+    })
-        sParameterName,
+    if(window.location.href.match(/\?code=(.*)/) ) {
-        i;
+        var code = window.location.href.match(/\?code=(.*)/)[1];
-
+        app.getToken(code);
-    for (i = 0; i < sURLVariables.length; i++) {
-        sParameterName = sURLVariables[i].split('=');
-
-        if (sParameterName[0] === sParam) {
-            return sParameterName[1] === undefined ? true : sParameterName[1];
-        }
     }
-};
+});

src/js/github-ops.js

@@ -3,6 +3,9 @@ const GithubHelper = require('./helper.js');
 const githubHelper = new GithubHelper();
 const DomManipulator = require('./dom-ops.js');
 const dom = new DomManipulator();
+const PersistentOps = require('./persistent-ops.js');
+const persistentOps = new PersistentOps();
+
 
 module.exports = class Github {
 
@@ -10,33 +13,41 @@ module.exports = class Github {
         this.authorizationToken =  "token " + config.gitToken;
     }
 
-    getToken(getTokenRequest) {
+    getToken(code) {
         var token = '';
-        let url = 'https://cors-anywhere.herokuapp.com/https://github.com/login/oauth/access_token';
+        self = this;
-        fetch(url, {
+        $.getJSON('http://localhost:9999/authenticate/' + code, function(data) {
-                method: "POST",
+            console.log(data.token);
-                headers: {
+            token = data.token;
-                    "Content-Type": "application/json; charset=utf-8",
+            // set cookie here
-                    "Application": "application/json; charset=utf-8"
+            persistentOps.setCookie('gitToken', token, 30);
-                },
+            // self.authorizationToken = "token " + persistentOps.getCookie('gitToken');
-                body: JSON.stringify(getTokenRequest)
+            dom.concealCodeInUrl();
-            }
+        });
-        )
-        .then(function(response) {
-            console.log("token get success");
-            response.json().then(function(body){
-                console.log(response);
-                token = body.access_token; 
-                console.log(body);
-                console.log(token); 
-                return token;
-            });
-            // dom.toggleModals(response);
-        })
-        .catch(error => console.error('Fetch Error =\n', error));
         return token;
     }
 
+    getCurrentUser() {
+        var repositories = '';
+        let url = 'https://api.github.com/user/';
+        fetch(url, {
+                method: "GET",
+                headers: {
+                    "Content-Type": "application/json; charset=utf-8"
+                }
+            }
+        )
+        .then(function(response) {
+            response.json().then(function(body){
+                repositories = body; 
+                console.log(repositories); 
+                return repositories;
+            });
+            dom.toggleModals(response);
+        })
+        .catch(error => console.error('Fetch Error =\n', error));
+        return repositories;
+    }
     authenticate() {
 
     }
@@ -148,8 +159,6 @@ module.exports = class Github {
     }
 
     closeIssue(closeIssueJson, repoName, issueNumber) {
-        repoName = 'stack_route_prj7';
-        issueNumber = 2;
         let url = 'https://api.github.com/repos/mohiit1502/' + repoName + '/issues/' + issueNumber;
         fetch(url, {
                 method: "PATCH",
@@ -160,7 +169,9 @@ module.exports = class Github {
                 body: JSON.stringify(closeIssueJson)
             }
         )
-        .then(response => response.json())
+        .then(function(response) {
+            dom.toggleModals(response);
+        })
         .catch(error => console.error('Fetch Error =\n', error)); 
     }
 
@@ -205,10 +216,8 @@ module.exports = class Github {
         return issues;
     }
 
-    addIssueComment(commentBodyJson, repoName, issueNumber) {
+    addIssueComment(commentBodyJson, repoName, issueId) {
-        repoName = "stack_route_prj7";
+        let url = 'https://api.github.com/repos/mohiit1502/' + repoName + '/issues/' + issueId + "/comments";
-        issueNumber = 2;
-        let url = 'https://api.github.com/repos/mohiit1502/' + repoName + '/issues/' + issueNumber + "/comments";
         fetch(url, {
                 method: "POST",
                 headers: {
@@ -218,7 +227,9 @@ module.exports = class Github {
                 body: JSON.stringify(commentBodyJson)
             }
         )
-        .then(response => response.json())
+        .then(function(response) {
+            dom.toggleModals(response);
+        })
         .catch(error => console.error('Fetch Error =\n', error)); 
     }
 

src/js/microbot-ops.js

@@ -1,5 +1,7 @@
 const Github = require('./github-ops.js');
 const $github = new Github()
+const PersistentOps = require('./persistent-ops.js');
+const persistentOps = new PersistentOps();
 
 module.exports = class Microbot {
 
@@ -10,11 +12,15 @@ module.exports = class Microbot {
     }
 
     getToken(code) {
-        $github.getToken({
+        $github.getToken(code);
-            'client_id': 'f6f649a1fe2dfea082ba',
+    }
-            'client_secret': '7e9a33d05ffdb36b4a498140bb9bb06d62de4f0e',
+
-            'code': code 
+    setToken() {
-        });
+        $github.authorizationToken = "token " + persistentOps.getCookie('gitToken');
+    }
+
+    getCurrentUser() {
+        $github.getCurrentUser();
     }
 
     viewRepositories() {
@@ -72,11 +78,12 @@ module.exports = class Microbot {
         });
     }
 
-    closeIssue() {
+    closeIssue(requestData) {
+        var repoName = requestData.urlParams.repoName;
+        var issueId = requestData.urlParams.issueId;
         $github.closeIssue({
-            "milestone": 1,
             "state": "close",
-        });
+        }, repoName, issueId);
     }
 
     displayIssue() {
@@ -90,10 +97,11 @@ module.exports = class Microbot {
         })
     }
 
-    addIssueComment() {
+    addIssueComment(requestData) {
-        $github.addIssueComment({
+        var requestJson = requestData.request;
-            "body": "This is another test issue comment"
+        var repoName = requestData.urlParams.repoName;
-        });
+        var issueId = requestData.urlParams.issueId;
+        $github.addIssueComment(requestJson, repoName, issueId);
     }
 
     displayLastComment() {

src/js/persistent-ops.js

@@ -0,0 +1,29 @@
+module.exports = class PersistentOps {
+    getLatestComment(comments) {
+        if(comments && comments.length > 0)
+            return comments[comments.length - 1]['body'];
+    }
+
+    setCookie(cname, cvalue, exdays) {
+        var d = new Date();
+        d.setTime(d.getTime() + (exdays*24*60*60*1000));
+        var expires = "expires="+ d.toUTCString();
+        document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
+    }
+
+    getCookie(cname) {
+        var name = cname + "=";
+        var decodedCookie = decodeURIComponent(document.cookie);
+        var ca = decodedCookie.split(';');
+        for(var i = 0; i <ca.length; i++) {
+            var c = ca[i];
+            while (c.charAt(0) == ' ') {
+                c = c.substring(1);
+            }
+            if (c.indexOf(name) == 0) {
+                return c.substring(name.length, c.length);
+            }
+        }
+        return "";
+    }
+}

src/styles/scss/base.scss

@@ -313,6 +313,54 @@ ADDITIONS
     text-decoration: underline;
 }
 
+.headerprompt {
+  display: flex;
+  width: 100%;
+}
+
+.logotext {
+  color: $theme-supplementer;
+}
+
+#content nav div.collapse li a.nav-link i.far {
+  color: $theme-supplementer;
+  font-size: 1.8em;
+  padding: 0.2em;
+}
+
+#loading-img {
+    background: url(http://preloaders.net/preloaders/360/Velocity.gif) center center no-repeat;
+    height: 100%;
+    z-index: 20;
+}
+
+.overlay {
+    background: #e9e9e9;
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    opacity: 0.5;
+}
+
+.loader {
+    border: 0px solid #f3f3f3;
+    border-radius: 50%;
+    border-top: 2px solid #3498db;
+    border-right: 2px solid #3498db;
+    width: 20px;
+    height: 20px;
+    -webkit-animation: spin 2s linear infinite; /* Safari */
+    animation: spin 2s linear infinite;
+  }
+  
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
 @keyframes anim {
     0% {
       display: none;
@@ -336,37 +384,6 @@ ADDITIONS
   100%{   color: #000;    }
 }
 
-.headerprompt {
-  display: flex;
-  width: 100%;
-}
-
-.logotext {
-  color: $theme-supplementer;
-}
-
-#content nav div.collapse li a.nav-link i.far {
-  color: $theme-supplementer;
-  font-size: 1.8em;
-  padding: 0.2em;
-}
-
-.loader {
-    border: 0px solid #f3f3f3;
-    border-radius: 50%;
-    border-top: 2px solid #3498db;
-    border-right: 2px solid #3498db;
-    width: 20px;
-    height: 20px;
-    -webkit-animation: spin 2s linear infinite; /* Safari */
-    animation: spin 2s linear infinite;
-  }
-  
-  @keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-  }
-
 /* --------------------------------------------------
   OVERRIDES
   --------------------------------------------------*/

test.html

@@ -1,12 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>Document</title>
-</head>
-<body>
-    Hi
-</body>
-</html>

webpack.config.js

@@ -18,6 +18,10 @@ module.exports = {
             template: './public/index.html'
             // template: './test.html'
         })
+        // new HtmlWebpackPlugin({
+        //     template: './public/login.html'
+        //     // template: './test.html'
+        // })
     ],
     mode: 'development'
 };