@verdaccio/ui-components 4.0.0-next-8.7 → 4.0.0-next-8.8

package/src/utils/cli-utils.ts

@@ -1,53 +0,0 @@
-import { SyntheticEvent } from 'react';
-
-export const copyToClipBoardUtility =
-  (str: string): ((e: SyntheticEvent<HTMLElement>) => void) =>
-  (event: SyntheticEvent<HTMLElement>): void => {
-    event.preventDefault();
-
-    const node = document.createElement('div');
-    node.innerText = str;
-    if (document.body) {
-      document.body.appendChild(node);
-
-      const range = document.createRange();
-      const selection = window.getSelection() as Selection;
-      range.selectNodeContents(node);
-      selection.removeAllRanges();
-      selection.addRange(range);
-      document.execCommand('copy');
-      document.body.removeChild(node);
-    }
-  };
-
-export function getCLISetConfigRegistry(
-  command: string,
-  scope: string | undefined,
-  registryUrl: string
-): string {
-  // if there is a scope defined there needs to be a ":" separator between the scope and the registry
-  return `${command} ${scope ? `${scope}:` : ''}registry ${registryUrl}`;
-}
-
-export function getCLISetRegistry(command: string, registryUrl: string): string {
-  return `${command} --registry ${registryUrl}`;
-}
-
-export function getCLIChangePassword(command: string, registryUrl: string): string {
-  return `${command} profile set password --registry ${registryUrl}`;
-}
-
-export function getCLISBerryYamlRegistry(scope: string | undefined, registryUrl: string): string {
-  return !scope
-    ? `// .yarnrc.yml    
-npmRegistryServer: "${registryUrl}"
-unsafeHttpWhitelist:
-  - ${new URL(registryUrl).host}`
-    : `
-// .yarnrc.yml
-npmRegistryServer: "${registryUrl}"
-npmScopes:
-  ${scope.replace('@', '')}:
-    npmRegistryServer: ${registryUrl}
-    npmPublishRegistry: ${registryUrl}`;
-}

package/src/utils/index.ts

@@ -1,11 +0,0 @@
-export * as url from './url';
-export * as utils from './utils';
-export {
-  getCLIChangePassword,
-  getCLISBerryYamlRegistry,
-  getCLISetConfigRegistry,
-  getCLISetRegistry,
-} from './cli-utils';
-export { default as loadable } from './loadable';
-export { Route } from './routes';
-export * from './token';

package/src/utils/loadable.tsx

@@ -1,20 +0,0 @@
-/* eslint-disable verdaccio/jsx-spread */
-import React, { Suspense, lazy } from 'react';
-
-/**
- *  With the combination of a bundler, enable to code split a package.
- * 
- *  @example
-    ```jsx
-    const VersionPage = loadable(() => import(/'../pages/Version'));
-   ```
-   @category HOC
- */
-export default (importCallback: any) => {
-  const TargetComponent = lazy(importCallback);
-  return (props: any) => (
-    <Suspense fallback={null}>
-      <TargetComponent {...props} />
-    </Suspense>
-  );
-};

package/src/utils/routes.ts

@@ -1,8 +0,0 @@
-export enum Route {
-  ROOT = '/',
-  DETAIL = '/-/web/detail/',
-  SCOPE_PACKAGE = '/-/web/detail/@:scope/:package',
-  SCOPE_PACKAGE_VERSION = '/-/web/detail/@:scope/:package/v/:version',
-  PACKAGE = '/-/web/detail/:package',
-  PACKAGE_VERSION = '/-/web/detail/:package/v/:version',
-}

package/src/utils/token-generate.ts

@@ -1,33 +0,0 @@
-/**
- * Token Utility
- */
-import dayjs from 'dayjs';
-
-function encodeBase64(string: string) {
-  return Buffer.from(string).toString('base64');
-}
-
-export function generateTokenWithTimeRange(amount = 0) {
-  const payload = {
-    username: 'verdaccio',
-    exp: Number.parseInt(String(dayjs(new Date()).add(amount, 'hour').valueOf() / 1000), 10),
-  };
-  return `xxxxxx.${encodeBase64(JSON.stringify(payload))}.xxxxxx`;
-}
-
-export function generateTokenWithExpirationAsString() {
-  const payload = { username: 'verdaccio', exp: 'I am not a number' };
-  return `xxxxxx.${encodeBase64(JSON.stringify(payload))}.xxxxxx`;
-}
-
-export function generateInvalidToken() {
-  const payload = `invalidtoken`;
-  return `xxxxxx.${encodeBase64(payload)}.xxxxxx`;
-}
-
-export function generateTokenWithOutExpiration() {
-  const payload = {
-    username: 'verdaccio',
-  };
-  return `xxxxxx.${encodeBase64(JSON.stringify(payload))}.xxxxxx`;
-}

