@squiz/resource-browser 1.69.1 → 2.1.8-rc.0

package/src/__mocks__/JestHelpers.ts

@@ -1,65 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import sass from 'sass';
-import postcss, { Root, AcceptedPlugin, Processor } from 'postcss';
-import { fileURLToPath } from 'url';
-
-const removeLayerDirectivePlugin = {
-  postcssPlugin: 'remove-layer-directive',
-  OnceExit(root: Root) {
-    // Remove the @layer directive while keeping the contents
-    root.walkAtRules('layer', (rule) => {
-      rule.replaceWith(rule.nodes);
-    });
-  },
-} as AcceptedPlugin;
-
-function removeLayerDirective(scss: string) {
-  const { css } = postcss({
-    plugins: [removeLayerDirectivePlugin],
-  } as Processor).process(scss, {
-    from: undefined,
-  });
-
-  return css;
-}
-
-function readAndParseScss({ relativePath, dirname }: { relativePath: string; dirname: string }) {
-  const cssFileContents = fs.readFileSync(path.resolve(dirname, relativePath), 'utf8');
-  const compiledCSS = sass.compileString(cssFileContents, {
-    importers: [
-      {
-        canonicalize(url) {
-          // This function converts the relative path to an absolute path
-          const filePath = path.resolve(dirname, url);
-
-          return new URL(`file://${filePath}`);
-        },
-        load(canonicalUrl) {
-          // This function loads the returns the file in the expected format
-          return {
-            contents: fs.readFileSync(fileURLToPath(`${canonicalUrl}.scss`), 'utf8'),
-            syntax: 'scss',
-          };
-        },
-      },
-    ],
-  }).css;
-
-  return removeLayerDirective(compiledCSS);
-}
-
-function loadCss({ container, cssFileContents }: { container: HTMLElement; cssFileContents: string }) {
-  const style = window.document.createElement('style');
-  style.type = 'text/css';
-  style.innerHTML = cssFileContents;
-  container.append(style);
-}
-
-const resizeWindow = (x: number, y: number) => {
-  window.innerWidth = x;
-  window.innerHeight = y;
-  window.dispatchEvent(new Event('resize'));
-};
-
-export { readAndParseScss, loadCss, resizeWindow };

package/src/__mocks__/StorybookHelpers.ts

@@ -1,128 +0,0 @@
-import sampleSources from '../SourceList/sample-sources.json';
-import { HydratedResourceReference, Resource, ResourceReference, Source } from '../types';
-import sampleResources from '../ResourceList/sample-resources.json';
-
-type CreateCallbacksProps = Partial<{
-  delay: number;
-  sourceIsLoading: boolean;
-  resourceIsLoading: boolean;
-  error?: string;
-}>;
-
-const indexSources = (sources: Source[]) => {
-  const indexed: Record<string, Resource> = {};
-  const pending: Resource[] = [];
-
-  sources.forEach((source) => {
-    if (source && 'nodes' in source) {
-      pending.push(...source.nodes);
-    }
-  });
-
-  while (pending.length > 0) {
-    const resource = pending.shift();
-
-    if (!resource) {
-      continue;
-    }
-
-    indexed[resource.id] = resource;
-  }
-
-  return indexed;
-};
-
-const indexResources = (resources: Resource[]) => {
-  const indexed: Record<string, Resource> = {};
-  const pending = [...resources];
-
-  while (pending.length > 0) {
-    const resource = pending.shift();
-
-    if (!resource) {
-      continue;
-    }
-
-    indexed[resource.id] = resource;
-
-    if (resource && '_children' in resource) {
-      pending.push(...(resource._children as Resource[]));
-    }
-  }
-
-  return indexed;
-};
-
-export const createResourceBrowserCallbacks = ({
-  delay = 500,
-  sourceIsLoading = false,
-  resourceIsLoading = false,
-  error,
-}: CreateCallbacksProps = {}) => {
-  const indexSourceResources = indexSources(sampleSources as Source[]);
-  const indexedResources = indexResources(sampleResources as Resource[]);
-
-  return {
-    onRequestSources: () => {
-      console.log('onRequestSources');
-
-      return new Promise((resolve, reject) => {
-        if (!sourceIsLoading) {
-          setTimeout(() => {
-            if (error && Math.random() > 0.5) {
-              reject(new Error(error));
-            } else {
-              resolve(sampleSources);
-            }
-          }, delay);
-        }
-      });
-    },
-    onRequestChildren: (source: Source, resource: Resource | null) => {
-      console.log('onRequestChildren', source, resource);
-
-      return new Promise((resolve, reject) => {
-        if (!resourceIsLoading) {
-          setTimeout(() => {
-            if (error && Math.random() > 0.5) {
-              reject(new Error(error));
-            } else {
-              resolve(resource ? (indexedResources[resource.id] as any)?._children || [] : sampleResources);
-            }
-          }, delay);
-        }
-      });
-    },
-    onRequestResource: (reference: ResourceReference) => {
-      console.log('onRequestResource', reference);
-
-      return new Promise((resolve, reject) => {
-        if (!resourceIsLoading) {
-          setTimeout(() => {
-            if (error && Math.random() > 0.5) {
-              reject(new Error(error));
-            } else {
-              const foundResource = indexedResources[reference.resource];
-              const foundSourceResource = indexSourceResources[reference.resource];
-              if (foundResource) {
-                resolve(foundResource);
-              }
-              resolve(foundSourceResource);
-            }
-          }, delay);
-        }
-      });
-    },
-    onChange: (reference: HydratedResourceReference | null) => {
-      if (reference) {
-        const { resource, source } = reference;
-
-        alert(
-          `Resource Browser has selected resource #${resource.id} (${resource.name}) from source #${source.id} (${source.name}).`,
-        );
-      } else {
-        alert(`Resource Browser has cleared selected resource.`);
-      }
-    },
-  };
-};

