Merge pull request #12974 from codyrancher/deprecated-performance

Adding deprecated messaging to the performance settings page
rancher · Jan 15, 2025 · 6f0efbb · 6f0efbb
2 parents 0cd9bff + 91f6dcf
commit 6f0efbb
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 17 deletions.
diff --git a/shell/assets/translations/en-us.yaml b/shell/assets/translations/en-us.yaml
@@ -7516,6 +7516,7 @@ performance:
   label: UI Performance Settings
   settingName: Performance
   experimental: This setting is experimental and may be removed or updated in future versions.
+  deprecatedForSSP: The <i class="mr-5">"{setting}"</i> setting is now deprecated and will be removed in a future release. Please use the <a href="#ssp-setting" class="ml-5 mr-5">Server-side Pagination</a> setting instead.
   incrementalLoad:
     label: Incremental Loading
     setting: You can configure the threshold above which incremental loading will be used.

diff --git a/shell/pages/c/_cluster/settings/performance.vue b/shell/pages/c/_cluster/settings/performance.vue
@@ -209,7 +209,9 @@ export default {
       <div class="ui-perf-setting">
         <!-- Server Side Pagination -->
         <div class="mt-40">
-          <h2>{{ t('performance.serverPagination.label') }}</h2>
+          <h2 id="ssp-setting">
+            {{ t('performance.serverPagination.label') }}
+          </h2>
           <p>{{ t('performance.serverPagination.description') }}</p>
           <Banner
             color="error"
@@ -288,6 +290,11 @@ export default {
         <!-- Incremental Loading -->
         <div class="mt-40">
           <h2>{{ t('performance.incrementalLoad.label') }}</h2>
+          <Banner
+            color="warning"
+          >
+            <span v-clean-html="t(`performance.deprecatedForSSP`, { setting: t('performance.incrementalLoad.label') }, true)" />
+          </Banner>
           <p>{{ t('performance.incrementalLoad.description') }}</p>
           <Checkbox
             :value="value.incrementalLoading.enabled"
@@ -315,11 +322,12 @@ export default {
         <!-- Enable manual refresh list views -->
         <div class="mt-40">
           <h2 v-t="'performance.manualRefresh.label'" />
-          <p>{{ t('performance.manualRefresh.description') }}</p>
           <Banner
-            color="error"
-            label-key="performance.experimental"
-          />
+            color="warning"
+          >
+            <span v-clean-html="t(`performance.deprecatedForSSP`, { setting: t('performance.manualRefresh.label') }, true)" />
+          </Banner>
+          <p>{{ t('performance.manualRefresh.description') }}</p>
           <Checkbox
             :value="value.manualRefresh.enabled"
             :mode="mode"
@@ -346,11 +354,12 @@ export default {
         <!-- Enable GC of resources from store -->
         <div class="mt-40">
           <h2 v-t="'performance.gc.label'" />
-          <p>{{ t('performance.gc.description') }}</p>
           <Banner
-            color="error"
-            label-key="performance.experimental"
-          />
+            color="warning"
+          >
+            <span v-clean-html="t(`performance.deprecatedForSSP`, { setting: t('performance.gc.label') }, true)" />
+          </Banner>
+          <p>{{ t('performance.gc.description') }}</p>
           <Checkbox
             v-model:value="value.garbageCollection.enabled"
             :mode="mode"
@@ -426,11 +435,12 @@ export default {
         <!-- Force NS filter -->
         <div class="mt-40">
           <h2>{{ t('performance.nsFiltering.label') }}</h2>
-          <p>{{ t('performance.nsFiltering.description') }}</p>
           <Banner
-            color="error"
-            label-key="performance.experimental"
-          />
+            color="warning"
+          >
+            <span v-clean-html="t(`performance.deprecatedForSSP`, { setting: t('performance.nsFiltering.label') }, true)" />
+          </Banner>
+          <p>{{ t('performance.nsFiltering.description') }}</p>
           <Checkbox
             :value="value.forceNsFilterV2.enabled"
             :mode="mode"
@@ -443,11 +453,12 @@ export default {
         <!-- Advanced Websocket Worker -->
         <div class="mt-40">
           <h2>{{ t('performance.advancedWorker.label') }}</h2>
-          <p>{{ t('performance.advancedWorker.description') }}</p>
           <Banner
-            color="error"
-            label-key="performance.experimental"
-          />
+            color="warning"
+          >
+            <span v-clean-html="t(`performance.deprecatedForSSP`, { setting: t('performance.advancedWorker.label') }, true)" />
+          </Banner>
+          <p>{{ t('performance.advancedWorker.description') }}</p>
           <Checkbox
             v-model:value="value.advancedWorker.enabled"
             :mode="mode"