From 52a54740001c8d8043abdd9aac17daf74ef22e48 Mon Sep 17 00:00:00 2001
From: "Hemanth V. Alluri" <hdrive1999@gmail.com>
Date: Wed, 12 Jun 2019 17:52:37 +0530
Subject: [PATCH] realm_plan_type: Restrict uploading organization logos by
 plan type.

Using the page_param variable "plan_includes_wide_organization_logo"
disallow users in a realm with a "LIMITED" plan type from uploading
their own wide organization logos and instead suggest that they
upgrade their plan using the page_param variable
"upgrade_text_for_wide_organization_logo" for the suggestion message.

Backend validation for this feature already exists.
---
 static/js/admin.js                                  |  3 +++
 static/js/settings_org.js                           |  6 ++++--
 static/styles/settings.scss                         |  9 +++++++++
 .../settings/organization-profile-admin.handlebars  | 13 +++++++++++++
 4 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/static/js/admin.js b/static/js/admin.js
index b0f1e7cbc4..8e057ed063 100644
--- a/static/js/admin.js
+++ b/static/js/admin.js
@@ -68,6 +68,9 @@ exports.build_page = function () {
         realm_digest_emails_enabled: page_params.realm_digest_emails_enabled,
         realm_digest_weekday: page_params.realm_digest_weekday,
         development: page_params.development_environment,
+        plan_includes_wide_organization_logo: page_params.plan_includes_wide_organization_logo,
+        upgrade_text_for_wide_organization_logo:
+            page_params.upgrade_text_for_wide_organization_logo,
     };
 
     options.admin_settings_label = admin_settings_label;
diff --git a/static/js/settings_org.js b/static/js/settings_org.js
index d02b391260..dbbbf7a711 100644
--- a/static/js/settings_org.js
+++ b/static/js/settings_org.js
@@ -1156,8 +1156,10 @@ exports.build_page = function () {
         });
     }
 
-    realm_logo.build_realm_logo_widget(upload_realm_logo, false);
-    realm_logo.build_realm_logo_widget(upload_realm_logo, true);
+    if (page_params.plan_includes_wide_organization_logo) {
+        realm_logo.build_realm_logo_widget(upload_realm_logo, false);
+        realm_logo.build_realm_logo_widget(upload_realm_logo, true);
+    }
 
 
     $('#deactivate_realm_button').on('click', function (e) {
diff --git a/static/styles/settings.scss b/static/styles/settings.scss
index 7e0db25eb6..bee130c1a8 100644
--- a/static/styles/settings.scss
+++ b/static/styles/settings.scss
@@ -114,6 +114,15 @@ label {
     margin-bottom: 10px;
 }
 
+.upgrade_realm_plan_type_suggestion {
+    font-size: 16px;
+}
+
+.upgrade_realm_plan_type_suggestion::after {
+    font-family: FontAwesome;
+    content: "\f135";
+}
+
 .user-avatar-section {
     float: right;
 }
diff --git a/static/templates/settings/organization-profile-admin.handlebars b/static/templates/settings/organization-profile-admin.handlebars
index 32a813abb5..863619bffe 100644
--- a/static/templates/settings/organization-profile-admin.handlebars
+++ b/static/templates/settings/organization-profile-admin.handlebars
@@ -56,6 +56,15 @@
                     <i class="fa fa-question-circle-o" aria-hidden="true"></i>
                 </a>
             </h3>
+            <div>
+                {{#unless plan_includes_wide_organization_logo}}
+                <p class="upgrade_realm_plan_type_suggestion">
+                    <a href="https://zulipchat.com/plans/" target="_blank">
+                        {{upgrade_text_for_wide_organization_logo}}
+                    </a>
+                </p>
+                {{/unless}}
+            </div>
         </div>
 
         <p>{{t "A wide image for the upper left corner of the app." }}</p>
@@ -67,6 +76,7 @@
             </div>
             <div class="inline-block avatar-controls">
                 <div id="realm_logo_file_input_error" class="alert text-error"></div>
+                {{#if plan_includes_wide_organization_logo}}
                 <button class="button rounded sea-green w-200 block input-size"
                   id="realm_logo_upload_button">
                     <span id="upload_logo_button_text">{{t 'Upload new logo' }}</span>
@@ -74,6 +84,7 @@
                 </button>
                 <button class="button rounded btn-danger w-200 m-t-10 block input-size"
                   id="realm_logo_delete_button">{{t 'Delete logo' }}</button>
+                {{/if}}
             </div>
         </div>
 
@@ -86,6 +97,7 @@
             </div>
             <div class="inline-block avatar-controls">
                 <div id="realm_night_logo_file_input_error" class="alert text-error"></div>
+                {{#if plan_includes_wide_organization_logo}}
                 <button class="button rounded sea-green w-200 block input-size"
                   id="realm_night_logo_upload_button">
                     <span id="upload_night_logo_button_text">{{t 'Upload new logo' }}</span>
@@ -93,6 +105,7 @@
                 </button>
                 <button class="button rounded btn-danger w-200 m-t-10 block input-size"
                   id="realm_night_logo_delete_button">{{t 'Delete logo' }}</button>
+                {{/if}}
             </div>
         </div>