package/src/__mocks__/jestHelpers.spec.ts

@@ -1,38 +0,0 @@
-import { loadCss, resizeWindow } from './JestHelpers';
-
-describe('loadCss', () => {
-  it('should load the css', () => {
-    const container = document.createElement('div');
-    container.setAttribute('id', 'test');
-
-    const cssFileContents = `
-            .test {
-                color: red;
-            }
-        `;
-
-    loadCss({ container, cssFileContents });
-
-    // Expect that the css is loaded into the container as a style tag
-    expect(container.innerHTML).toBe(`<style type="text/css">${cssFileContents}</style>`);
-  });
-});
-
-describe('resizeWindow', () => {
-  it('should resize the window', () => {
-    resizeWindow(100, 100);
-
-    // Expect that the window has been resized
-    expect(window.innerWidth).toBe(100);
-    expect(window.innerHeight).toBe(100);
-  });
-
-  it('should dispatch a resize event', () => {
-    const resizeSpy = jest.spyOn(window, 'dispatchEvent');
-
-    resizeWindow(100, 100);
-
-    // Expect that the window has been resized
-    expect(resizeSpy).toHaveBeenCalled();
-  });
-});

package/src/utils/findBestMatchLineage.spec.ts

@@ -1,81 +0,0 @@
-import { Resource } from '../types';
-import { findBestMatchLineage } from './findBestMatchLineage';
-import { mockResource, mockSource } from '../__mocks__/MockModels';
-
-describe('findBestMatchLineage', () => {
-  it.each([
-    [
-      'Resource lineage is not returned',
-      mockResource({
-        lineages: undefined,
-      }),
-      [],
-    ],
-    [
-      'Resource has no lineages',
-      mockResource({
-        lineages: [],
-      }),
-      [],
-    ],
-    [
-      'Resource does not have lineage which is beneath a configured root node',
-      mockResource({
-        id: '3000',
-        lineages: [{ resourceIds: ['1', '30', '300', '3000'] }],
-      }),
-      [],
-    ],
-    [
-      'Resource has a lineage under one of the root nodes',
-      mockResource({
-        id: '100',
-        lineages: [{ resourceIds: ['1', '20', '200', '2000'] }],
-      }),
-      ['20', '200', '2000'],
-    ],
-    [
-      'Resource has a lineage beneath multiple of the root nodes',
-      mockResource({
-        id: '1000',
-        lineages: [{ resourceIds: ['1', '10', '100', '1000'] }, { resourceIds: ['1', '20', '200', '1000'] }],
-      }),
-      // first match is returned.
-      ['10', '100', '1000'],
-    ],
-    [
-      'Resource has multiple lineages under a single configured root node',
-      mockResource({
-        id: '1000',
-        lineages: [{ resourceIds: ['1', '10', '100', '1000'] }, { resourceIds: ['1', '10', '101', '1000'] }],
-      }),
-      // first match is returned.
-      ['10', '100', '1000'],
-    ],
-    [
-      'Resource ID is a configured root node',
-      mockResource({
-        id: '10',
-        lineages: [{ resourceIds: ['1', '10'] }],
-      }),
-      [],
-    ],
-    [
-      'Resource ID is a configured root node and also nested under a root node',
-      mockResource({
-        id: '10',
-        lineages: [{ resourceIds: ['1', '10'] }, { resourceIds: ['1', '20', '10'] }],
-      }),
-      ['20', '10'],
-    ],
-  ])(
-    'Returns best match lineage which can be identified from provided source - %s',
-    (description: string, resource: Resource, expected: string[]) => {
-      const source = mockSource({
-        nodes: [mockResource({ id: '10' }), mockResource({ id: '20' })],
-      });
-
-      expect(findBestMatchLineage(source, resource)).toEqual(expected);
-    },
-  );
-});

package/src/utils/findBestMatchLineage.ts

@@ -1,30 +0,0 @@
-import { Source, Resource } from '../types';
-
-export const findBestMatchLineage = (source: Source, resource: Resource): string[] => {
-  if (resource.lineages) {
-    for (const lineage of resource.lineages) {
-      // Lineage must:
-      // 1. Appear beneath the root node.
-      // 2. Not be the root node itself (root nodes can't be selected, to be changed in FEAAS-760).
-      // TODO: FEAAS-760 update as necessary so the lineage will be returned even if it ends at the root node, eg:
-      // const rootNode = source.nodes.find(node => lineage.resourceIds.includes(node.id));
-      const rootNode = source.nodes.find((node) => {
-        const index = lineage.resourceIds.indexOf(node.id);
-
-        return index >= 0 && index < lineage.resourceIds.length - 1;
-      });
-
-      if (rootNode) {
-        const rootNodeIndex = lineage.resourceIds.indexOf(rootNode.id);
-
-        // Return the lineage starting from the root node. eg.
-        // * Full lineage is: 1 > 10 > 100 > 1000 > 10000
-        // * The source has a node with an ID of: 100
-        // * The returned lineage will be: 100 > 1000 > 10000
-        return lineage.resourceIds.slice(rootNodeIndex);
-      }
-    }
-  }
-
-  return [];
-};

package/src/utils/uuid.ts

@@ -1,5 +0,0 @@
-export default function uuid(): string {
-  return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (c) =>
-    (Number(c) ^ (window.crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (Number(c) / 4)))).toString(16),
-  );
-}