From 85dfa1ccad34a30749bbb14f117e6ad586f8615c Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Wed, 30 May 2018 15:13:05 +0200
Subject: [PATCH] Always show the restore and clone tabs

---
 src/views/apps.html | 135 +++++++++++++++++++++++---------------------
 1 file changed, 70 insertions(+), 65 deletions(-)

diff --git a/src/views/apps.html b/src/views/apps.html
index 0d4daca12..8977c2848 100644
--- a/src/views/apps.html
+++ b/src/views/apps.html
@@ -182,87 +182,92 @@
             </div>
             <div class="modal-body">
               <p class="text-center" ng-show="appRestore.busyFetching"><i class="fa fa-circle-o-notch fa-spin"></i> Fetching backups</p>
-              <p class="text-danger" ng-show="appRestore.backups.length === 0 && !appRestore.busyFetching">This app has no backups to restore or clone from yet.</p>
 
               <button type="button" class="btn btn-primary pull-right" ng-click="appRestore.createBackup()" ng-hide="appRestore.busyFetching" ng-disabled="appRestore.app.installationState === 'pending_backup'"><i class="fa fa-circle-o-notch fa-spin" ng-show="appRestore.app.installationState === 'pending_backup'"></i> Create Backup</button>
 
-              <uib-tabset active="appRestore.action" ng-show="!appRestore.busyFetching && appRestore.backups.length">
+              <uib-tabset active="appRestore.action" ng-show="!appRestore.busyFetching">
                 <!-- restore -->
                 <uib-tab index="'restore'" heading="Restore">
                   <br/>
-                  <p>Restoring the app will lose all content generated since the backup.</p>
-                  <label class="control-label">Select Backup</label>
-                  <div class="dropdown">
-                  <button type="button" class="btn btn-default" data-toggle="dropdown">{{ appRestore.selectedBackup.creationTime | prettyDate }} - v{{appRestore.selectedBackup.version}} ({{ appRestore.selectedBackup.creationTime | prettyLongDate }})  <span class="caret"></span></button>
-                  <ul class="dropdown-menu" role="menu">
-                    <li ng-repeat="backup in appRestore.backups | orderBy:'-creationTime'">
-                      <a href="" ng-click="appRestore.selectBackup(backup)">{{ backup.creationTime | prettyDate }} - v{{backup.version}} ({{ backup.creationTime | prettyLongDate }})</a>
-                    </li>
-                  </ul>
+                  <p class="text-danger" ng-hide="appRestore.backups.length">This app has no backups to restore or clone from yet.</p>
+                  <div ng-show="appRestore.backups.length">
+                    <p>Restoring the app will lose all content generated since the backup.</p>
+                    <label class="control-label">Select Backup</label>
+                    <div class="dropdown">
+                    <button type="button" class="btn btn-default" data-toggle="dropdown">{{ appRestore.selectedBackup.creationTime | prettyDate }} - v{{appRestore.selectedBackup.version}} ({{ appRestore.selectedBackup.creationTime | prettyLongDate }})  <span class="caret"></span></button>
+                    <ul class="dropdown-menu" role="menu">
+                      <li ng-repeat="backup in appRestore.backups | orderBy:'-creationTime'">
+                        <a href="" ng-click="appRestore.selectBackup(backup)">{{ backup.creationTime | prettyDate }} - v{{backup.version}} ({{ backup.creationTime | prettyLongDate }})</a>
+                      </li>
+                    </ul>
+                    </div>
+                    <br/>
+                    <fieldset>
+                      <form role="form" ng-submit="appRestore.restore()" autocomplete="off">
+                        <div class="form-group" ng-class="{ 'has-error': appRestore.error.password }">
+                          <label class="control-label" for="appRestorePasswordInput">Provide your password to confirm this action</label>
+                          <div ng-show="appRestore.error.password"><small>Wrong password</small></div>
+                          <input type="password" class="form-control" ng-model="appRestore.password" id="appRestorePasswordInput" name="password" required autofocus>
+                        </div>
+                        <input class="ng-hide" type="submit" ng-disabled="!appRestore.password || appRestore.busy || !appRestore.selectedBackup"/>
+                      </form>
+                    </fieldset>
                   </div>
