@rancher/shell 0.1.3 → 0.1.21

package/pages/prefs.vue

@@ -1,32 +1,41 @@
 <script>
 import day from 'dayjs';
 import { mapGetters } from 'vuex';
+import { isAdminUser } from '@shell/store/type-map';
 import BackLink from '@shell/components/BackLink';
 import BackRoute from '@shell/mixins/back-link';
 import ButtonGroup from '@shell/components/ButtonGroup';
 import { Checkbox } from '@components/Form/Checkbox';
 import LandingPagePreference from '@shell/components/LandingPagePreference';
 import {
-  mapPref, THEME, KEYMAP, DEV, DATE_FORMAT, TIME_FORMAT, ROWS_PER_PAGE, HIDE_DESC, SHOW_PRE_RELEASE, MENU_MAX_CLUSTERS
+  mapPref, THEME, KEYMAP, DATE_FORMAT, TIME_FORMAT, ROWS_PER_PAGE, HIDE_DESC, SHOW_PRE_RELEASE, MENU_MAX_CLUSTERS,
+  VIEW_IN_API, ALL_NAMESPACES, THEME_SHORTCUT, PLUGIN_DEVELOPER
 } from '@shell/store/prefs';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { addObject } from '@shell/utils/array';
+import LocaleSelector from '@shell/components/LocaleSelector';
 
 export default {
   layout:     'plain',
   components: {
-    BackLink, ButtonGroup, LabeledSelect, Checkbox, LandingPagePreference
+    BackLink, ButtonGroup, LabeledSelect, Checkbox, LandingPagePreference, LocaleSelector
   },
-  mixins:     [BackRoute],
-  computed:   {
-    keymap:          mapPref(KEYMAP),
-    dev:             mapPref(DEV),
-    dateFormat:      mapPref(DATE_FORMAT),
-    timeFormat:      mapPref(TIME_FORMAT),
-    perPage:         mapPref(ROWS_PER_PAGE),
-    hideDesc:        mapPref(HIDE_DESC),
-    showPreRelease:  mapPref(SHOW_PRE_RELEASE),
-    menuMaxClusters: mapPref(MENU_MAX_CLUSTERS),
+  mixins: [BackRoute],
+  data() {
+    return { admin: isAdminUser(this.$store.getters) };
+  },
+  computed: {
+    keymap:           mapPref(KEYMAP),
+    viewInApi:        mapPref(VIEW_IN_API),
+    allNamespaces:    mapPref(ALL_NAMESPACES),
+    themeShortcut:    mapPref(THEME_SHORTCUT),
+    dateFormat:       mapPref(DATE_FORMAT),
+    timeFormat:       mapPref(TIME_FORMAT),
+    perPage:          mapPref(ROWS_PER_PAGE),
+    hideDesc:         mapPref(HIDE_DESC),
+    showPreRelease:   mapPref(SHOW_PRE_RELEASE),
+    menuMaxClusters:  mapPref(MENU_MAX_CLUSTERS),
+    pluginDeveloper:  mapPref(PLUGIN_DEVELOPER),
 
     ...mapGetters(['isSingleProduct']),
 
@@ -137,101 +146,112 @@ export default {
         this.hideDesc = val;
       }
     },
-  },
+  }
 };
 </script>
 
 <template>
   <div>
     <BackLink :link="backLink" />
-    <h1 v-t="'prefs.title'" />
-
-    <h4 v-t="'prefs.theme.label'" />
-    <div>
-      <ButtonGroup v-model="theme" :options="themeOptions" />
+    <h1 v-t="'prefs.title'" class="mb-20" />
+    <!-- Language -->
+    <div class="mt-10 mb-10">
+      <h4 v-t="'prefs.language'" />
+      <div class="row">
+        <div class="col span-4">
+          <LocaleSelector />
+        </div>
+      </div>
     </div>
