[Задача 12799] Добавил кнопку асинхронного обновления списка опечаток

cp/javascript/src/components/SiteList.jsx

 import React from 'react'
 import {Nav, NavItem, NavLink, TabContent, TabPane, Alert, Badge} from "reactstrap";
 import TypoList from "./TypoList/";
+import FaRefresh from 'react-icons/lib/fa/refresh';
+
 
 export default class SiteList extends React.Component {
 
@@ -8,7 +10,6 @@ export default class SiteList extends React.Component {
         super(props);
 
         this.sites = this.props.sites;
-
         this.state = {
             activeTab: 0,
             error: false,
@@ -16,6 +17,10 @@ export default class SiteList extends React.Component {
 
         this.typos = [];
 
+        this.updateTyposForActiveSite();
+    }
+
+    updateTyposForActiveSite = () => {
         this.loadSiteTypos(this.state.activeTab, () =>
             this.forceUpdate()
         );
@@ -62,6 +67,9 @@ export default class SiteList extends React.Component {
                         {this.typos.length}
                     </Badge>
                 </NavLink>
+                {this.state.activeTab === index ?
+                    <FaRefresh className="refresh-site" title="Обновить" onClick={this.updateTyposForActiveSite} /> :
+                    null}
             </NavItem>
         );
 
@@ -86,7 +94,7 @@ export default class SiteList extends React.Component {
             if (this.state.activeTab === index) {
                 return (
                     <TabPane key={index} tabId={index}>
-                        <TypoList siteId={site.id} typos={this.typos}/>
+                        <TypoList siteId={site.id} typos={this.typos} />
                     </TabPane>
                 );
             } else { // Если не активная вкладка - то не рендерим содержимое

cp/javascript/src/style.css

@@ -3,4 +3,25 @@
     margin-left: 10px;
     color: #ffc107;
     background-color: #007bff;
-}
\ No newline at end of file
+}
+
+.nav-item {
+    position: relative;
+}
+
+.refresh-site {
+    position: absolute;
+    right: 10px;
+    top: 13px;
+}
+
+.refresh-site:hover {
+    -webkit-animation:spin 2s linear infinite;
+    -moz-animation:spin 2s linear infinite;
+    animation:spin 2s linear infinite;
+}
+
+/* Rotation animation */
+@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
+@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
+@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
\ No newline at end of file