@lvce-editor/extension-detail-view 4.4.0 → 4.6.0

package/dist/extensionDetailViewWorkerMain.js

@@ -305,7 +305,7 @@ const Features$1 = 'Features';
 const FeaturesList = 'FeaturesList';
 const FeatureWebView = 'FeatureWebView';
 const Large$1 = 'Large';
-const Link = 'Link';
+const Link$1 = 'Link';
 const Markdown = 'Markdown';
 const MoreInfo = 'MoreInfo';
 const MoreInfoEntry = 'MoreInfoEntry';
@@ -323,6 +323,7 @@ const SettingsIcon = 'SettingsIcon';
 const Small$1 = 'Small';
 const Table = 'Table';
 const TableCell = 'TableCell';
+const TableCellInvalid = 'TableCellInvalid';
 const TableHeading = 'TableHeading';
 const Viewlet = 'Viewlet';
 
@@ -363,6 +364,7 @@ const getActivationEventsVirtualDom = state => {
 
 const Text = 1;
 const Code = 2;
+const Link = 7;
 
 const getCommandTableEntry = command => {
   // TODO watch out for command being null/undefined/number/string/array
@@ -424,22 +426,44 @@ const getTableHeadingVirtualDom = heading => {
   }, text(heading)];
 };
 
-const getCellCodeVirtualDom = value => {
+const getCellCodeVirtualDom = (value, props) => {
+  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
     type: Td,
-    className: TableCell,
-    childCount: 1
+    className: tdClassName,
+    childCount: 1,
+    ...(props?.title ? {
+      title: props.title
+    } : {})
   }, {
     type: Code$2,
     childCount: 1
   }, text(value)];
 };
 
