From b10346496b4eb40ea06781ee2641c67ef7de198d Mon Sep 17 00:00:00 2001
From: Ben Schumacher <ben.schumacher@mattermost.com>
Date: Wed, 18 Mar 2026 07:11:18 +0100
Subject: [PATCH] [MM-67886] Remove height cap on Feature Flags table in System
 Console (#35556)

* [MM-67886] Remove height cap on Feature Flags table in System Console

The Feature Flags page is entirely dedicated to the table, so the
max-height restriction is unnecessary and leaves excessive blank space.
Add a --full-height modifier class to remove the cap on this page only.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* [MM-67886] Fix scrolling header on Feature Flags and Server Logs pages

Replace wrapper--admin with wrapper--fixed so the admin header stays
fixed while content scrolls, matching all other System Console pages.
Rework the logs CSS to use flex-based sizing instead of fixed heights
so only the innermost container (DataGrid_rows / log__panel) scrolls,
preventing double scrollbars.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* [MM-67886] Fix CSS property order lint errors

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../admin_console/feature_flags.tsx           |  6 ++--
 .../__snapshots__/logs.test.tsx.snap          |  2 +-
 .../admin_console/server_logs/log_list.scss   |  2 +-
 .../admin_console/server_logs/logs.tsx        |  2 +-
 .../server_logs/plain_log_list.tsx            |  2 +-
 .../src/sass/routes/_admin-console.scss       | 29 ++++++++++++-------
 6 files changed, 25 insertions(+), 18 deletions(-)

diff --git a/webapp/channels/src/components/admin_console/feature_flags.tsx b/webapp/channels/src/components/admin_console/feature_flags.tsx
index 6e30c61c12b..9c368b5e645 100644
--- a/webapp/channels/src/components/admin_console/feature_flags.tsx
+++ b/webapp/channels/src/components/admin_console/feature_flags.tsx
@@ -30,12 +30,12 @@ const FeatureFlags: React.FC<Props> = (props: Props) => {
     }
 
     return (
-        <div className='wrapper--admin'>
+        <div className='wrapper--fixed'>
             <AdminHeader>
                 <FormattedMessage {...messages.title}/>
             </AdminHeader>
             <div className='admin-console__wrapper'>
-                <div className='admin-logs-content admin-console__content'>
+                <div className='admin-console__content'>
                     <div className={'banner info'}>
                         <div className='banner__content'>
                             <FormattedMessage
@@ -45,7 +45,7 @@ const FeatureFlags: React.FC<Props> = (props: Props) => {
                         </div>
                     </div>
                     <div className='job-table__panel'>
-                        <div className='job-table__table'>
+                        <div className='job-table__table job-table__table--full-height'>
                             <table
                                 className='table'
                             >
diff --git a/webapp/channels/src/components/admin_console/server_logs/__snapshots__/logs.test.tsx.snap b/webapp/channels/src/components/admin_console/server_logs/__snapshots__/logs.test.tsx.snap
index 97d39f17e04..ee8e1bf7407 100644
--- a/webapp/channels/src/components/admin_console/server_logs/__snapshots__/logs.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/server_logs/__snapshots__/logs.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`components/admin_console/server_logs/Logs should display the logs correctly after loading 1`] = `
 <div>
   <div
-    class="wrapper--admin"
+    class="wrapper--fixed"
   >
     <div
       class="admin-console__header"
diff --git a/webapp/channels/src/components/admin_console/server_logs/log_list.scss b/webapp/channels/src/components/admin_console/server_logs/log_list.scss
index feb1fca8ea6..7a6a335815c 100644
--- a/webapp/channels/src/components/admin_console/server_logs/log_list.scss
+++ b/webapp/channels/src/components/admin_console/server_logs/log_list.scss
@@ -1,5 +1,5 @@
 .LogTable {
-    overflow: auto;
+    overflow: hidden;
 
     .DataGrid {
         .DataGrid_row {
diff --git a/webapp/channels/src/components/admin_console/server_logs/logs.tsx b/webapp/channels/src/components/admin_console/server_logs/logs.tsx
index b1dafa76bfe..6352c7b4929 100644
--- a/webapp/channels/src/components/admin_console/server_logs/logs.tsx
+++ b/webapp/channels/src/components/admin_console/server_logs/logs.tsx
@@ -217,7 +217,7 @@ export default class Logs extends React.PureComponent<Props, State> {
         }
 
         return (
-            <div className='wrapper--admin'>
+            <div className='wrapper--fixed'>
                 <AdminHeader>
                     <FormattedMessage {...messages.title}/>
                 </AdminHeader>
diff --git a/webapp/channels/src/components/admin_console/server_logs/plain_log_list.tsx b/webapp/channels/src/components/admin_console/server_logs/plain_log_list.tsx
index 7e8da498d21..14a8ccc070c 100644
--- a/webapp/channels/src/components/admin_console/server_logs/plain_log_list.tsx
+++ b/webapp/channels/src/components/admin_console/server_logs/plain_log_list.tsx
@@ -138,7 +138,7 @@ class PlainLogList extends React.PureComponent<Props, State> {
             );
         }
         return (
-            <div>
+            <div className='plain-log-list'>
                 <div
                     tabIndex={-1}
                     ref={this.logPanel}
diff --git a/webapp/channels/src/sass/routes/_admin-console.scss b/webapp/channels/src/sass/routes/_admin-console.scss
index aee15635ee1..ff8a8b5af02 100644
--- a/webapp/channels/src/sass/routes/_admin-console.scss
+++ b/webapp/channels/src/sass/routes/_admin-console.scss
@@ -37,13 +37,6 @@
         flex: 1 1 auto;
         padding: 20px;
 
-        > .wrapper--admin {
-            display: flex;
-            overflow: auto;
-            height: 100%;
-            flex-direction: column;
-        }
-
         .admin-console__filters-rows {
             display: flex;
             flex-wrap: wrap;
@@ -196,7 +189,8 @@
     .log__panel {
         overflow: scroll;
         width: 100%;
-        height: calc(100vh - 280px);
+        min-height: 0;
+        flex: 1;
         padding: 10px;
         border: variables.$border-gray;
         margin-top: 14px;
@@ -610,6 +604,10 @@
     border: variables.$border-gray;
     margin: 20px 0 10px;
     background-color: variables.$white;
+
+    &--full-height {
+        max-height: none;
+    }
 }
 
 .admin-console__disabled-text {
@@ -1112,6 +1110,7 @@
 
 .admin-console .admin-console__content.admin-logs-content {
     display: flex;
+    overflow: hidden;
     max-width: none;
     height: 100%;
     flex-direction: column;
@@ -1148,7 +1147,8 @@
     }
 
     .LogTable {
-        height: 100%;
+        min-height: 0;
+        flex: 1;
 
         .DataGrid {
             display: flex;
@@ -1157,11 +1157,18 @@
 
             .DataGrid_rows {
                 overflow: auto;
-                height: 100%;
-                min-height: 100% !important;
+                min-height: 0 !important;
+                flex: 1;
             }
         }
     }
+
+    .plain-log-list {
+        display: flex;
+        min-height: 0;
+        flex: 1;
+        flex-direction: column;
+    }
 }
 
 div[disabled] {