-    <div class="mt-10">
-      <t k="prefs.theme.autoDetail" :pm="pm" :am="am" />
+    <!-- Theme -->
+    <div class="mt-10 mb-10">
+      <hr />
+      <h4 v-t="'prefs.theme.label'" />
+      <ButtonGroup v-model="theme" :options="themeOptions" />
+      <div class="mt-10">
+        <t k="prefs.theme.autoDetail" :pm="pm" :am="am" />
+      </div>
     </div>
-    <div v-if="!isSingleProduct">
+    <!-- Login landing page -->
+    <div v-if="!isSingleProduct" class="mt-10 mb-10">
       <hr />
       <h4 v-t="'prefs.landing.label'" />
       <LandingPagePreference />
     </div>
-    <hr />
-    <h4 v-t="'prefs.displaySettings.title'" />
-    <p class="set-landing-leadin">
-      {{ t('prefs.displaySettings.detail', {}, raw=true) }}
-    </p>
-    <div class="row mt-20">
-      <div class="col span-4">
-        <LabeledSelect
-          v-model="dateFormat"
-          :label="t('prefs.dateFormat.label')"
-          :options="dateOptions"
-        />
-      </div>
-      <div class="col span-4">
-        <LabeledSelect
-          v-model="timeFormat"
-          :label="t('prefs.timeFormat.label')"
-          :options="timeOptions"
-        />
+    <!-- Display Settings -->
+    <div class="mt-10 mb-10">
+      <hr />
+      <h4 v-t="'prefs.displaySettings.title'" />
+      <p class="set-landing-leadin">
+        {{ t('prefs.displaySettings.detail', {}, raw=true) }}
+      </p>
+      <div class="row mt-20">
+        <div class="col span-4">
+          <LabeledSelect
+            v-model="dateFormat"
+            :label="t('prefs.dateFormat.label')"
+            :options="dateOptions"
+          />
+        </div>
+        <div class="col span-4">
+          <LabeledSelect
+            v-model="timeFormat"
+            :label="t('prefs.timeFormat.label')"
+            :options="timeOptions"
+          />
+        </div>
       </div>
-    </div>
 
-    <div class="row mt-20">
-      <div class="col span-4">
-        <LabeledSelect
-          v-model.number="perPage"
-          :label="t('prefs.perPage.label')"
-          :options="perPageOptions"
-          option-key="value"
-          option-label="label"
-          placeholder="Select a row count"
-        />
-      </div>
-      <div class="col span-4">
-        <LabeledSelect
-          v-model.number="menuMaxClusters"
-          :label="t('prefs.clusterToShow.label')"
-          :options="menuClusterOptions"
-          option-key="value"
-          option-label="label"
-          placeholder="Select a row count"
-        />
+      <div class="row mt-20">
+        <div class="col span-4">
+          <LabeledSelect
+            v-model.number="perPage"
+            :label="t('prefs.perPage.label')"
+            :options="perPageOptions"
+            option-key="value"
+            option-label="label"
+            placeholder="Select a row count"
+          />
+        </div>
+        <div class="col span-4">
+          <LabeledSelect
+            v-model.number="menuMaxClusters"
+            :label="t('prefs.clusterToShow.label')"
+            :options="menuClusterOptions"
+            option-key="value"
+            option-label="label"
+            placeholder="Select a row count"
+          />
+        </div>
       </div>
     </div>