-                  <br/>
-                  <fieldset>
-                    <form role="form" ng-submit="appRestore.restore()" autocomplete="off">
-                      <div class="form-group" ng-class="{ 'has-error': appRestore.error.password }">
-                        <label class="control-label" for="appRestorePasswordInput">Provide your password to confirm this action</label>
-                        <div ng-show="appRestore.error.password"><small>Wrong password</small></div>
-                        <input type="password" class="form-control" ng-model="appRestore.password" id="appRestorePasswordInput" name="password" required autofocus>
-                      </div>
-                      <input class="ng-hide" type="submit" ng-disabled="!appRestore.password || appRestore.busy || !appRestore.selectedBackup"/>
-                    </form>
-                  </fieldset>
                 </uib-tab>
 
                 <!-- clone -->
                 <uib-tab index="'clone'" heading="Clone">
                   <br/>
-                  <label class="control-label">Select Backup</label>
-                  <div class="dropdown">
-                  <button type="button" class="btn btn-default" data-toggle="dropdown">{{ appRestore.selectedBackup.creationTime | prettyDate }} - v{{appRestore.selectedBackup.version}} ({{ appRestore.selectedBackup.creationTime | prettyLongDate }})  <span class="caret"></span></button>
-                  <ul class="dropdown-menu" role="menu">
-                    <li ng-repeat="backup in appRestore.backups | orderBy:'-creationTime'">
-                      <a href="" ng-click="appRestore.selectBackup(backup)">{{ backup.creationTime | prettyDate }} - v{{backup.version}} ({{ backup.creationTime | prettyLongDate }})</a>
-                    </li>
-                  </ul>
-                  </div>
-                  <br/>
-                  <fieldset>
-                    <form role="form" name="appCloneForm" ng-submit="appRestore.clone()" autocomplete="off">
-                      <div class="has-error text-center" ng-show="appRestore.error.other" ng-bind-html="appRestore.error.other"></div>
-                      <div class="form-group" ng-class="{ 'has-error': (appCloneForm.location.$dirty && appCloneForm.location.$invalid) || (!appCloneForm.location.$dirty && appRestore.error.location) }">
-                        <label class="control-label" for="appRestoreLocationInput">Location {{ appRestore.error.location }} </label>
-                        <div class="input-group form-inline">
-                          <input type="text" class="form-control" ng-model="appRestore.location" id="appRestoreLocationInput" name="location" placeholder="Leave empty to use bare domain" autofocus>
-                          <div class="input-group-btn">
-                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-                              {{ (appRestore.location ? (appRestore.domain.provider !== 'caas' ? '.' : '-') : '') + appRestore.domain.domain }}
-                              <span class="caret"></span>
-                            </button>
-                            <ul class="dropdown-menu dropdown-menu-right" role="menu">
-                              <li ng-repeat="domain in domains">
-                                <a href="" ng-click="appRestore.domain = domain">{{ domain.domain }}</a>
-                              </li>
-                            </ul>
+                  <p class="text-danger" ng-hide="appRestore.backups.length">This app has no backups to restore or clone from yet.</p>
+                  <div ng-show="appRestore.backups.length">
+                    <label class="control-label">Select Backup</label>
+                    <div class="dropdown">
+                    <button type="button" class="btn btn-default" data-toggle="dropdown">{{ appRestore.selectedBackup.creationTime | prettyDate }} - v{{appRestore.selectedBackup.version}} ({{ appRestore.selectedBackup.creationTime | prettyLongDate }})  <span class="caret"></span></button>
+                    <ul class="dropdown-menu" role="menu">
+                      <li ng-repeat="backup in appRestore.backups | orderBy:'-creationTime'">
+                        <a href="" ng-click="appRestore.selectBackup(backup)">{{ backup.creationTime | prettyDate }} - v{{backup.version}} ({{ backup.creationTime | prettyLongDate }})</a>
+                      </li>
+                    </ul>
+                    </div>
+                    <br/>
+                    <fieldset>
+                      <form role="form" name="appCloneForm" ng-submit="appRestore.clone()" autocomplete="off">
+                        <div class="has-error text-center" ng-show="appRestore.error.other" ng-bind-html="appRestore.error.other"></div>
+                        <div class="form-group" ng-class="{ 'has-error': (appCloneForm.location.$dirty && appCloneForm.location.$invalid) || (!appCloneForm.location.$dirty && appRestore.error.location) }">
+                          <label class="control-label" for="appRestoreLocationInput">Location {{ appRestore.error.location }} </label>
+                          <div class="input-group form-inline">
+                            <input type="text" class="form-control" ng-model="appRestore.location" id="appRestoreLocationInput" name="location" placeholder="Leave empty to use bare domain" autofocus>
+                            <div class="input-group-btn">
+                              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                {{ (appRestore.location ? (appRestore.domain.provider !== 'caas' ? '.' : '-') : '') + appRestore.domain.domain }}
+                                <span class="caret"></span>
+                              </button>
+                              <ul class="dropdown-menu dropdown-menu-right" role="menu">
+                                <li ng-repeat="domain in domains">
+                                  <a href="" ng-click="appRestore.domain = domain">{{ domain.domain }}</a>
+                                </li>
+                              </ul>
+                            </div>
                           </div>
                         </div>
