feat(support): add support view (#1937)

api/cmd/portainer/main.go

@@ -139,7 +139,6 @@ func initSettings(settingsService portainer.SettingsService, flags *portainer.CL
 	if err == portainer.ErrSettingsNotFound {
 		settings := &portainer.Settings{
 			LogoURL:                     *flags.Logo,
-			DisplayDonationHeader:       true,
 			DisplayExternalContributors: false,
 			AuthenticationMethod:        portainer.AuthenticationInternal,
 			LDAPSettings: portainer.LDAPSettings{

api/http/handler/settings.go

@@ -46,7 +46,6 @@ func NewSettingsHandler(bouncer *security.RequestBouncer) *SettingsHandler {
 type (
 	publicSettingsResponse struct {
 		LogoURL                            string                         `json:"LogoURL"`
-		DisplayDonationHeader              bool                           `json:"DisplayDonationHeader"`
 		DisplayExternalContributors        bool                           `json:"DisplayExternalContributors"`
 		AuthenticationMethod               portainer.AuthenticationMethod `json:"AuthenticationMethod"`
 		AllowBindMountsForRegularUsers     bool                           `json:"AllowBindMountsForRegularUsers"`
@@ -57,7 +56,6 @@ type (
 		TemplatesURL                       string                 `valid:"required"`
 		LogoURL                            string                 `valid:""`
 		BlackListedLabels                  []portainer.Pair       `valid:""`
-		DisplayDonationHeader              bool                   `valid:""`
 		DisplayExternalContributors        bool                   `valid:""`
 		AuthenticationMethod               int                    `valid:"required"`
 		LDAPSettings                       portainer.LDAPSettings `valid:""`
@@ -92,7 +90,6 @@ func (handler *SettingsHandler) handleGetPublicSettings(w http.ResponseWriter, r
 
 	publicSettings := &publicSettingsResponse{
 		LogoURL:                            settings.LogoURL,
-		DisplayDonationHeader:              settings.DisplayDonationHeader,
 		DisplayExternalContributors:        settings.DisplayExternalContributors,
 		AuthenticationMethod:               settings.AuthenticationMethod,
 		AllowBindMountsForRegularUsers:     settings.AllowBindMountsForRegularUsers,
@@ -121,7 +118,6 @@ func (handler *SettingsHandler) handlePutSettings(w http.ResponseWriter, r *http
 		TemplatesURL:                       req.TemplatesURL,
 		LogoURL:                            req.LogoURL,
 		BlackListedLabels:                  req.BlackListedLabels,
-		DisplayDonationHeader:              req.DisplayDonationHeader,
 		DisplayExternalContributors:        req.DisplayExternalContributors,
 		LDAPSettings:                       req.LDAPSettings,
 		AllowBindMountsForRegularUsers:     req.AllowBindMountsForRegularUsers,

api/portainer.go

@@ -73,12 +73,13 @@ type (
 		TemplatesURL                       string               `json:"TemplatesURL"`
 		LogoURL                            string               `json:"LogoURL"`
 		BlackListedLabels                  []Pair               `json:"BlackListedLabels"`
-		DisplayDonationHeader              bool                 `json:"DisplayDonationHeader"`
 		DisplayExternalContributors        bool                 `json:"DisplayExternalContributors"`
 		AuthenticationMethod               AuthenticationMethod `json:"AuthenticationMethod"`
 		LDAPSettings                       LDAPSettings         `json:"LDAPSettings"`
 		AllowBindMountsForRegularUsers     bool                 `json:"AllowBindMountsForRegularUsers"`
 		AllowPrivilegedModeForRegularUsers bool                 `json:"AllowPrivilegedModeForRegularUsers"`
+		// Deprecated fields
+		DisplayDonationHeader bool
 	}
 
 	// User represents a user account.

api/swagger.yaml

@@ -2187,10 +2187,6 @@ definitions:
         description: "URL to a logo that will be displayed on the login page as well\
           \ as on top of the sidebar. Will use default Portainer logo when value is\
           \ empty string"
-      DisplayDonationHeader:
-        type: "boolean"
-        example: true
-        description: "Whether to display or not the donation message in the header."
       DisplayExternalContributors:
         type: "boolean"
         example: false
@@ -2294,10 +2290,6 @@ definitions:
           \ when querying containers"
         items:
           $ref: "#/definitions/Settings_BlackListedLabels"
-      DisplayDonationHeader:
-        type: "boolean"
-        example: true
-        description: "Whether to display or not the donation message in the header."
       DisplayExternalContributors:
         type: "boolean"
         example: false
@@ -2688,10 +2680,6 @@ definitions:
           \ when querying containers"
         items:
           $ref: "#/definitions/Settings_BlackListedLabels"
-      DisplayDonationHeader:
-        type: "boolean"
-        example: true
-        description: "Whether to display or not the donation message in the header."
       DisplayExternalContributors:
         type: "boolean"
         example: false

app/portainer/__module.js

@@ -253,6 +253,16 @@ angular.module('portainer.app', [])
     }
   };
 
+  var support = {
+    name: 'portainer.support',
+    url: '/support',
+    views: {
+      'content@': {
+        templateUrl: 'app/portainer/views/support/support.html'
+      }
+    }
+  };
+
   var users = {
     name: 'portainer.users',
     url: '/users',
@@ -319,6 +329,7 @@ angular.module('portainer.app', [])
   $stateRegistryProvider.register(registryCreation);
   $stateRegistryProvider.register(settings);
   $stateRegistryProvider.register(settingsAuthentication);
+  $stateRegistryProvider.register(support);
   $stateRegistryProvider.register(users);
   $stateRegistryProvider.register(user);
   $stateRegistryProvider.register(teams);

app/portainer/components/header-title.js

@@ -7,10 +7,9 @@ angular.module('portainer.app')
     },
     link: function (scope, iElement, iAttrs) {
       scope.username = Authentication.getUserDetails().username;
-      scope.displayDonationHeader = StateManager.getState().application.displayDonationHeader;
     },
     transclude: true,
-    template: '<div class="page white-space-normal">{{title}}<span class="header_title_content" ng-transclude></span><span class="pull-right user-box" ng-if="username"><i class="fa fa-user-circle" aria-hidden="true"></i> {{username}}</span><a ng-if="displayDonationHeader" ui-sref="portainer.about" class="pull-right" style="font-size:14px;margin-right:15px;margin-top:2px;"><span class="fa fa-heart fa-fw red-icon"></span>  Help support portainer</a></div>',
+    template: '<div class="page white-space-normal">{{title}}<span class="header_title_content" ng-transclude></span><span class="pull-right user-box" ng-if="username"><i class="fa fa-user-circle" aria-hidden="true"></i> {{username}}</span><a ui-sref="portainer.support" class="pull-right" style="font-size:14px;margin-right:15px;margin-top:2px;"><span class="fa fa-life-ring fa-fw red-icon"></span>  Portainer support</a></div>',
     restrict: 'E'
   };
   return directive;

app/portainer/models/settings/settings.js

@@ -2,7 +2,6 @@ function SettingsViewModel(data) {
   this.TemplatesURL = data.TemplatesURL;
   this.LogoURL = data.LogoURL;
   this.BlackListedLabels = data.BlackListedLabels;
-  this.DisplayDonationHeader = data.DisplayDonationHeader;
   this.DisplayExternalContributors = data.DisplayExternalContributors;
   this.AuthenticationMethod = data.AuthenticationMethod;
   this.LDAPSettings = data.LDAPSettings;

app/portainer/services/stateManager.js

@@ -30,18 +30,12 @@ function StateManagerFactory($q, SystemService, InfoHelper, LocalStorage, Settin
     LocalStorage.storeApplicationState(state.application);
   };
 
-  manager.updateDonationHeader = function(displayDonationHeader) {
-    state.application.displayDonationHeader = displayDonationHeader;
-    LocalStorage.storeApplicationState(state.application);
-  };
-
  function assignStateFromStatusAndSettings(status, settings) {
    state.application.authentication = status.Authentication;
    state.application.analytics = status.Analytics;
    state.application.endpointManagement = status.EndpointManagement;
    state.application.version = status.Version;
    state.application.logo = settings.LogoURL;
-   state.application.displayDonationHeader = settings.DisplayDonationHeader;
    state.application.displayExternalContributors = settings.DisplayExternalContributors;
    state.application.validity = moment().unix();
  }

app/portainer/views/about/about.html

@@ -25,14 +25,6 @@
         <p>
           It is a community effort to make <b>Portainer</b> as feature-rich as simple it is to deploy and use. We need all the help we can get!
         </p>
-        <p>
-          <i class="fa fa-chevron-circle-right" aria-hidden="true"></i> <u>Fund our work</u>
-          <ul>
-            <li>Become a <a href="https://www.patreon.com/Portainerio" target="_blank"><i class="fa fa-money-bill-alt" aria-hidden="true"></i> patron</a></li>
-            <li>Consider a <a href="https://portainer.io/support.html" target="_blank">paid support plan</a></li>
-            <li>Make a <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=YHXZJQNJQ36H6" target="_blank"><i class="fab fa-paypal" aria-hidden="true"></i> donation</a></li>
-          </ul>
-        </p>
         <p>
           <i class="fa fa-chevron-circle-right" aria-hidden="true"></i> <u>Contribute</u>
           <ul>

app/portainer/views/settings/settings.html

@@ -9,16 +9,6 @@
       <rd-widget-header icon="fa-cogs" title="Application settings"></rd-widget-header>
       <rd-widget-body>
         <form class="form-horizontal">
-          <div class="form-group">
-            <div class="col-sm-12">
-              <label for="toggle_donation" class="control-label text-left">
-                Disable donation header
-              </label>
-              <label class="switch" style="margin-left: 20px;">
-                <input type="checkbox" name="toggle_donation" ng-model="formValues.donationHeader"><i></i>
-              </label>
-            </div>
-          </div>
           <!-- logo -->
           <div class="form-group">
             <div class="col-sm-12">

app/portainer/views/settings/settingsController.js

@@ -9,7 +9,6 @@ function ($scope, $state, Notifications, SettingsService, StateManager, DEFAULT_
   $scope.formValues = {
     customLogo: false,
     customTemplates: false,
-    donationHeader: true,
     externalContributions: false,
     restrictBindMounts: false,
     restrictPrivilegedMode: false,
@@ -46,7 +45,6 @@ function ($scope, $state, Notifications, SettingsService, StateManager, DEFAULT_
       settings.TemplatesURL = DEFAULT_TEMPLATES_URL;
     }
 
-    settings.DisplayDonationHeader = !$scope.formValues.donationHeader;
     settings.DisplayExternalContributors = !$scope.formValues.externalContributions;
     settings.AllowBindMountsForRegularUsers = !$scope.formValues.restrictBindMounts;
     settings.AllowPrivilegedModeForRegularUsers = !$scope.formValues.restrictPrivilegedMode;
@@ -60,7 +58,6 @@ function ($scope, $state, Notifications, SettingsService, StateManager, DEFAULT_
     .then(function success(data) {
       Notifications.success('Settings updated');
       StateManager.updateLogo(settings.LogoURL);
-      StateManager.updateDonationHeader(settings.DisplayDonationHeader);
       StateManager.updateExternalContributions(settings.DisplayExternalContributors);
       $state.reload();
     })
@@ -83,7 +80,6 @@ function ($scope, $state, Notifications, SettingsService, StateManager, DEFAULT_
       if (settings.TemplatesURL !== DEFAULT_TEMPLATES_URL) {
         $scope.formValues.customTemplates = true;
       }
-      $scope.formValues.donationHeader = !settings.DisplayDonationHeader;
       $scope.formValues.externalContributions = !settings.DisplayExternalContributors;
       $scope.formValues.restrictBindMounts = !settings.AllowBindMountsForRegularUsers;
       $scope.formValues.restrictPrivilegedMode = !settings.AllowPrivilegedModeForRegularUsers;

app/portainer/views/support/support.html

@@ -0,0 +1,38 @@
+<rd-header>
+  <rd-header-title title="Support">
+  </rd-header-title>
+  <rd-header-content>
+    Portainer support
+  </rd-header-content>
+</rd-header>
+
+<div class="row">
+  <div class="col-sm-12">
+    <rd-widget>
+      <rd-widget-header title="Portainer support options" icon="fa-life-ring"></rd-widget-header>
+      <rd-widget-body>
+      <div class="small" style="line-height:1.65;">
+        <p>
+          Portainer.io offers multiple commercial support options.
+        </p>
+        <p>
+          <i class="fa fa-chevron-circle-right" aria-hidden="true"></i> <u>Per incident</u>
+          <ul>
+            <li>$USD 100</li>
+            <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=YHXZJQNJQ36H6" target="_blank"><i class="fab fa-paypal" aria-hidden="true"></i> Buy it here</a></li>
+          </ul>
+        </p>
+        <p>
+          <i class="fa fa-chevron-circle-right" aria-hidden="true"></i> <u>Per Portainer instance</u>
+          <ul>
+            <li>$USD 1200 per year</li>
+            <li>Unlimited incidents</li>
+            <li>4 named users</li>
+            <li><a target="_blank" href="mailto:info@portainer.io"><i class="fa fa-envelope" aria-hidden="true"></i> Contact us</a></li>
+          </ul>
+        </p>
+      </div>
+      </rd-widget-body>
+    </rd-widget>
+  </div>
+</div>