package/src/utils/token.test.ts

@@ -1,55 +0,0 @@
-import { vi } from 'vitest';
-
-import { isTokenExpire } from './token';
-import {
-  generateInvalidToken,
-  generateTokenWithExpirationAsString,
-  generateTokenWithOutExpiration,
-  generateTokenWithTimeRange,
-} from './token-generate';
-
-/* eslint-disable no-console */
-console.error = vi.fn();
-
-describe('isTokenExpire', (): void => {
-  test('isTokenExpire - null is not a valid payload', (): void => {
-    expect(isTokenExpire(null)).toBeTruthy();
-  });
-
-  test('isTokenExpire - token is not a valid payload', (): void => {
-    expect(isTokenExpire('not_a_valid_token')).toBeTruthy();
-  });
-
-  test('isTokenExpire - token should not expire in 24 hrs range', (): void => {
-    const token = generateTokenWithTimeRange(24);
-    expect(isTokenExpire(token)).toBeFalsy();
-  });
-
-  test('isTokenExpire - token should expire for current time', (): void => {
-    const token = generateTokenWithTimeRange();
-    expect(isTokenExpire(token)).toBeTruthy();
-  });
-
-  test('isTokenExpire - token expiration is not available', (): void => {
-    const token = generateTokenWithOutExpiration();
-    expect(isTokenExpire(token)).toBeTruthy();
-  });
-
-  test('isTokenExpire - token is not a valid json token', (): void => {
-    const NODE_MAJOR_VERSION = +process.versions.node.split('.')[0];
-    const errorToken = new SyntaxError(
-      NODE_MAJOR_VERSION >= 20
-        ? 'Unexpected token \'i\', "invalidtoken" is not valid JSON'
-        : 'Unexpected token i in JSON at position 0'
-    );
-    const token = generateInvalidToken();
-    const result = ['Invalid token:', errorToken, 'xxxxxx.aW52YWxpZHRva2Vu.xxxxxx'];
-    expect(isTokenExpire(token)).toBeTruthy();
-    expect(console.error).toHaveBeenCalledWith(...result);
-  });
-
-  test('isTokenExpire - token expiration is not a number', (): void => {
-    const token = generateTokenWithExpirationAsString();
-    expect(isTokenExpire(token)).toBeTruthy();
-  });
-});

package/src/utils/token.ts

@@ -1,33 +0,0 @@
-import { Base64 } from 'js-base64';
-import isNumber from 'lodash/isNumber';
-import isString from 'lodash/isString';
-
-export function isTokenExpire(token: string | null): boolean {
-  if (!isString(token)) {
-    return true;
-  }
-
-  const [, payload] = token.split('.');
-
-  if (!payload) {
-    return true;
-  }
-
-  let exp: number;
-  try {
-    exp = JSON.parse(Base64.decode(payload)).exp;
-  } catch (error: any) {
-    // eslint-disable-next-line no-console
-    console.error('Invalid token:', error, token);
-    return true;
-  }
-
-  if (!exp || !isNumber(exp)) {
-    return true;
-  }
-  // Report as expire before (real expire time - 30s)
-  const jsTimestamp = exp * 1000 - 30000;
-  const expired = Date.now() >= jsTimestamp;
-
-  return expired;
-}

package/src/utils/url.test.ts

@@ -1,32 +0,0 @@
-import { extractFileName, isEmail, isURL } from './url';
-
-describe('utils', () => {
-  describe('url', () => {
-    test('isURL() - should return true for localhost', () => {
-      expect(isURL('http://localhost:8080/bootstrap/-/bootstrap-4.3.1.tgz')).toBeTruthy();
-    });
-
-    test('isURL() - should return false when protocol is missing', () => {
-      expect(isURL('localhost:8080/bootstrap/-/bootstrap-4.3.1.tgz')).toBeFalsy();
-    });
-
-    test('isEmail() - should return true if valid', () => {
-      expect(isEmail('email@domain.com')).toBeTruthy();
-    });
-    test('isEmail() - should return false if invalid', () => {
-      expect(isEmail('')).toBeFalsy();
-    });
-
-    test('git repo is valid', () => {
-      expect(isURL('git://github.com/verdaccio/ui.git')).toBeTruthy();
-    });
-  });
-
-  describe('extractFileName', () => {
-    test('should return the file name', () => {
-      expect(extractFileName('http://localhost:4872/juan_test_webpack1/-/test-10.0.0.tgz')).toBe(
-        'test-10.0.0.tgz'
-      );
-    });
-  });
-});