-const getCellTextVirtualDom = value => {
+const getCellLinkVirtualDom = (value, {
+  href
+}) => {
   return [{
     type: Td,
     className: TableCell,
     childCount: 1
+  }, {
+    type: A,
+    href,
+    childCount: 1
+  }, text(value)];
+};
+
+const getCellTextVirtualDom = (value, props) => {
+  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
+  return [{
+    type: Td,
+    className: tdClassName,
+    childCount: 1,
+    ...(props?.title ? {
+      title: props.title
+    } : {})
   }, text(value)];
 };
 
@@ -449,6 +473,8 @@ const getCellRenderer = type => {
       return getCellCodeVirtualDom;
     case Text:
       return getCellTextVirtualDom;
+    case Link:
+      return getCellLinkVirtualDom;
     default:
       throw new Error(`unexpected cell type ${type}`);
   }
@@ -457,10 +483,11 @@ const getCellRenderer = type => {
 const getCellVirtualDom = entry => {
   const {
     value,
-    type
+    type,
+    ...props
   } = entry;
   const fn = getCellRenderer(type);
-  return fn(value);
+  return fn(value, props);
 };
 
 const getTableRowVirtualDom = entries => {
@@ -509,24 +536,94 @@ const getCommandsVirtualDom = state => {
   return getFeatureCommandsVirtualDom(state.commands);
 };
 
-const getJsonValidationTableEntry = validation => {
-  // TODO handle case when validation is invalid like null
+const stringifyValue = value => {
+  return JSON.stringify(value);
+};
+const getLinkOrTextEntry = (schema, schemaLinkUrl) => {
+  if (typeof schema !== 'string') {
+    return {
+      type: Text,
+      value: stringifyValue(schema)
+    };
+  }
+  if (schemaLinkUrl) {
+    return {
+      type: Link,
+      value: schema,
+      href: schemaLinkUrl
+    };
+  }
+  return {
+    type: Text,
+    value: schema
+  };
+};
+
+const isExternalLink = schema => {
+  return schema.startsWith('http://') || schema.startsWith('https://');
+};
+const getSchemaLinkUrl = (schema, extensionUri) => {
+  if (!schema) {
+    return '';
+  }
+  if (typeof schema !== 'string') {
+    return '';
+  }
+  if (isExternalLink(schema)) {
+    return schema;
+  }
+  return new URL(schema, extensionUri).toString();
+};
+
+const stringify = value => {
+  try {
+    return JSON.stringify(value);
+  } catch {
+    return String(value);
+  }
+};
+const getJsonValidationTableEntry = (validation, extensionUri) => {
+  const invalidProps = {
+    className: TableCellInvalid,
+    title: 'property must be a string'
+  };
+  if (!validation || typeof validation !== 'object' || Array.isArray(validation)) {
+    const shown = stringify(validation);
+    return [{
+      type: Text,
+      value: shown,
+      ...invalidProps
+    }, {
+      type: Text,
+      value: shown,
+      ...invalidProps
+    }];
+  }
   const {
     fileMatch
   } = validation;
   const schema = validation.schema ?? validation.url;
-  return [{
+  const schemaLinkUrl = getSchemaLinkUrl(schema, extensionUri);
+  const leftCell = typeof fileMatch === 'string' || Array.isArray(fileMatch) ? {
     type: Code,
     value: fileMatch
-  }, {
-    type: Code,
-    value: schema
-  }];
+  } : {
+    type: Text,
+    value: stringify(fileMatch),
+    ...invalidProps
+  };
+  const rightEntry = typeof schema === 'string' ? getLinkOrTextEntry(schema, schemaLinkUrl) : {
+    type: Text,
+    value: stringify(schema),
+    ...invalidProps
+  };
+  return [leftCell, rightEntry];
 };
 
 const getJsonValidationDetails = async extension => {
   const validations = extension.jsonValidation || [];
-  const rows = validations.map(getJsonValidationTableEntry);
+  const extensionUri = extension.uri || '';
+  const rows = validations.map(validation => getJsonValidationTableEntry(validation, extensionUri));
   return {
     jsonValidation: rows
   };
@@ -738,7 +835,7 @@ class AssertionError extends Error {
 const Object$1 = 1;
 const Number$1 = 2;
 const Array$1 = 3;
-const String = 4;
+const String$1 = 4;
 const Boolean$1 = 5;
 const Function = 6;
 const Null = 7;
@@ -750,7 +847,7 @@ const getType = value => {
     case 'function':
       return Function;
     case 'string':
-      return String;
+      return String$1;
     case 'object':
       if (value === null) {
         return Null;
@@ -767,7 +864,7 @@ const getType = value => {
 };
 const string = value => {
   const type = getType(value);
-  if (type !== String) {
+  if (type !== String$1) {
     throw new AssertionError('expected value to be of type string');
   }
 };
@@ -2382,20 +2479,21 @@ const getSettingsVirtualDom = state => {
   return getFeatureSettingsVirtualDom(state.settings);
 };
 
-const HandleClickCategory = 'handleClickCategory';
-const HandleClickDisable = 'handleClickDisable';
-const HandleClickEnable = 'handleClickEnable';
-const HandleClickScrollToTop = 'handleClickScrollToTop';
-const HandleClickSetColorTheme = 'handleClickSetColorTheme';
-const HandleClickSettings = 'handleClickSettings';
-const HandleClickSize = 'handleClickSize';
-const HandleClickUninstall = 'handleClickUninstall';
-const HandleFeaturesClick = 'handleFeaturesClick';
-const HandleIconError = 'handleIconError';
-const HandleImageContextMenu = 'handleImageContextMenu';
-const HandleReadmeContextMenu = 'handleReadmeContextMenu';
-const HandleReadmeScroll = 'handleReadmeScroll';
-const HandleTabsClick = 'handleTabsClick';
+const HandleClickCategory = 1;
+const HandleClickDisable = 2;
+const HandleClickEnable = 3;
+const HandleClickScrollToTop = 4;
+const HandleClickSetColorTheme = 5;
+const HandleClickSettings = 6;
+const HandleClickSize = 7;
+const HandleClickUninstall = 8;
+const HandleFeaturesClick = 9;
+const HandleIconError = 10;
+const HandleImageContextMenu = 11;
+const HandleReadmeContextMenu = 12;
+const HandleReadmeScroll = 13;
+const HandleTabsClick = 14;
+const HandleAdditionalDetailContextMenu = 15;
 
 const ActivationEvents = 'ActivationEvents';
 const Changelog = 'Changelog';
@@ -2484,6 +2582,18 @@ const getThemeMarkdown = (themes, iconThemes, productIconThemes) => {
   return markdown;
 };
 
+const supportsNormalCacheKey = locationProtocol => {
+  return locationProtocol === 'http:' || locationProtocol === 'https:';
+};
+
+const getMarkdownCacheKey = (hash, locationProtocol) => {
+  if (supportsNormalCacheKey(locationProtocol)) {
+    return `/markdown/${hash}`;
+  }
+  // workaround for electron bug
+  return `https://-/markdown/${hash}`;
+};
+
 const hash = async content => {
   const sourceBytes = new TextEncoder().encode(content);
   const digest = await crypto.subtle.digest('SHA-256', sourceBytes);
@@ -2548,9 +2658,9 @@ const set$3 = async (key, value) => {
   }));
 };
 
-const renderMarkdownCached = async (markdown, options = {}) => {
+const renderMarkdownCached = async (markdown, options) => {
   const markdownHash = await hash(markdown); // TODO hash options also
-  const cacheKey = `/markdown/${markdownHash}`;
+  const cacheKey = getMarkdownCacheKey(markdownHash, options.locationProtocol);
   const hasItem = await has(cacheKey);
   if (hasItem) {
     const value = await get$1(cacheKey);
@@ -2561,12 +2671,12 @@ const renderMarkdownCached = async (markdown, options = {}) => {
   return html;
 };
 
-const renderMarkdown = async (markdown, options = {}) => {
+const renderMarkdown = async (markdown, options) => {
   const html = await renderMarkdownCached(markdown, options);
   return html;
 };
 
-const getThemeDetails = async (extension, baseUrl) => {
+const getThemeDetails = async (extension, baseUrl, locationProtocol) => {
   const {
     colorThemes,
     iconThemes,
@@ -2574,7 +2684,8 @@ const getThemeDetails = async (extension, baseUrl) => {
   } = extension;
   const markdown = getThemeMarkdown(colorThemes || [], iconThemes || [], productIconThemes || []);
   const rendered = await renderMarkdown(markdown, {
-    baseUrl
+    baseUrl,
+    locationProtocol
   });
   const themesMarkdownDom = await getMarkdownVirtualDom(rendered);
   return {
@@ -3000,7 +3111,8 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     paddingLeft: 0,
     paddingRight: 0,
     showSideBar: true,
-    sideBarWidth: 0
+    sideBarWidth: 0,
+    locationProtocol: ''
   };
   set(uid, state, state);
 };
@@ -3121,6 +3233,10 @@ const getMenus = () => {
   }];
 };
 
+const handleAdditionalDetailContextMenu = state => {
+  return state;
+};
+
 const openExtensionSearch = async searchValue => {
   await openExtensionSearch$1();
   await setExtensionsSearchValue(searchValue);
@@ -3237,7 +3353,8 @@ const selectFeature = async (state, name) => {
   const {
     features,
     extension,
-    baseUrl
+    baseUrl,
+    locationProtocol
   } = state;
   const newFeatures = features.map(feature => {
     if (feature.id === name) {
@@ -3252,7 +3369,7 @@ const selectFeature = async (state, name) => {
     };
   });
   const fn = getFeatureDetailsHandler(name);
-  const partialNewState = await fn(extension, baseUrl);
+  const partialNewState = await fn(extension, baseUrl, locationProtocol);
   return {
     ...state,
     ...partialNewState,
@@ -3413,11 +3530,13 @@ const selectTabChangelog = async state => {
   const {
     extension,
     baseUrl,
-    tabs
+    tabs,
+    locationProtocol
   } = state;
   const changelogContent = await loadChangelogContent(extension.path); // TODO use uri
   const changelogMarkdownHtml = await renderMarkdown(changelogContent, {
-    baseUrl
+    baseUrl,
+    locationProtocol
   });
   const changelogDom = await getMarkdownVirtualDom(changelogMarkdownHtml);
   const newTabs = tabs.map(tab => {
@@ -3457,12 +3576,14 @@ const selectTabDetails = async state => {
   const {
     baseUrl,
     readmeUrl,
-    tabs
+    tabs,
+    locationProtocol
   } = state;
   const readmeContent = await loadReadmeContent(readmeUrl);
   const readmeHtml = await renderMarkdown(readmeContent, {
     baseUrl,
-    linksExternal: true
+    linksExternal: true,
+    locationProtocol
   });
   const detailsDom = await getMarkdownVirtualDom(readmeHtml);
   const newTabs = tabs.map(tab => {
@@ -3485,14 +3606,15 @@ const selectTabFeatures = async state => {
     baseUrl,
     selectedFeature,
     features,
-    tabs
+    tabs,
+    locationProtocol
   } = state;
   if (features.length === 0) {
     return state;
   }
   const actualSelectedFeature = selectedFeature || Theme;
   const fn = getFeatureDetailsHandler(actualSelectedFeature);
-  const partialNewState = await fn(extension, baseUrl);
+  const partialNewState = await fn(extension, baseUrl, locationProtocol);
   const newTabs = tabs.map(tab => {
     return {
       ...tab,
@@ -4111,9 +4233,11 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
   const [hasReadme, hasChangelog] = await Promise.all([existsFile(readmeUrl), existsFile(changelogUrl)]);
   const readmeContent = hasReadme ? await loadReadmeContent(readmeUrl) : noReadmeFound();
   const baseUrl = getBaseUrl(extension.path, platform);
+  const locationProtocol = location.protocol;
   const readmeHtml = await renderMarkdown(readmeContent, {
     baseUrl,
-    linksExternal: true
+    linksExternal: true,
+    locationProtocol
   });
   const detailsVirtualDom = await getMarkdownVirtualDom(readmeHtml, {
     scrollToTopEnabled: true
@@ -4181,7 +4305,8 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
     sideBarWidth,
     sizeOnDisk: size,
     sizeValue,
-    tabs: enabledTabs
+    tabs: enabledTabs,
+    locationProtocol
   };
 };
 
@@ -4280,7 +4405,7 @@ const getMoreInfoEntryKeyVirtualDom = item => {
   return [parentNode, text(key)];
 };
 
-const classLink = mergeClassNames(MoreInfoEntryValue, Link);
+const classLink = mergeClassNames(MoreInfoEntryValue, Link$1);
 const classCode = mergeClassNames(MoreInfoEntryValue, Code$1);
 const getMoreInfoEntryValueClassName = (onClick, code) => {
   if (onClick) {
@@ -4302,13 +4427,15 @@ const getMoreInfoEntryValueTag = (onClick, code) => {
   return Dd;
 };
 
-const getExtraProps = title => {
+const getExtraProps = (title, onClick) => {
+  const props = Object.create(null);
   if (title) {
-    return {
-      title
-    };
+    props.title = title;
   }
-  return {};
+  if (onClick) {
+    props.tabIndex = 0;
+  }
+  return props;
 };
 const getMoreInfoEntryValueVirtualDom = item => {
   const {
@@ -4319,7 +4446,7 @@ const getMoreInfoEntryValueVirtualDom = item => {
   } = item;
   const type = getMoreInfoEntryValueTag(onClick, code);
   const className = getMoreInfoEntryValueClassName(onClick, code);
-  const extraProps = getExtraProps(title);
+  const extraProps = getExtraProps(title, onClick);
   return [{
     type,
     className,
@@ -4388,7 +4515,8 @@ const getAdditionalDetailsVirtualDom = (showAdditionalDetails, firstHeading, ent
     type: Div,
     className: AdditionalDetails,
     tabIndex: 0,
-    childCount: 4
+    childCount: 4,
+    onClick: HandleAdditionalDetailContextMenu
   }, ...getAdditionalDetailsEntryVirtualDom(firstHeading, entries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(secondHeading, secondEntries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(thirdHeading, categories, getCategoriesDom), ...getAdditionalDetailsEntryVirtualDom(fourthHeading, resources, getResourcesVirtualDom)];
 };
 
@@ -4731,8 +4859,13 @@ const render2 = (uid, diffResult) => {
   return commands;
 };
 
+// @ts-nocheck
 const renderEventListeners = () => {
   return [{
+    name: HandleAdditionalDetailContextMenu,
+    params: ['handleAdditionalDetailsContextMenu'],
+    preventDefault: true
+  }, {
     name: HandleClickCategory,
     params: ['handleClickCategory', TargetName]
   }, {
@@ -4816,6 +4949,7 @@ const commandMap = {
   'ExtensionDetail.getMenuEntries': getMenuEntries,
   'ExtensionDetail.getMenus': getMenus,
   'ExtensionDetail.handleClickCategory': wrapCommand(handleClickCategory),
+  'ExtensionDetail.handleAdditionalDetailsContextMenu': wrapCommand(handleAdditionalDetailContextMenu),
   'ExtensionDetail.handleClickDisable': wrapCommand(handleClickDisable),
   'ExtensionDetail.handleClickEnable': wrapCommand(handleClickEnable),
   'ExtensionDetail.handleClickScrollToTop': wrapCommand(handleClickScrollToTop),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/extension-detail-view",
-  "version": "4.4.0",
+  "version": "4.6.0",
   "description": "Extension Detail View Worker",
   "repository": {
     "type": "git",