@rancher/shell 0.3.4 → 0.3.5

package/utils/__tests__/string.test.ts

@@ -0,0 +1,12 @@
+import { decodeHtml } from '@shell/utils/string';
+
+describe('fx: decodeHtml', () => {
+  it('should decode HTML values from escaped string into valid markup', () => {
+    const text = '<i>whatever</i>';
+    const expectation = `<i>whatever</i>`;
+
+    const result = decodeHtml(text);
+
+    expect(result).toStrictEqual(expectation);
+  });
+});

package/utils/auth.js

@@ -2,6 +2,7 @@ import { Popup, popupWindowOptions } from '@shell/utils/window';
 import { parse as parseUrl, addParam } from '@shell/utils/url';
 import { BACK_TO, SPA, _EDIT, _FLAGGED } from '@shell/config/query-params';
 import { MANAGEMENT } from '@shell/config/types';
+import { allHash } from '@shell/utils/promise';
 
 export function openAuthPopup(url, provider) {
   const popup = new Popup(() => {
@@ -79,3 +80,67 @@ export const authProvidersInfo = async(store) => {
     enabled
   };
 };
+
+export const checkSchemasForFindAllHash = (types, store) => {
+  const hash = {};
+
+  for (const [key, value] of Object.entries(types)) {
+    const schema = store.getters[`${ value.inStoreType }/schemaFor`](value.type);
+
+    // It could be that user has permissions for GET but not list
+    // e.g. Standard user with GitRepo permissions try to fetch list of fleetworkspaces
+    // user has ability to GET but not fleet workspaces
+    // so optionally define a function that require it to pass before /findAll
+    const validSchema = value.schemaValidator ? value.schemaValidator(schema) : !!schema;
+
+    if (validSchema) {
+      hash[key] = store.dispatch(`${ value.inStoreType }/findAll`, { type: value.type } );
+    }
+  }
+
+  return allHash(hash);
+};
+
+export const checkPermissions = (types, getters) => {
+  const hash = {};
+
+  for (const [key, value] of Object.entries(types)) {
+    const schema = getters['management/schemaFor'](value.type);
+
+    if (!schema) {
+      hash[key] = false;
+
+      continue;
+    }
+
+    // It could be that user has permissions for GET but not list
+    // e.g. Standard user with GitRepo permissions try to fetch list of fleetworkspaces
+    // user has ability to GET but not fleet workspaces
+    // so optionally define a function that require it to pass before /findAll
+    if (value.schemaValidator) {
+      hash[key] = value.schemaValidator(schema);
+
+      continue;
+    }
+
+    if (value.resourceMethods && schema) {
+      hash[key] = value.resourceMethods.every((method) => {
+        return (schema.resourceMethods || []).includes(method);
+      });
+
+      continue;
+    }
+
+    if (value.collectionMethods && schema) {
+      hash[key] = value.collectionMethods.every((method) => {
+        return (schema.collectionMethods || []).includes(method);
+      });
+
+      continue;
+    }
+
+    hash[key] = !!schema;
+  }
+
+  return allHash(hash);
+};

package/utils/monitoring.js

@@ -26,9 +26,10 @@ export function haveV2Monitoring(getters) {
   if (haveV1Monitoring(getters)) {
     return false;
   }
+  const inStore = getters['getStoreNameByProductId'];
 
   // Just check for the pod monitors CRD
-  const schemas = getters[`cluster/all`](SCHEMA);
+  const schemas = getters[`${ inStore }/all`](SCHEMA);
   const exists = findBy(schemas, 'id', normalizeType(MONITORING.PODMONITOR));
 
   return !!exists;

package/utils/position.js

@@ -1,5 +1,4 @@
 // @TODO replace this with popper.js...
-import $ from 'jquery';
 
 export const LEFT = 'left';
 export const RIGHT = 'right';
@@ -10,10 +9,9 @@ export const BOTTOM = 'bottom';
 export const AUTO = 'auto';
 
 export function boundingRect(elem) {
-  const $elem = $(elem);
-  const pos = $elem.offset();
-  const width = $elem.outerWidth(false);
-  const height = $elem.outerHeight(false);
+  const pos = elem.getBoundingClientRect();
+  const width = elem.offsetWidth;
+  const height = elem.offsetHeight;
 
   return {
     top:    pos.top,
@@ -37,9 +35,8 @@ export function fakeRectFor(event) {
 }
 
 export function screenRect() {
-  const $window = $(window);
-  const width = $window.width();
-  const height = $window.height();
+  const width = window.innerWidth;
+  const height = window.innerHeight;
   const top = window.pageYOffset;
   const left = window.pageXOffset;
 

package/utils/router.scrollBehavior.js

@@ -0,0 +1,80 @@
+import { getMatchedComponents, setScrollRestoration } from '../nuxt/utils';
+
+if (process.client) {
+  if ('scrollRestoration' in window.history) {
+    setScrollRestoration('manual');
+
+    // reset scrollRestoration to auto when leaving page, allowing page reload
+    // and back-navigation from other pages to use the browser to restore the
+    // scrolling position.
+    window.addEventListener('beforeunload', () => {
+      setScrollRestoration('auto');
+    });
+
+    // Setting scrollRestoration to manual again when returning to this page.
+    window.addEventListener('load', () => {
+      setScrollRestoration('manual');
+    });
+  }
+}
+
+function shouldScrollToTop(route) {
+  const Pages = getMatchedComponents(route);
+
+  if (Pages.length === 1) {
+    const { options = {} } = Pages[0];
+
+    return options.scrollToTop !== false;
+  }
+
+  return Pages.some(({ options }) => options && options.scrollToTop);
+}
+
+export default function(to, from, savedPosition) {
+  // If the returned position is falsy or an empty object, will retain current scroll position
+  let position = false;
+  const isRouteChanged = to !== from;
+
+  // savedPosition is only available for popstate navigations (back button)
+  if (savedPosition) {
+    position = savedPosition;
+  } else if (isRouteChanged && shouldScrollToTop(to)) {
+    position = { x: 0, y: 0 };
+  }
+
+  const nuxt = window.$nuxt;
+
+  if (
+    // Initial load (vuejs/vue-router#3199)
+    !isRouteChanged ||
+    // Route hash changes
+    (to.path === from.path && to.hash !== from.hash)
+  ) {
+    nuxt.$nextTick(() => nuxt.$emit('triggerScroll'));
+  }
+
+  return new Promise((resolve) => {
+    // wait for the out transition to complete (if necessary)
+    nuxt.$once('triggerScroll', () => {
+      // coords will be used if no selector is provided,
+      // or if the selector didn't match any element.
+      if (to.hash) {
+        let hash = to.hash;
+
+        // CSS.escape() is not supported with IE and Edge.
+        if (typeof window.CSS !== 'undefined' && typeof window.CSS.escape !== 'undefined') {
+          hash = `#${ window.CSS.escape(hash.substr(1)) }`;
+        }
+        try {
+          if (document.querySelector(hash)) {
+            // scroll to anchor by returning the selector
+            position = { selector: hash };
+          }
+        } catch (e) {
+          console.warn('Failed to save scroll position. Please add CSS.escape() polyfill (https://github.com/mathiasbynens/CSS.escape).'); // eslint-disable-line no-console
+        }
+      }
+      resolve(position);
+    });
+  });
+}

package/utils/select.js

@@ -1,5 +1,3 @@
-import $ from 'jquery';
-
 export function onClickOption(option, e) {
   if (!this.$attrs.multiple) {
     return;
@@ -29,7 +27,7 @@ export function onClickOption(option, e) {
 // We used to use popper for these, but it does not suppotr fractional pixel placements which
 // means the dropdown does not appear aligned to the control when placed in a column-based layout
 export function calculatePosition(dropdownList, component, width, placement) {
-  const selectEl = $(component.$parent.$el)[0];
+  const selectEl = component.$parent.$el;
   const r = selectEl.getBoundingClientRect();
   const p = placement || 'bottom-start';
   const docHeight = document.body.offsetHeight;

package/utils/socket.js

@@ -26,6 +26,7 @@ export const EVENT_DISCONNECT_ERROR = 'disconnect_error';
 
 export const NO_WATCH = 'NO_WATCH';
 export const NO_SCHEMA = 'NO_SCHEMA';
+export const REVISION_TOO_OLD = 'TOO_OLD';
 
 export default class Socket extends EventTarget {
   url;

package/utils/string.js

@@ -60,6 +60,19 @@ export function escapeHtml(html) {
   });
 }
 
+/**
+ * Return HTML markup from escaped HTML string, allowing specific tags
+ * @param text string
+ * @returns string
+ */
+export function decodeHtml(text) {
+  const div = document.createElement('div');
+
+  div.innerHTML = text;
+
+  return div.textContent || div.innerText || '';
+}
+
 export function escapeRegex(string) {
   return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string
 }

package/utils/time.js

@@ -97,6 +97,15 @@ export function elapsedTime(seconds) {
     };
   }
 
+  const days = Math.floor(seconds / (3600 * 24));
+
+  if (days > 1) {
+    return {
+      diff:  60,
+      label: `${ days }d${ hours - (days * 24) }h`,
+    };
+  }
+
   if (hours > 7) {
     return {
       diff:  60,