@rancher/shell 3.0.12-rc.2 → 3.0.12-rc.4

package/apis/shell/proxy.ts

@@ -0,0 +1,256 @@
+import { Store } from 'vuex';
+import { ProxyApi, ProxyAuthCloudCredential, ProxyAuthToken, ProxyRequestOptions } from '@shell/apis/intf/shell';
+import { Metadata } from '@shell/types/resources/settings';
+import { MANAGEMENT } from '@shell/config/types';
+import { get } from '@shell/utils/object';
+
+/**
+ * Shell implementation of the `ProxyApi`.
+ *
+ * This API centralizes proxy request behavior used across providers:
+ * - building `/meta/proxy` URLs
+ * - applying credential or token auth headers
+ * - dispatching requests via `management/request`
+ * - optional de-pagination for list endpoints
+ */
+export class ProxyApiImpl implements ProxyApi {
+  private store: Store<any>;
+
+  /**
+   * Creates a new Proxy API instance.
+   *
+   * @param store - Root Vuex store used to dispatch `management/request`.
+   */
+  constructor(store: Store<any>) {
+    this.store = store;
+  }
+
+  /**
+   * Executes a generic proxy request.
+   *
+   * Behavior:
+   * - Builds a proxied URL and dispatches `management/request`.
+   * - When `dePaginate` is enabled, follows the configured `next` URL and
+   *   merges results recursively.
+   *
+   * @param options - Proxy request options.
+   * @returns The response payload or accumulated de-paginated output.
+   */
+  public async request(options: ProxyRequestOptions): Promise<any> {
+    const url = this.buildProxyUrl(options);
+    const headers = this.buildHeaders(options);
+    const req = {
+      url,
+      method:               options.method,
+      headers,
+      redirectUnauthorized: false,
+    } as any;
+
+    if (options.data) {
+      req.body = options.data;
+    }
+
+    const res = await this.store.dispatch('management/request', req, { root: true });
+
+    if (options.postProcess) {
+      return options.postProcess(res);
+    }
+
+    return res;
+  }
+
+  /**
+   * Builds a `/meta/proxy` URL by stripping the scheme from `options.url`.
+   */
+  private buildProxyUrl(options: ProxyRequestOptions): string {
+    const raw = options.url.toString();
+
+    return `/meta/proxy/${ raw.replace(/^https:\/\//, '').replace(/^http:\/\//, 'http:/') }`;
+  }
+
+  /**
+   * Builds request headers, including auth headers derived from `options.authentication`.
+   */
+  private buildHeaders(options: ProxyRequestOptions): Record<string, string> {
+    const headers: Record<string, string> = {
+      Accept: options.accept || 'application/json',
+      ...(options.headers || {})
+    };
+
+    const auth = options.authentication;
+
+    if (!auth) {
+      return headers;
+    }
+
+    if ('id' in auth) {
+      // Cloud credential — instruct Rancher to sign the request server-side
+      const {
+        id, authSigner, usernameField, passwordField
+      } = auth as ProxyAuthCloudCredential;
+      let value = authSigner ? `${ authSigner } ` : '';
+
+      value += `credID=${ id } `;
+      if (usernameField) {
+        value += `usernameField=${ usernameField } `;
+      }
+      if (passwordField) {
+        value += `passwordField=${ passwordField } `;
+      }
+      headers['x-api-cattleauth-header'] = value.trimEnd();
+    } else {
+      // Plain token — forwarded verbatim as Authorization by the proxy
+      const { token, authSigner } = auth as ProxyAuthToken;
+      const scheme = authSigner ?? 'Bearer';
+
+      headers['x-api-auth-header'] = `${ scheme } ${ token }`;
+    }
+
+    return headers;
+  }
+
+  /**
+   * Builds the proxy URL and auth headers for a request without dispatching it.
+   *
+   * Useful for integrating with lower-level HTTP handlers (e.g. the AWS SDK
+   * request handler) that need to apply proxy routing and auth themselves
+   * rather than going through the Vuex `management/request` action.
+   *
+   * @param options - Proxy request options.
+   * @returns An object containing the resolved proxy `url` and the `headers`
+   *          to merge into the outbound request.
+   */
+  public prepareRequest(options: ProxyRequestOptions): { url: string; headers: Record<string, string> } {
+    return {
+      url:     this.buildProxyUrl(options),
+      headers: this.buildHeaders(options),
+    };
+  }
+
+  /**
+   * Creates a `ProxyEndpoint` CR that registers the given domain patterns
+   * with the Rancher `/meta/proxy` allow-list.
+   *
+   * The CR is cluster-scoped (`management.cattle.io/v3`, kind `ProxyEndpoint`).
+   * Each entry in `urls` maps to a `spec.routes[].domain` entry on the CR.
+   *
+   * @param domains - Bare hostnames or wildcard patterns accepted by the proxy
+   *                  backend (e.g. `api.example.com`, `%.amazonaws.com`).
+   * @param name    - Optional metadata name for the CR. When omitted a name is
+   *                  auto-generated by the API server.
+   * @returns The created `ProxyEndpoint` resource.
+   */
+  public async allowDomains(domains: string[], name?: string): Promise<any> {
+    const metadata = {} as Metadata;
+
+    if (name) {
+      metadata.name = name;
+    } else {
+      metadata.generateName = 'endpoints-';
+    }
+    const resource = await this.store.dispatch('management/create', {
+      type: MANAGEMENT.PROXY_ENDPOINT,
+      metadata,
+      spec: { routes: domains.map((domain) => ({ domain })) },
+    });
+
+    return resource.save();
+  }
+
+  /**
+   * Checks whether a domain pattern is already present in any existing
+   * `ProxyEndpoint` CR.
+   *
+   * The comparison is a case-insensitive exact match against each
+   * `spec.routes[].domain` entry across all CRs — the same format accepted
+   * by `allowDomains` (e.g. `api.example.com`, `%.amazonaws.com`).
+   *
+   * @param domain - The hostname or wildcard pattern to look up.
+   * @returns `true` if the pattern is found in at least one `ProxyEndpoint` CR,
+   *          `false` otherwise.
+   */
+  public async isDomainAllowed(domain: string): Promise<boolean> {
+    const endpoints: any[] = await this.store.dispatch('management/findAll', { type: MANAGEMENT.PROXY_ENDPOINT });
+
+    const needle = domain.toLowerCase();
+
+    return endpoints.some((endpoint) => (endpoint?.spec?.routes ?? []).some(
+      (route: { domain: string }) => route.domain?.toLowerCase() === needle
+    )
+    );
+  }
+
+  /**
+   * Checks whether a `ProxyEndpoint` CR with the given name exists.
+   *
+   * Uses `management/find` and treats a 404 response as `false` rather than
+   * an error. Any other error is re-thrown.
+   *
+   * @param name - The metadata name of the `ProxyEndpoint` CR to look up.
+   * @returns `true` if the CR exists, `false` if it is not found.
+   */
+  public async hasProxyEndpoint(name: string): Promise<boolean> {
+    try {
+      await this.store.dispatch('management/find', {
+        type: MANAGEMENT.PROXY_ENDPOINT,
+        id:   name,
+        opt:  { force: false },
+      });
+
+      return true;
+    } catch (e: any) {
+      if (e?.status === 404) {
+        return false;
+      }
+      throw e;
+    }
+  }
+}
+
+/**
+ * Creates a `postProcess` callback for use with `ProxyApi.request()` that
+ * automatically follows pagination links and merges array results across pages.
+ *
+ * @param proxyApi       - The `ProxyApi` instance used to fetch subsequent pages.
+ * @param requestOptions - Base request options (without `postProcess`) reused for each page.
+ * @param opts.nextUrlPath - Dot-path or jsonpath to the next-page URL in the response.
+ *                           Defaults to `links.pages.next`.
+ * @param opts.mergeKey    - Response key whose array value is merged across pages.
+ *                           When omitted the first top-level array key is used.
+ *
+ * @example
+ * ```ts
+ * const baseOptions = { url: 'api.example.com/v1/items', authentication };
+ * const result = await proxy.request({
+ *   ...baseOptions,
+ *   postProcess: createDepaginator(proxy, baseOptions, { mergeKey: 'items' }),
+ * });
+ * ```
+ */
+export function createDepaginator(
+  proxyApi: ProxyApi,
+  requestOptions: Omit<ProxyRequestOptions, 'postProcess'>,
+  opts: { nextUrlPath?: string; mergeKey?: string } = {}
+): (res: any) => Promise<any> {
+  const nextPath = opts.nextUrlPath ?? 'links.pages.next';
+  const mergeKey = opts.mergeKey;
+
+  const paginate = async(res: any, accumulated?: any): Promise<any> => {
+    const key = mergeKey ?? Object.keys(res ?? {}).find((k) => Array.isArray(res[k]));
+
+    // If we have a prior page's data, concatenate this page's array into it; otherwise use this page as-is
+    const merged = (accumulated !== undefined && key && Array.isArray(accumulated[key]) && Array.isArray(res?.[key])) ? { ...res, [key]: [...accumulated[key], ...res[key]] } : res;
+
+    const nextUrl = get(merged, nextPath);
+
+    if (!nextUrl) {
+      return merged;
+    }
+
+    const nextRes = await proxyApi.request({ ...requestOptions, url: new URL(nextUrl) });
+
+    return paginate(nextRes, merged);
+  };
+
+  return (res: any) => paginate(res);
+}

