@lvce-editor/extension-detail-view 3.58.0 → 3.60.0

package/dist/extensionDetailViewWorkerMain.js

@@ -2538,7 +2538,7 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     selectedTab: '',
     settings: [],
     settingsButtonEnabled: false,
-    showAdditionalDetailsBreakpoint: 600,
+    showAdditionalDetailsBreakpoint: 700,
     sizeOnDisk: 0,
     sizeValue: 0,
     tabs: [],
@@ -2548,13 +2548,15 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     width,
     readmeUrl: '',
     paddingLeft: 0,
-    paddingRight: 0
+    paddingRight: 0,
+    showSideBar: true,
+    sideBarWidth: 0
   };
   set(uid, state, state);
 };
 
 const isEqual$3 = (oldState, newState) => {
-  return oldState.paddingLeft === newState.paddingLeft && oldState.paddingRight === newState.paddingRight;
+  return oldState.paddingLeft === newState.paddingLeft && oldState.paddingRight === newState.paddingRight && oldState.sideBarWidth === newState.sideBarWidth;
 };
 
 const isEqual$2 = (oldState, newState) => {
@@ -2562,7 +2564,7 @@ const isEqual$2 = (oldState, newState) => {
 };
 
 const isEqual$1 = (oldState, newState) => {
-  return oldState.activationEvents === newState.activationEvents && oldState.badge === newState.badge && oldState.categories === newState.categories && oldState.changelogVirtualDom === newState.changelogVirtualDom && oldState.commands === newState.commands && oldState.description === newState.description && oldState.detailsVirtualDom === newState.detailsVirtualDom && oldState.displaySize === newState.displaySize && oldState.extensionId === newState.extensionId && oldState.extensionVersion === newState.extensionVersion && oldState.jsonValidation === newState.jsonValidation && oldState.selectedFeature === newState.selectedFeature && oldState.selectedTab === newState.selectedTab && oldState.settings === newState.settings && oldState.themesMarkdownDom === newState.themesMarkdownDom && oldState.webViews === newState.webViews && oldState.sizeValue === newState.sizeValue;
+  return oldState.activationEvents === newState.activationEvents && oldState.badge === newState.badge && oldState.categories === newState.categories && oldState.changelogVirtualDom === newState.changelogVirtualDom && oldState.commands === newState.commands && oldState.description === newState.description && oldState.detailsVirtualDom === newState.detailsVirtualDom && oldState.displaySize === newState.displaySize && oldState.extensionId === newState.extensionId && oldState.extensionVersion === newState.extensionVersion && oldState.jsonValidation === newState.jsonValidation && oldState.selectedFeature === newState.selectedFeature && oldState.selectedTab === newState.selectedTab && oldState.settings === newState.settings && oldState.themesMarkdownDom === newState.themesMarkdownDom && oldState.webViews === newState.webViews && oldState.sizeValue === newState.sizeValue && oldState.showSideBar === newState.showSideBar;
 };
 
 const User = 1;
@@ -2847,6 +2849,13 @@ const isEnoentError = error => {
   return error && error.code === ENOENT;
 };
 
+/* eslint-disable @typescript-eslint/prefer-readonly-parameter-types */
+const error = async error => {
+  // TODO send message to error worker or log worker
+  // @ts-ignore
+  console.error(message);
+};
+
 const join = (...parts) => {
   return parts.join('/');
 };
@@ -2856,14 +2865,12 @@ const loadChangelogContent = async path => {
     const changelogUrl = join(path, 'CHANGELOG.md');
     const changelogContent = await readFile(changelogUrl);
     return changelogContent;
-  } catch (error) {
-    if (isEnoentError(error)) {
+  } catch (error$1) {
+    if (isEnoentError(error$1)) {
       return '';
     }
-    // TODO send message to error worker
-    // @ts-ignore
-    console.error(new VError(error, 'Failed to load Changelog content'));
-    return `${error}`;
+    await error(new VError(error$1, 'Failed to load Changelog content'));
+    return `${error$1}`;
   }
 };
 
@@ -3143,6 +3150,38 @@ const getExtensionIdFromUri = uri => {
   return id;
 };
 
+const interpolate = (value, inMin, inMax, outMin, outMax) => {
+  const clamped = Math.min(Math.max(value, inMin), inMax);
+  const ratio = (clamped - inMin) / (inMax - inMin);
+  const mapped = outMin + ratio * (outMax - outMin);
+  return Math.round(mapped);
+};
+
+const getPadding = width => {
+  if (width < 600) {
+    return 10;
+  }
+  if (width < 800) {
+    return 10;
+  }
+  if (width < 1200) {
+    return interpolate(width, 800, 1200, 10, 30);
+  }
+  return 30;
+};
+const getSideBarWidth = width => {
+  if (width < 490) {
+    return 0;
+  }
+  if (width < 650) {
+    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+  }
+  if (width < 800) {
+    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+  }
+  return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+};
+
 const getTabs = (selectedTab, hasReadme, hasFeatures, hasChangelog) => {
   const tabs = [{
     label: details(),
@@ -3224,6 +3263,36 @@ const getName = extension => {
   return 'n/a';
 };
 
+const getDownloadCount = extension => {
+  if (!extension) {
+    return 'n/a';
+  }
+
+  // Check for download count in various possible locations
+  const downloadCount = extension.downloadCount || extension.downloads || extension.marketplace?.downloadCount || extension.marketplace?.downloads || extension.packageJSON?.downloadCount || extension.packageJSON?.downloads;
+  if (!downloadCount) {
+    return 'n/a';
+  }
+
+  // Format the number with commas for better readability
+  return downloadCount.toLocaleString();
+};
+
+const getRating = extension => {
+  if (!extension) {
+    return 'n/a';
+  }
+
+  // Check for rating in various possible locations
+  const rating = extension.rating || extension.averageRating || extension.marketplace?.rating || extension.marketplace?.averageRating || extension.packageJSON?.rating || extension.packageJSON?.averageRating;
+  if (!rating) {
+    return 'n/a';
+  }
+
+  // Format rating to one decimal place
+  return rating.toFixed(1);
+};
+
 const getBadge = (builtin, badgeEnabled) => {
   if (builtin && badgeEnabled) {
     return 'builtin';
@@ -3249,16 +3318,20 @@ const loadHeaderContent = (state, platform, extension) => {
   const hasColorTheme = hasColorThemes(extension);
   const isBuiltin = extension?.builtin;
   const badge = getBadge(isBuiltin, builtinExtensionsBadgeEnabled);
+  const downloadCount = getDownloadCount(extension);
+  const rating = getRating(extension);
   return {
     badge,
     description,
+    downloadCount,
     extension,
     extensionId,
     extensionUri,
     extensionVersion,
     hasColorTheme,
     iconSrc,
-    name
+    name,
+    rating
   };
 };
 
@@ -3517,12 +3590,14 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
   const {
     badge,
     description,
+    downloadCount,
     extensionId,
     extensionUri,
     extensionVersion,
     hasColorTheme,
     iconSrc,
-    name
+    name,
+    rating
   } = headerData;
   const readmeUrl = join(extensionUri, 'README.md');
   const changelogUrl = join(extensionUri, 'CHANGELOG.md');
@@ -3559,8 +3634,9 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
     resources,
     folderSize
   } = await loadSideBarContent(extensionId, extensionVersion, extensionUri, isBuiltin);
-  const paddingLeft = 30;
-  const paddingRight = 30;
+  const padding = getPadding(width);
+  const sideBarWidth = getSideBarWidth(width);
+  const showSideBar = sideBarWidth > 0;
   return {
     ...state,
     badge,
@@ -3572,6 +3648,7 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
     detailsVirtualDom,
     disabled,
     displaySize,
+    downloadCount,
     extension,
     extensionId,
     extensionUri,
@@ -3584,17 +3661,20 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
     installationEntries,
     marketplaceEntries,
     name,
+    paddingLeft: padding,
+    paddingRight: padding,
+    rating,
     readmeScrollTop,
     readmeUrl,
     resources,
     scrollSource: Script,
     scrollToTopButtonEnabled: true,
     selectedTab,
+    showSideBar,
+    sideBarWidth,
     sizeOnDisk: size,
     sizeValue,
-    tabs: enabledTabs,
-    paddingLeft,
-    paddingRight
+    tabs: enabledTabs
   };
 };
 
@@ -3627,11 +3707,13 @@ const renderCss = (oldState, newState) => {
   const {
     uid,
     paddingLeft,
-    paddingRight
+    paddingRight,
+    sideBarWidth
   } = newState;
   const css = createCss({
     ExtensionDetailPaddingLeft: paddingLeft,
-    ExtensionDetailPaddingRight: paddingRight
+    ExtensionDetailPaddingRight: paddingRight,
+    ExtensionDetailSideBarWidth: sideBarWidth
   });
   return ['Viewlet.setCss', uid, css];
 };
@@ -3802,12 +3884,12 @@ const getChildCount = (additionalDetails, scrollToTopEnabled) => {
   }
   return count;
 };
-const getDetailsVirtualDom = (sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories$1, resources$1, showAdditionalDetailsBreakpoint, installationEntries, marketplaceEntries, hasReadme) => {
+const getDetailsVirtualDom = (sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories$1, resources$1, showAdditionalDetailsBreakpoint, installationEntries, marketplaceEntries, hasReadme, showSideBar) => {
   const firstHeading = installation();
   const secondHeading = marketplace();
   const thirdHeading = categories();
   const fourthHeading = resources();
-  const showAdditionalDetails = width > showAdditionalDetailsBreakpoint;
+  const showAdditionalDetails = showSideBar;
   const childCount = getChildCount(showAdditionalDetails);
   const contentDom = hasReadme ? sanitizedReadmeHtml : [{
     type: VirtualDomElements.Div,
@@ -3879,7 +3961,7 @@ const getFeaturesVirtualDom = (features, selectedFeature, state) => {
 const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, selectedTab, width, scrollToTopButtonEnabled, categories, resources, breakpoint, changelogDom, state) => {
   switch (selectedTab) {
     case Details:
-      return getDetailsVirtualDom(sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories, resources, breakpoint, state.installationEntries, state.marketplaceEntries, state.hasReadme);
+      return getDetailsVirtualDom(sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories, resources, breakpoint, state.installationEntries, state.marketplaceEntries, state.hasReadme, state.showSideBar);
     case Features:
       return getFeaturesVirtualDom(state.features, state.selectedFeature, state);
     case Changelog:
@@ -4181,9 +4263,16 @@ const renderEventListeners = () => {
 };
 
 const resize = (state, dimensions) => {
+  const padding = getPadding(dimensions.width);
+  const sideBarWidth = getSideBarWidth(dimensions.width);
+  const showSideBar = sideBarWidth > 0;
   return {
     ...state,
-    ...dimensions
+    ...dimensions,
+    showSideBar,
+    paddingLeft: padding,
+    paddingRight: padding,
+    sideBarWidth
   };
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/extension-detail-view",
-  "version": "3.58.0",
+  "version": "3.60.0",
   "description": "Extension Detail View Worker",
   "license": "MIT",
   "author": "Lvce Editor",