package/src/utils/url.ts

@@ -1,73 +0,0 @@
-import isEmailValidator from 'validator/lib/isEmail';
-import isURLValidator from 'validator/lib/isURL';
-
-export function isURL(url: string): boolean {
-  return isURLValidator(url || '', {
-    protocols: ['http', 'https', 'git+https', 'git'],
-    require_protocol: true,
-    require_tld: false,
-  });
-}
-
-export function isEmail(email: string): boolean {
-  return isEmailValidator(email || '');
-}
-
-export function extractFileName(url: string): string {
-  return url.substring(url.lastIndexOf('/') + 1);
-}
-
-function blobToFile(blob: Blob, fileName: string): File {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const b: any = blob;
-  b.lastModified = Date.now();
-  b.name = fileName;
-  return b as File;
-}
-
-export function downloadFile(fileStream: Blob, fileName: string): void {
-  let file: File;
-  // File constructor is not supported by Edge
-  // https://developer.mozilla.org/en-US/docs/Web/API/File#Browser_compatibility
-  // @ts-ignore. Please see: https://github.com/microsoft/TypeScript/issues/33792
-  if (navigator.msSaveBlob) {
-    // Detect if Edge
-    file = blobToFile(new Blob([fileStream], { type: 'application/octet-stream' }), fileName);
-  } else {
-    file = new File([fileStream], fileName, {
-      type: 'application/octet-stream',
-      lastModified: Date.now(),
-    });
-  }
-
-  const objectURL = URL.createObjectURL(file);
-  const fileLink = document.createElement('a');
-  fileLink.href = objectURL;
-  fileLink.download = fileName;
-
-  // Skip actual download in test environment to avoid JSDOM navigation error
-  // Check if we're in a test environment (JSDOM)
-  const isTestEnvironment =
-    (typeof window !== 'undefined' &&
-      window.navigator &&
-      window.navigator.userAgent &&
-      window.navigator.userAgent.includes('Node.js')) ||
-    window.navigator.userAgent.includes('jsdom');
-
-  if (!isTestEnvironment) {
-    // Without appending to an HTML Element, download dialog does not show up on Firefox
-    // https://github.com/verdaccio/ui/issues/119
-    document.documentElement.appendChild(fileLink);
-    fileLink.click();
-    // firefox requires remove the object url
-    setTimeout(() => {
-      URL.revokeObjectURL(objectURL);
-      document.documentElement.removeChild(fileLink);
-    }, 150);
-  } else {
-    // In test environment, just clean up without triggering navigation
-    setTimeout(() => {
-      URL.revokeObjectURL(objectURL);
-    }, 150);
-  }
-}

package/src/utils/utils.test.ts