package/apis/shell/slide-in.ts

@@ -14,9 +14,12 @@ export class SlideInApiImpl implements SlideInApi {
    *
    * Example:
    * ```ts
+   * import { useShell } from '@shell/apis';
    * import MyCustomSlideIn from '@/components/MyCustomSlideIn.vue';
    *
-   * this.$shell.slideIn.open(MyCustomSlideIn, {
+   * const shell = useShell();
+   *
+   * shell.slideIn.open(MyCustomSlideIn, {
    *   title: 'Hello from SlideIn panel!'
    * });
    * ```

package/apis/vue-shim.d.ts

@@ -1,5 +1,5 @@
 /* eslint-disable */
-import { ShellApi, ExtensionManagerApi } from '@shell/apis';
+import { ShellApi, ExtensionManagerApi, ResourcesApiProvider } from '@shell/apis';
 
 export {};
 
@@ -7,5 +7,6 @@ declare module 'vue' {
   interface ComponentCustomProperties {
     $shell: ShellApi,
     $extension: ExtensionManagerApi,
+    $resources: ResourcesApiProvider,
   }
 }

package/assets/data/aws-regions.json

@@ -12,6 +12,7 @@
   "ap-southeast-3",
   "ap-southeast-4",
   "ap-southeast-5",
+  "ap-southeast-6",
   "ap-southeast-7",
   "ca-central-1",
   "ca-west-1",
@@ -37,6 +38,9 @@
   "us-iso-east-1",
   "us-iso-west-1",
   "us-isob-east-1",
+  "us-isob-west-1",
+  "us-isof-east-1",
+  "us-isof-south-1",
   "us-west-1",
   "us-west-2"
 ]