-                      </div>
 
-                      <p class="text-center" ng-show="appRestore.location && appRestore.domain.provider === 'manual' && !appRestore.domain.config.wildcard">
-                        <b>Add an A record manually for {{ appRestore.location }} to this Cloudron's public IP</b>
-                        <br>
-                      </p>
+                        <p class="text-center" ng-show="appRestore.location && appRestore.domain.provider === 'manual' && !appRestore.domain.config.wildcard">
+                          <b>Add an A record manually for {{ appRestore.location }} to this Cloudron's public IP</b>
+                          <br>
+                        </p>
 
-                      <div class="has-error text-center" ng-show="appRestore.error.port">{{ appRestore.error.port }}</div>
-                      <div ng-repeat="(env, info) in appRestore.portBindingsInfo">
-                        <ng-form name="portInfo_form">
-                          <div class="form-group" ng-class="{ 'has-error': (!appRestore.itemName{{$index}}.$dirty && appRestore.error.port) || (portInfo_form.itemName{{$index}}.$dirty && portInfo_form.itemName{{$index}}.$invalid) }">
-                            <label class="control-label" for="inputPortInfo{{env}}"><input type="checkbox" ng-model="appRestore.portBindingsEnabled[env]"> {{ info.description }} ({{ HOST_PORT_MIN }} - {{ HOST_PORT_MAX }})</label>
-                            <input type="number" class="form-control" ng-model="appRestore.portBindings[env]" ng-disabled="!appRestore.portBindingsEnabled[env]" id="inputPortInfo{{env}}" later-name="itemName{{$index}}" min="{{hostPortMin}}" max="{{hostPortMax}}" required>
-                          </div>
-                        </ng-form>
-                      </div>
-                    </form>
-                  </fieldset>
+                        <div class="has-error text-center" ng-show="appRestore.error.port">{{ appRestore.error.port }}</div>
+                        <div ng-repeat="(env, info) in appRestore.portBindingsInfo">
+                          <ng-form name="portInfo_form">
+                            <div class="form-group" ng-class="{ 'has-error': (!appRestore.itemName{{$index}}.$dirty && appRestore.error.port) || (portInfo_form.itemName{{$index}}.$dirty && portInfo_form.itemName{{$index}}.$invalid) }">
+                              <label class="control-label" for="inputPortInfo{{env}}"><input type="checkbox" ng-model="appRestore.portBindingsEnabled[env]"> {{ info.description }} ({{ HOST_PORT_MIN }} - {{ HOST_PORT_MAX }})</label>
+                              <input type="number" class="form-control" ng-model="appRestore.portBindings[env]" ng-disabled="!appRestore.portBindingsEnabled[env]" id="inputPortInfo{{env}}" later-name="itemName{{$index}}" min="{{hostPortMin}}" max="{{hostPortMax}}" required>
+                            </div>
+                          </ng-form>
+                        </div>
+                      </form>
+                    </fieldset>
+                  </div>
                 </uib-tab>
               </uib-tabset>
             </div>