-
-    <hr />
-    <div class="row">
-      <div class="col prefs-advanced">
-        <h4 v-t="'prefs.advanced'" />
-        <Checkbox v-model="dev" :label="t('prefs.dev.label', {}, true)" />
-        <p class="wrap-text">
-          {{ t('prefs.advancedTooltip') }}
-        </p>
-        <br>
-        <Checkbox v-if="!isSingleProduct" v-model="hideDescriptions" :label="t('prefs.hideDesc.label')" class="mt-10" />
-      </div>
+    <!-- Advanced Features -->
+    <div class="col adv-features mt-10 mb-10">
+      <hr />
+      <h4 v-t="'prefs.advFeatures.title'" />
+      <Checkbox v-model="viewInApi" :label="t('prefs.advFeatures.viewInApi', {}, true)" class="mt-10" />
+      <br />
+      <Checkbox v-model="allNamespaces" :label="t('prefs.advFeatures.allNamespaces', {}, true)" class="mt-20" />
+      <br />
+      <Checkbox v-model="themeShortcut" :label="t('prefs.advFeatures.themeShortcut', {}, true)" class="mt-20" />
+      <br />
+      <Checkbox v-if="!isSingleProduct" v-model="hideDescriptions" :label="t('prefs.hideDesc.label')" class="mt-20" />
+      <template v-if="admin">
+        <br />
+        <Checkbox v-model="pluginDeveloper" :label="t('prefs.advFeatures.pluginDeveloper', {}, true)" class="mt-20" />
+      </template>
     </div>
-
-    <hr />
-    <div class="row">
-      <div class="col span-12">
-        <h4 v-t="'prefs.keymap.label'" />
-        <ButtonGroup v-model="keymap" :options="keymapOptions" />
-      </div>
+    <!-- YAML editor key mapping -->
+    <div class="col mt-10 mb-10">
+      <hr />
+      <h4 v-t="'prefs.keymap.label'" />
+      <ButtonGroup v-model="keymap" :options="keymapOptions" />
     </div>
-
-    <div v-if="!isSingleProduct">
+    <!-- Helm Charts -->
+    <div v-if="!isSingleProduct" class="col mt-10 mb-40">
       <hr />
-      <div class="row mb-20">
-        <div class="col span-12">
-          <h4 v-t="'prefs.helm.label'" />
-          <ButtonGroup v-model="showPreRelease" :options="helmOptions" />
-        </div>
-      </div>
+      <h4 v-t="'prefs.helm.label'" />
+      <ButtonGroup v-model="showPreRelease" :options="helmOptions" />
     </div>
   </div>
 </template>

package/pages/safeMode.vue

@@ -0,0 +1,17 @@
+<script>
+export default {
+  middleware({ redirect, store } ) {
+    const dashboardHome = { name: 'home' };
+    const t = store.getters['i18n/t'];
+
+    setTimeout(() => {
+      store.dispatch('growl/success', {
+        title:   t('plugins.safeMode.title'),
+        message: t('plugins.safeMode.message')
+      }, { root: true });
+    }, 1000);
+
+    return redirect(dashboardHome);
+  }
+};
+</script>

package/pages/support/index.vue

@@ -1,17 +1,13 @@
 <script>
-import { options } from '@shell/config/footer';
 import BannerGraphic from '@shell/components/BannerGraphic';
-import AsyncButton from '@shell/components/AsyncButton';
 import IndentedPanel from '@shell/components/IndentedPanel';
-import { Card } from '@components/Card';
 import CommunityLinks from '@shell/components/CommunityLinks';
 import { CATALOG, MANAGEMENT } from '@shell/config/types';
-import { getVendor, setBrand } from '@shell/config/private-label';
+import { getVendor } from '@shell/config/private-label';
 import { SETTING } from '@shell/config/settings';
 import { findBy } from '@shell/utils/array';
 import { addParam } from '@shell/utils/url';
