From 610349f24b9f5977efc444e653a9fc2ddaeda97c Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Tue, 18 Feb 2020 22:20:11 +0300
Subject: [PATCH] Add button for rebooting the instance in desktop, tablet and
 mobile interface

---
 src/lang/en.js                      |  3 ++-
 src/store/modules/settings.js       | 10 ++++----
 src/views/settings/index.vue        | 37 ++++++++++++++++++++++-------
 src/views/settings/styles/main.scss | 33 ++++++++++++++++++-------
 4 files changed, 61 insertions(+), 22 deletions(-)

diff --git a/src/lang/en.js b/src/lang/en.js
index 3fa42e8c..df122612 100644
--- a/src/lang/en.js
+++ b/src/lang/en.js
@@ -363,7 +363,8 @@ export default {
     assets: 'Assets',
     emoji: 'Emoji',
     markup: 'Markup settings',
-    corsPlug: 'CORS plug config'
+    corsPlug: 'CORS plug config',
+    instanceReboot: 'Instance Reboot'
   },
   invites: {
     inviteTokens: 'Invite tokens',
diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js
index 0ecbc9a2..84c4a9dd 100644
--- a/src/store/modules/settings.js
+++ b/src/store/modules/settings.js
@@ -6,11 +6,13 @@ const settings = {
   state: {
     activeTab: 'instance',
     configDisabled: true,
-    description: [],
-    settings: {},
-    updatedSettings: {},
     db: {},
-    loading: true
+    description: [],
+    loading: true,
+    needReboot: true,
+    settings: {},
+    updatedSettings: {}
+
   },
   mutations: {
     CLEAR_UPDATED_SETTINGS: (state) => {
diff --git a/src/views/settings/index.vue b/src/views/settings/index.vue
index bc2099ad..cca7959f 100644
--- a/src/views/settings/index.vue
+++ b/src/views/settings/index.vue
@@ -3,17 +3,25 @@
     <div v-if="isDesktop">
       <div class="settings-header-container">
         <h1 class="settings-header">{{ $t('settings.settings') }}</h1>
-        <el-link
-          :underline="false"
-          href="https://docs-develop.pleroma.social/backend/administration/CLI_tasks/config/"
-          target="_blank">
-          <el-button class="settings-docs-button">
+        <div>
+          <el-button v-if="needReboot" class="settings-reboot-button">
             <span>
-              <i class="el-icon-document"/>
-              {{ $t('settings.seeDocs') }}
+              <i class="el-icon-refresh"/>
+              {{ $t('settings.instanceReboot') }}
             </span>
           </el-button>
-        </el-link>
+          <el-link
+            :underline="false"
+            href="https://docs-develop.pleroma.social/backend/administration/CLI_tasks/config/"
+            target="_blank">
+            <el-button class="settings-docs-button">
+              <span>
+                <i class="el-icon-document"/>
+                {{ $t('settings.seeDocs') }}
+              </span>
+            </el-button>
+          </el-link>
+        </div>
       </div>
       <el-tabs v-model="activeTab" tab-position="left">
         <el-tab-pane :label="$t('settings.activityPub')" :disabled="configDisabled" name="activityPub" lazy>
@@ -79,8 +87,16 @@
       </el-tabs>
     </div>
     <div v-if="isMobile || isTablet">
-      <h1 class="settings-header">{{ $t('settings.settings') }}</h1>
       <div class="settings-header-container">
+        <h1 class="settings-header">{{ $t('settings.settings') }}</h1>
+        <el-button v-if="needReboot" class="settings-reboot-button">
+          <span>
+            <i class="el-icon-refresh"/>
+            {{ $t('settings.instanceReboot') }}
+          </span>
+        </el-button>
+      </div>
+      <div class="nav-container">
         <el-select v-model="activeTab" class="settings-menu" placeholder="Select">
           <el-option
             v-for="item in options"
@@ -219,6 +235,9 @@ export default {
     },
     isTablet() {
       return this.$store.state.app.device === 'tablet'
+    },
+    needReboot() {
+      return this.$store.state.settings.needReboot
     }
   },
   mounted: function() {
diff --git a/src/views/settings/styles/main.scss b/src/views/settings/styles/main.scss
index e807deea..bc6cfff1 100644
--- a/src/views/settings/styles/main.scss
+++ b/src/views/settings/styles/main.scss
@@ -247,6 +247,8 @@
     margin-bottom: 10px;
   }
   .settings-container {
+    max-width: 1824px;
+    margin: auto;
     .el-tabs {
       margin-top: 20px
     }
@@ -269,6 +271,11 @@
     align-items: center;
     margin: 22px 30px 15px 15px;
   }
+  .settings-reboot-button {
+    width: 145px;
+    text-align: left;
+    padding: 10px;
+  }
   .single-input {
     margin-right: 10px
   }
@@ -318,10 +325,6 @@
   }
 
   @media only screen and (min-width: 1824px) {
-    .settings-container {
-      max-width: 1824px;
-      margin: auto;
-    }
     .submit-button-container {
       max-width: 1637px;
       margin-left: auto;
@@ -425,11 +428,20 @@
       justify-content: space-between;
     }
     .settings-header {
-      margin: 7px 10px 15px 15px;
+      width: fit-content;
+      display: inline-block;
+      margin: 0;
     }
     .settings-header-container {
       margin: 15px;
     }
+    .nav-container {
+      display: flex;
+      height: 36px;
+      justify-content: space-between;
+      align-items: center;
+      margin: 15px;
+    }
     .settings-menu {
       width: 163px;
     }
@@ -508,6 +520,7 @@
     }
   }
   @media only screen and (max-width:801px) and (min-width: 481px) {
+
     .delete-setting-button {
       margin: 4px 0 0 10px;
       height: 28px;
@@ -538,14 +551,18 @@
       display: flex;
       justify-content: space-between;
     }
+    .nav-container {
+      display: flex;
+      height: 36px;
+      justify-content: space-between;
+      align-items: center;
+      margin: 15px 30px 15px 15px;
+    }
     .rate-limit-label-container {
       width: 250px;
     }
     .settings-delete-button {
       float: right;
     }
-    .settings-header {
-      margin: 5px 0 0 15px;
-    }
   }
 }