settings: Make custom profile fields table consistent with others.

We change the custom profile fields table to have same header as
of other table and as a result this also makes the page look
better if an organization has zero custom profile fields.

web/src/settings_profile_fields.js

@@ -67,17 +67,6 @@ function is_valid_to_display_in_summary(field_type) {
     return true;
 }
 
-function update_profile_fields_table_element() {
-    const $profile_fields_table = $("#admin_profile_fields_table").expectOne();
-
-    // If there are no custom fields, hide the table headers at the top
-    if (page_params.custom_profile_fields.length < 1) {
-        $profile_fields_table.hide();
-    } else {
-        $profile_fields_table.show();
-    }
-}
-
 function delete_profile_field(e) {
     e.preventDefault();
     e.stopPropagation();
@@ -104,7 +93,6 @@ function delete_profile_field(e) {
         const opts = {
             success_continuation() {
                 display_success_status();
-                update_profile_fields_table_element();
             },
         };
         dialog_widget.submit_api_request(channel.del, url, {}, opts);
@@ -681,7 +669,6 @@ export function do_populate_profile_fields(profile_fields_data) {
     }
 
     update_profile_fields_checkboxes();
-    update_profile_fields_table_element();
     loading.destroy_indicator($("#admin_page_profile_fields_loading_indicator"));
 }
 

web/styles/settings.css

@@ -132,7 +132,7 @@ h3,
     margin-right: 10px;
 }
 
-#admin_profile_fields_table {
+.admin_profile_fields_table {
     & th.display,
     td.display_in_profile_summary_cell {
         text-align: center;
@@ -226,6 +226,7 @@ h3,
     /* Limit the actions column to not using excessive width */
     .admin-table-wrapper table.admin_profile_fields_table tr .actions {
         width: 11%;
+        min-width: 70px;
     }
 }
 

web/templates/settings/profile_field_settings_admin.hbs

@@ -8,7 +8,8 @@
     </div>
     <div class="admin-table-wrapper">
         <table class="table table-condensed table-striped admin_profile_fields_table">
-            <tbody id="admin_profile_fields_table">
+            <thead>
+                <tr>
                     <th>{{t "Label" }}</th>
                     <th>{{t "Hint" }}</th>
                     <th>{{t "Type" }}</th>
@@ -16,7 +17,9 @@
                     <th class="display">{{t "Card"}}</th>
                     <th class="actions">{{t "Actions" }}</th>
                     {{/if}}
-            </tbody>
+                </tr>
+            </thead>
+            <tbody id="admin_profile_fields_table" class="required-text" data-empty="{{t 'No custom profile field configured for this organization.' }}"></tbody>
         </table>
     </div>
 </div>