package/assets/styles/base/_variables.scss

@@ -10,6 +10,8 @@ $unlabeled-input-height: 40px;
 $unlabaled-select-padding: 3px 0;
 $footer-height: 60px;
 
+$resource-detail-min-width: 740px;
+
 $input-padding-lg: 18px;
 $input-padding-sm: 10px;
 $input-line-height: 18px;

package/assets/styles/fonts/_fontstack.scss

@@ -18,24 +18,148 @@
     url('~@shell/assets/fonts/poppins/poppins-v15-latin-500.woff') format('woff'), /* Modern Browsers */
 }
 
-/* lato-regular - latin */
+/**
+ * Lato Font (Latin) (see: https://www.latofonts.com/)
+ **/
+
+/* Webfont: Lato-Light (300) */
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 300;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Light.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Light.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-LightItalic (300) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 300;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-LightItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-LightItalic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-Regular (400) */
 @font-face {
   font-family: 'Lato';
   font-style: normal;
   font-weight: normal;
-  src: local(''),
-    url('~@shell/assets/fonts/lato/lato-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
-    url('~@shell/assets/fonts/lato/lato-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Regular.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Regular.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-Italic (400) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: normal;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Italic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Italic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-Medium (500) */
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 500;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Medium.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Medium.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-MediumItalic (500) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 500;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-MediumItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-MediumItalic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: LatoLatin-Semibold (600) */
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 600;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Semibold.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Semibold.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: LatoLatin-SemiboldItalic (600) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 600;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-SemiboldItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-SemiboldItalic.woff') format('woff'); /* Modern Browsers */
 }
 
-/* lato-700 - latin */
+/* Webfont: LatoLatin-Bold (700) */
 @font-face {
   font-family: 'Lato';
   font-style: normal;
   font-weight: bold;
-  src: local(''),
-    url('~@shell/assets/fonts/lato/lato-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
-    url('~@shell/assets/fonts/lato/lato-v17-latin-700.woff') format('woff'), /* Modern Browsers */
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Bold.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Bold.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: LatoLatin-BoldItalic (700) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: bold;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-BoldItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-BoldItalic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-Heavy (800) */
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 800;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Heavy.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Heavy.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-HeavyItalic (800) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 800;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-HeavyItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-HeavyItalic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-Black (900) */
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 900;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-Black.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-Black.woff') format('woff'); /* Modern Browsers */
+}
+
+/* Webfont: Lato-BlackItalic (900) */
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 900;
+  text-rendering: optimizeLegibility;
+  src: url('~@shell/assets/fonts/lato/LatoLatin-BlackItalic.woff2') format('woff2'), /* Modern Browsers */
+       url('~@shell/assets/fonts/lato/LatoLatin-BlackItalic.woff') format('woff'); /* Modern Browsers */
 }
 
 /* roboto-mono-regular - latin */

package/assets/styles/global/_layout.scss

@@ -3,6 +3,10 @@
   grid-area: main;
   overflow: auto;
 
+  @media (prefers-reduced-motion: no-preference) {
+    scroll-behavior: smooth;
+  }
+
   .outlet {
     display: flex;
     flex-direction: column;