@@ -1,146 +0,0 @@
-import MockDate from 'mockdate';
-
-import { packageMeta } from './__partials__/packageMeta';
-import {
-  fileSizeSI,
-  formatDate,
-  formatDateDistance,
-  formatLicense,
-  formatRepository,
-  getLastUpdatedPackageTime,
-  getRecentReleases,
-  getUplink,
-} from './utils';
-
-describe('formatLicense', (): void => {
-  beforeEach(() => {
-    MockDate.set(new Date());
-  });
-
-  afterEach(() => {
-    MockDate.reset();
-  });
-
-  test('should check license field different values', (): void => {
-    expect(formatLicense('MIT')).toEqual('MIT');
-  });
-
-  test('should check license field for object value', (): void => {
-    const license = { type: 'ISC', url: 'https://opensource.org/licenses/ISC' };
-    expect(formatLicense(license)).toEqual('ISC');
-  });
-
-  test('should check license field for other value', (): void => {
-    expect(formatLicense(null)).toBeUndefined();
-    expect(formatLicense({})).toBeUndefined();
-    expect(formatLicense([])).toBeUndefined();
-  });
-});
-
-describe('formatRepository', (): void => {
-  test('should check repository field different values', (): void => {
-    const repository = 'https://github.com/verdaccio/verdaccio';
-    expect(formatRepository(repository)).toEqual(repository);
-  });
-
-  test('should check repository field for object value', (): void => {
-    const license = {
-      type: 'git',
-      url: 'https://github.com/verdaccio/verdaccio',
-    };
-    expect(formatRepository(license)).toEqual(license.url);
-  });
-
-  test('should check repository field for other value', (): void => {
-    expect(formatRepository(null)).toBeNull();
-    expect(formatRepository({})).toBeNull();
-    expect(formatRepository([])).toBeNull();
-  });
-});
-
-describe('formatDate', (): void => {
-  test('should format the date', (): void => {
-    const date = 1532211072138;
-    expect(formatDate(date)).toEqual('07/21/2018 10:11:12 PM');
-  });
-});
-
-describe('formatDateDistance', (): void => {
-  test('should calculate the distance', (): void => {
-    // https://day.js.org/docs/en/display/from-now#list-of-breakdown-range
-    const dateYearAgo = () => {
-      const date = new Date();
-      date.setDate(date.getDate() - 365);
-      return date;
-    };
-
-    const dateTwoMonthsAgo = (): Date => {
-      const date = new Date();
-      date.setDate(date.getDate() - 60);
-      return date;
-    };
-
-    const date1 = dateYearAgo();
-    const date2 = dateTwoMonthsAgo();
-
-    expect(formatDateDistance(date1)).toEqual('a year ago');
-    expect(formatDateDistance(date2)).toEqual('2 months ago');
-  });
-});
-
-describe('getLastUpdatedPackageTime', (): void => {
-  test('should get the last update time', (): void => {
-    const lastUpdated = packageMeta._uplinks;
-    expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('07/22/2018 10:11:12 PM');
-  });
-
-  test('should get the last update time for blank uplink', (): void => {
-    const lastUpdated = {};
-    expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('');
-  });
-});
-
-describe('getRecentReleases', (): void => {
-  test('should get the recent releases', (): void => {
-    const { time } = packageMeta;
-    const result = [
-      { time: '12/14/2017 3:43:27 PM', version: '2.7.1' },
-      { time: '12/05/2017 11:25:06 PM', version: '2.7.0' },
-      { time: '11/08/2017 10:47:16 PM', version: '2.6.6' },
-    ];
-    expect(getRecentReleases(time)).toEqual(result);
-    expect(getRecentReleases()).toEqual([]);
-  });
-});
-
-describe('getUplink', (): void => {
-  test('getUplink for npmjs', () => {
-    expect(getUplink('npmjs', 'semver')).toEqual('https://www.npmjs.com/package/semver');
-  });
-
-  test('getUplink for server1', () => {
-    expect(getUplink('server1', 'semver')).toEqual(null);
-  });
-});
-
-describe('fileSizeSI', (): void => {
-  test('fileSizeSI as number 1234567', () => {
-    expect(fileSizeSI(1234567)).toEqual('1.2 MB');
-  });
-
-  test('fileSizeSI as number 9876', () => {
-    expect(fileSizeSI(9876)).toEqual('9.9 kB');
-  });
-
-  test('fileSizeSI as number 1000', () => {
-    expect(fileSizeSI(1000)).toEqual('1.0 kB');
-  });
-
-  test('fileSizeSI as number 123', () => {
-    expect(fileSizeSI(123)).toEqual('123 Bytes');
-  });
-
-  test('fileSizeSI as number 0', () => {
-    expect(fileSizeSI(0)).toEqual('0 Bytes');
-  });
-});

package/src/utils/utils.ts