-
-const KEY_REGEX = /^[0-9a-fA-F]{16}$/;
+import { isRancherPrime } from '@shell/config/version';
 
 export default {
   layout: 'home',
@@ -19,8 +15,6 @@ export default {
   components: {
     BannerGraphic,
     IndentedPanel,
-    AsyncButton,
-    Card,
     CommunityLinks
   },
 
@@ -50,9 +44,7 @@ export default {
     if ( this.$store.getters['management/canList'](CATALOG.APP) ) {
       this.apps = await this.$store.dispatch('management/findAll', { type: CATALOG.APP });
     }
-    this.supportSetting = await fetchOrCreateSetting('has-support', 'false');
     this.brandSetting = await fetchOrCreateSetting(SETTING.BRAND, '');
-    this.communitySetting = await fetchOrCreateSetting(SETTING.COMMUNITY_LINKS, 'true');
     this.serverUrlSetting = await fetchOrCreateSetting(SETTING.SERVER_URL, '');
     this.uiIssuesSetting = await this.$store.dispatch('management/find', { type: MANAGEMENT.SETTING, id: SETTING.ISSUES });
   },
@@ -62,10 +54,8 @@ export default {
       apps:                 [],
       vendor:               getVendor(),
       supportKey:           '',
-      supportSetting:       null,
       brandSetting:         null,
       uiIssuesSetting:      null,
-      communitySetting:     null,
       serverSetting:        null,
       promos:               [
         'support.promos.one',
@@ -81,6 +71,10 @@ export default {
       return findBy(this.apps, 'metadata.name', 'rancher-csp-adapter' );
     },
 
+    hasSupport() {
+      return this.hasAWSSupport || isRancherPrime();
+    },
+
     hasAWSSupport() {
       return !!this.cspAdapter;
     },
@@ -103,68 +97,15 @@ export default {
       return `${ this.serverUrl }/v1/generateSUSERancherSupportConfig`;
     },
 
-    hasSupport() {
-      return (this.supportSetting?.value && this.supportSetting?.value !== 'false') || this.hasAWSSupport;
-    },
-
-    options() {
-      return options( this.uiIssuesSetting?.value, this.communitySetting?.value === 'false');
-    },
-
     title() {
       return this.hasSupport ? 'support.suse.title' : 'support.community.title';
     },
 
-    validSupportKey() {
-      return !!this.supportKey.match(KEY_REGEX);
-    },
-
     sccLink() {
       return this.hasAWSSupport ? addParam('https://scc.suse.com', 'from_marketplace', '1') : 'https://scc.suse.com';
     }
   },
 
-  methods: {
-    async addSubscription(done) {
-      try {
-        this.supportSetting.value = 'true';
-        this.brandSetting.value = 'suse';
-        await Promise.all([this.supportSetting.save(), this.brandSetting.save()]);
-        setBrand('suse');
-        done(true);
-        this.$modal.hide('toggle-support');
-      } catch {
-        done(false);
-      }
-    },
-
-    async removeSubscription(done) {
-      try {
-        this.supportSetting.value = 'false';
-        this.brandSetting.value = '';
-        await Promise.all([this.supportSetting.save(), this.brandSetting.save()]);
-        setBrand('');
-        done(true);
-        this.$modal.hide('toggle-support');
-      } catch {
-        done(false);
-      }
-    },
-
-    showDialog(isAdd) {
-      this.isRemoveDialog = isAdd;
-      this.supportKey = '';
-      this.$modal.show('toggle-support');
-    },
-
-    dialogOpened() {
-      const input = this.$refs.subscriptionIDInput;
-
-      if (input) {
-        input.focus();
-      }
-    },
-  }
 };
 </script>
 <template>
@@ -173,10 +114,18 @@ export default {
 
     <IndentedPanel>
       <div class="content mt-20">
-        <div class="promo">
+        <div class="promo col main-panel">
           <div class="box mb-20 box-primary">
             <h2>{{ t('support.suse.access.title') }}</h2>
-            <div>
+            <div v-if="!hasSupport" class="external support-links mt-20">
+              <div class="support-link">
+                <a class="support-link" href="https://rancher.com/support-maintenance-terms" target="_blank" rel="noopener noreferrer nofollow">{{ t('support.community.learnMore') }}</a>
+              </div>
+              <div class="support-link">
+                <a class="support-link" href="https://rancher.com/pricing" target="_blank" rel="noopener noreferrer nofollow">{{ t('support.community.pricing') }}</a>
+              </div>
+            </div>
+            <div v-else>
               <p class="pb-10">
                 {{ hasAWSSupport ? t("support.suse.access.aws.text") : t("support.suse.access.text") }}
               </p>
@@ -194,69 +143,28 @@ export default {
               <div>{{ t(`${key}.text`) }}</div>
             </div>
           </div>
-          <div v-if="!hasSupport" class="external">
-            <a href="https://rancher.com/support-maintenance-terms" target="_blank" rel="noopener noreferrer nofollow">{{ t('support.community.learnMore') }} <i class="icon icon-external-link" /></a>
-            or
-            <a href="https://rancher.com/pricing" target="_blank" rel="noopener noreferrer nofollow">{{ t('support.community.pricing') }} <i class="icon icon-external-link" /></a>
-          </div>
-          <div v-if="!hasSupport" class="register row">
-            <div>
-              {{ t('support.subscription.haveSupport') }}
-            </div>
-            <button class="ml-5 btn role-secondary btn-sm" type="button" @click="showDialog(false)">
-              {{ t('support.subscription.addSubscription') }}
-            </button>
-          </div>
-          <div v-if="hasSupport && !hasAWSSupport" class="register row">
-            <a class="remove-link" @click="showDialog(true)">
-              {{ t('support.subscription.removeSubscription') }}
-            </a>
-          </div>
-        </div>
-        <div class="community">
-          <CommunityLinks />
         </div>
+        <CommunityLinks :is-support-page="true" class="community col side-panel span-3" />
       </div>
     </IndentedPanel>
-    <modal
-      name="toggle-support"
-      height="auto"
-      :width="340"
-      @opened="dialogOpened"
-    >
-      <Card :show-highlight-border="false" class="toggle-support">
-        <template #title>
-          {{ isRemoveDialog? t('support.subscription.removeTitle') : t('support.subscription.addTitle') }}
-        </template>
-        <template #body>
-          <div v-if="isRemoveDialog" class="mt-20">
-            {{ t('support.subscription.removeBody') }}
-          </div>
-          <div v-else class="mt-20">
-            <p class="pb-10">
-              {{ t('support.subscription.addLabel') }}
-            </p>
-            <input ref="subscriptionIDInput" v-model="supportKey" />
-          </div>
-        </template>
-        <template #actions>
-          <button type="button" class="btn role-secondary" @click="$modal.hide('toggle-support')">
-            {{ t('generic.cancel') }}
-          </button>
-          <AsyncButton v-if="!isRemoveDialog" :disabled="!validSupportKey" class="pull-right" @click="addSubscription" />
-          <AsyncButton v-else :action-label="t('generic.remove')" class="pull-right" @click="removeSubscription" />
-        </template>
-      </Card>
-    </modal>
   </div>
 </template>
 <style lang="scss" scoped>
 .content {
-  display: grid;
-  grid-column-gap: 20px;
-  grid-row-gap: 20px;
-  grid-template-columns: 70% 30%;
-}
+
+    display: flex;
+    align-items: stretch;
+    .col {
+      margin: 0
+    }
+    .main-panel {
+      flex: auto;
+    }
+
+    .side-panel {
+      margin-left: 1.75%;
+    }
+  }
 
 .toggle-support {
     height: 100%;
@@ -271,21 +179,10 @@ export default {
     }
 }
 
-.community {
-  border-left: 1px solid var(--border);
-  padding-left: 20px;
-  > h2 {
-    font-size: 18px;
-    font-weight: 300;
-    margin-bottom: 20px;
-  }
-  .support-link {
-    margin: 10px 0;
-  }
-}
-.external {
-  margin-top: 20px;
+.support-link:not(:first-child) {
+  margin: 15px 0 0 0;
 }
+
 .register {
   display: flex;
   align-items: center;

package/pkg/dynamic-importer.lib.js

@@ -53,6 +53,10 @@ export function resolveList(key) {
   return undefined;
 }
 
+export function resolveChart(key) {
+  return undefined;
+}
+
 export function resolveEdit(key) {
   return undefined;
 }

package/plugins/dashboard-store/actions.js

@@ -5,6 +5,7 @@ import { SPOOFED_API_PREFIX, SPOOFED_PREFIX } from '@shell/store/type-map';
 import { createYaml } from '@shell/utils/create-yaml';
 import { classify } from '@shell/plugins/dashboard-store/classify';
 import { normalizeType } from './normalize';
+import garbageCollect from '@shell/utils/gc/gc';
 
 export const _ALL = 'all';
 export const _MERGE = 'merge';
@@ -316,6 +317,8 @@ export default {
       dispatch('resource-fetch/updateManualRefreshIsLoading', false, { root: true });
     }
 
+    garbageCollect.gcUpdateLastAccessed(ctx, type);
+
     return all;
   },
 
@@ -371,6 +374,8 @@ export default {
       });
     }
 
+    garbageCollect.gcUpdateLastAccessed(ctx, type);
+
     return getters.matching( type, selector, namespace );
   },
 
@@ -426,6 +431,8 @@ export default {
 
     out = getters.byId(type, id);
 
+    garbageCollect.gcUpdateLastAccessed(ctx, type);
+
     return out;
   },
 
@@ -490,6 +497,10 @@ export default {
     return classify(ctx, data);
   },
 
+  createMany(ctx, data) {
+    return data.map(d => classify(ctx, d));
+  },
+
   createPopulated(ctx, userData) {
     const data = ctx.getters['defaultFor'](userData.type);
 
@@ -587,5 +598,13 @@ export default {
 
   incrementLoadCounter({ commit }, resource) {
     commit('incrementLoadCounter', resource);
+  },
+
+  garbageCollect(ctx, ignoreTypes) {
+    return garbageCollect.garbageCollect(ctx, ignoreTypes);
+  },
+
+  gcResetStore({ state }) {
+    garbageCollect.gcResetStore(state);
   }
 };

package/plugins/dashboard-store/getters.js

@@ -9,10 +9,11 @@ import Resource from '@shell/plugins/dashboard-store/resource-class';
 import mutations from './mutations';
 import { keyFieldFor, normalizeType } from './normalize';
 import { lookup } from './model-loader';
+import garbageCollect from '@shell/utils/gc/gc';
 
 export default {
 
-  all: (state, getters) => (type) => {
+  all: (state, getters, rootState) => (type) => {
     type = getters.normalizeType(type);
 
     if ( !getters.typeRegistered(type) ) {
@@ -22,10 +23,14 @@ export default {
       mutations.registerType(state, type);
     }
 
+    garbageCollect.gcUpdateLastAccessed({
+      state, getters, rootState
+    }, type);
+
     return state.types[type].list;
   },
 
-  matching: (state, getters) => (type, selector, namespace) => {
+  matching: (state, getters, rootState) => (type, selector, namespace) => {
     let all = getters['all'](type);
 
     // Filter first by namespace if one is provided, since this is efficient
@@ -33,16 +38,24 @@ export default {
       all = all.filter(obj => obj.namespace === namespace);
     }
 
+    garbageCollect.gcUpdateLastAccessed({
+      state, getters, rootState
+    }, type);
+
     return all.filter((obj) => {
       return matches(obj, selector);
     });
   },
 
-  byId: (state, getters) => (type, id) => {
+  byId: (state, getters, rootState) => (type, id) => {
     type = getters.normalizeType(type);
     const entry = state.types[type];
 
     if ( entry ) {
+      garbageCollect.gcUpdateLastAccessed({
+        state, getters, rootState
+      }, type);
+
       return entry.map.get(id);
     }
   },
@@ -300,5 +313,9 @@ export default {
     }
 
     return 0;
+  },
+
+  gcIgnoreTypes: () => {
+    return {};
   }
 };