@@ -1,135 +0,0 @@
-import dayjs from 'dayjs';
-import localizedFormat from 'dayjs/plugin/localizedFormat';
-import relativeTime from 'dayjs/plugin/relativeTime';
-import i18next from 'i18next';
-import isString from 'lodash/isString';
-
-import { UpLinks } from '@verdaccio/types';
-
-import { Time } from '../types/packageMeta';
-
-export const TIMEFORMAT = 'L LTS';
-
-dayjs.extend(relativeTime);
-dayjs.extend(localizedFormat);
-
-/**
- * Formats license field for webui.
- * @see https://docs.npmjs.com/files/package.json#license
- */
-// License should use type License defined above, but conflicts with the unit test that provide array or empty object
-/* eslint-disable @typescript-eslint/no-explicit-any */
-export function formatLicense(license: any): string | undefined {
-  if (isString(license)) {
-    return license;
-  }
-
-  if (license?.type) {
-    return license.type;
-  }
-
-  return;
-}
-
-export interface Repository {
-  type: string;
-  url: string;
-}
-
-/**
- * Formats repository field for webui.
- * @see https://docs.npmjs.com/files/package.json#repository
- */
-
-// Repository should use type Repository defined above, but conflicts with the unit test that provide array or empty object
-/* eslint-disable @typescript-eslint/no-explicit-any */
-export function formatRepository(repository: any): string | null {
-  if (isString(repository)) {
-    return repository;
-  }
-
-  if (repository?.url) {
-    return repository.url;
-  }
-
-  return null;
-}
-
-export function formatDate(lastUpdate: string | number): string {
-  return dayjs(new Date(lastUpdate)).format(TIMEFORMAT);
-}
-
-export function formatDateDistance(lastUpdate: Date | string | number): string {
-  return dayjs(new Date(lastUpdate)).fromNow();
-}
-
-/**
- * For <LastSync /> component
- * @param {array} uplinks
- */
-export function getLastUpdatedPackageTime(uplinks: UpLinks = {}): string {
-  let lastUpdate = 0;
-  Object.keys(uplinks).forEach(function computeUplink(upLinkName): void {
-    const status = uplinks[upLinkName];
-    if (status.fetched > lastUpdate) {
-      lastUpdate = status.fetched;
-    }
-  });
-
-  return lastUpdate ? formatDate(lastUpdate) : '';
-}
-
-/**
- * For <LastSync /> component
- * @param {Object} time
- * @returns {Array} last 3 releases
- */
-export function getRecentReleases(time: Time = {}): Time[] {
-  const recent = Object.keys(time).map((version) => ({
-    version,
-    time: formatDate(time[version]),
-  }));
-
-  return recent.slice(recent.length - 3, recent.length).reverse();
-}
-
-export function getAuthorName(authorName?: string): string {
-  if (!authorName) {
-    return i18next.t('author-unknown');
-  }
-
-  if (authorName.toLowerCase() === 'anonymous') {
-    return i18next.t('author-anonymous');
-  }
-
-  return authorName;
-}
-
-export function getUplink(upLinkName: string, packageName: string): string | null {
-  // TODO: make this a config like "uplinks: npmjs: web: https://www.npmjs.com/package/"
-  switch (upLinkName) {
-    case 'npmjs':
-      return `https://www.npmjs.com/package/${packageName}`;
-  }
-  return null;
-}
-
-export function fileSizeSI(
-  a: number,
-  b?: typeof Math,
-  c?: (p: number) => number,
-  d?: number,
-  e?: number
-): string {
-  b = Math;
-  c = b.log;
-  d = 1e3;
-  e = (c(a) / c(d)) | 0;
-  let size = a / b.pow(d, e);
-  // no decimals for Bytes
-  if (e === 0) {
-    return Math.floor(size) + ' Bytes';
-  } else {
-    return size.toFixed(1) + ' ' + 'kMGTPEZY'[--e] + 'B';
-  }
-}

package/tsconfig.build.json

@@ -1,23 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "module": "ESNext",
-    "moduleResolution": "node",
-    "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true,
-    "sourceMap": true,
-    "preserveSymlinks": true,
-    "rootDir": "./src",
-    "outDir": "./build",
-    "skipLibCheck": true,
-    "jsx": "react",
-    "types": ["node", "@testing-library/jest-dom"]
-  },
-  "include": ["src/**/*"],
-  "exclude": ["src/**/*.stories.tsx", "src/**/*.test.tsx", "src/**/*.test.ts"],
-  "typedocOptions": {
-    "categoryOrder": ["Model", "Component", "Provider", "*"],
-    "defaultCategory": "Component",
-    "categorizeByGroup": "false"
-  }
-}

package/tsconfig.json

@@ -1,22 +0,0 @@
-{
-  "extends": "../../tsconfig.reference.json",
-  "compilerOptions": {
-    "module": "ESNext",
-    "moduleResolution": "node",
-    "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true,
-    "sourceMap": true,
-    "rootDir": "./src",
-    "outDir": "./build",
-    "preserveSymlinks": true,
-    "jsx": "react",
-    "allowJs": true,
-    "types": ["node", "jest", "@testing-library/jest-dom"]
-  },
-  "include": ["src/**/*"],
-  "references": [
-    {
-      "path": "../core/types"
-    }
-  ]
-}