@lvce-editor/extension-detail-view 3.40.0 → 3.42.0

package/dist/extensionDetailViewWorkerMain.js

@@ -729,7 +729,19 @@ const create$7 = rpcId => {
   };
 };
 const RendererWorker$1 = 1;
+const FileSystemWorker$1 = 209;
 const MarkdownWorker$1 = 300;
+const {
+  invoke: invoke$7,
+  set: set$7} = create$7(FileSystemWorker$1);
+const readFile$1$1 = async uri => {
+  return invoke$7('FileSystem.readFile', uri);
+};
+const FileSystemWorker = {
+  __proto__: null,
+  invoke: invoke$7,
+  readFile: readFile$1$1,
+  set: set$7};
 const {
   invoke: invoke$5,
   set: set$5} = create$7(MarkdownWorker$1);
@@ -760,16 +772,14 @@ const sendMessagePortToMarkdownWorker$2 = async (port, rpcId) => {
   // @ts-ignore
   await invokeAndTransfer$3('SendMessagePortToExtensionHostWorker.sendMessagePortToMarkdownWorker', port, command, rpcId);
 };
-const readFile$2 = async uri => {
-  return invoke$3('FileSystem.readFile', uri);
+const sendMessagePortToFileSystemWorker$2 = async (port, rpcId) => {
+  const command = 'FileSystem.handleMessagePort';
+  // @ts-ignore
+  await invokeAndTransfer$3('SendMessagePortToExtensionHostWorker.sendMessagePortToFileSystemWorker', port, command, rpcId);
 };
 const getAllExtensions$2 = async () => {
   return invoke$3('ExtensionManagement.getAllExtensions');
 };
-const getFolderSize$2 = async uri => {
-  // @ts-ignore
-  return await invoke$3('FileSystem.getFolderSize', uri);
-};
 const getExtension$3 = async id => {
   // @ts-ignore
   return invoke$3('ExtensionManagement.getExtension', id);
@@ -785,16 +795,15 @@ const RendererWorker = {
   __proto__: null,
   getAllExtensions: getAllExtensions$2,
   getExtension: getExtension$3,
-  getFolderSize: getFolderSize$2,
   openNativeFolder: openNativeFolder$1,
-  readFile: readFile$2,
+  sendMessagePortToFileSystemWorker: sendMessagePortToFileSystemWorker$2,
   sendMessagePortToMarkdownWorker: sendMessagePortToMarkdownWorker$2,
   set: set$3$1,
   setColorTheme: setColorTheme$2,
   uninstallExtension: uninstallExtension$1};
 
 const {
-  set: set$3,
+  set: set$4,
   getVirtualDom,
   render
 } = MarkdownWorker;
@@ -1531,7 +1540,7 @@ const create$4 = (method, params) => {
   };
 };
 const callbacks = Object.create(null);
-const set$2 = (id, fn) => {
+const set$3 = (id, fn) => {
   callbacks[id] = fn;
 };
 const get$1 = id => {
@@ -1550,7 +1559,7 @@ const registerPromise = () => {
     resolve,
     promise
   } = Promise.withResolvers();
-  set$2(id, resolve);
+  set$3(id, resolve);
   return {
     id,
     promise
@@ -1894,7 +1903,7 @@ const send = (transport, method, ...params) => {
   const message = create$4(method, params);
   transport.send(message);
 };
-const invoke = (ipc, method, ...params) => {
+const invoke$1 = (ipc, method, ...params) => {
   return invokeHelper(ipc, method, params, false);
 };
 const invokeAndTransfer = (ipc, method, ...params) => {
@@ -1927,7 +1936,7 @@ const createRpc = ipc => {
       send(ipc, method, ...params);
     },
     invoke(method, ...params) {
-      return invoke(ipc, method, ...params);
+      return invoke$1(ipc, method, ...params);
     },
     invokeAndTransfer(method, ...params) {
       return invokeAndTransfer(ipc, method, ...params);
@@ -2085,7 +2094,7 @@ const copyImage = state => {
 
 const {
   get,
-  set: set$1,
+  set: set$2,
   dispose: dispose$1,
   wrapCommand
 } = create$1();
@@ -2136,9 +2145,10 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     themesMarkdownDom: [],
     uri,
     webViews: [],
-    width
+    width,
+    readmeUrl: ''
   };
-  set$1(uid, state, state);
+  set$2(uid, state, state);
 };
 
 const isEqual$2 = (oldState, newState) => {
@@ -2153,7 +2163,7 @@ const User = 1;
 const Script = 2;
 
 const isEqual = (oldState, newState) => {
-  return newState.scrollSource === Script || oldState.readmeScrollTop === newState.readmeScrollTop;
+  return newState.scrollSource === User || oldState.readmeScrollTop === newState.readmeScrollTop;
 };
 
 const RenderFocus = 2;
@@ -2182,7 +2192,7 @@ const dispose = uid => {
   dispose$1(uid);
 };
 
-const commandIds = ['copyImage', 'getMenuEntries', 'handleClickCategory', 'handleClickDisable', 'handleClickScrollToTop', 'handleClickSettings', 'handleClickSetColorTheme', 'handleClickSize', 'handleClickUninstall', 'handleFeaturesClick', 'handleIconError', 'handleTabsClick', 'handleWheel', 'renderEventListeners', 'resize', 'saveState', 'selectTab', 'terminate'];
+const commandIds = ['copyImage', 'getMenuEntries', 'handleClickCategory', 'handleClickDisable', 'handleClickScrollToTop', 'handleClickSetColorTheme', 'handleClickSettings', 'handleClickSize', 'handleClickUninstall', 'handleFeaturesClick', 'handleIconError', 'handleScroll', 'handleTabsClick', 'handleWheel', 'renderEventListeners', 'resize', 'saveState', 'selectTab', 'terminate'];
 
 const getCommandIds = () => {
   return commandIds;
@@ -2291,13 +2301,12 @@ const handleClickScrollToTop = state => {
 const {
   getAllExtensions: getAllExtensions$1,
   getExtension: getExtension$2,
-  getFolderSize: getFolderSize$1,
   openNativeFolder,
-  readFile: readFile$1,
-  set,
+  set: set$1,
   setColorTheme: setColorTheme$1,
   uninstallExtension,
-  sendMessagePortToMarkdownWorker: sendMessagePortToMarkdownWorker$1
+  sendMessagePortToMarkdownWorker: sendMessagePortToMarkdownWorker$1,
+  sendMessagePortToFileSystemWorker: sendMessagePortToFileSystemWorker$1
 } = RendererWorker;
 
 const setColorTheme = id => {
@@ -2367,15 +2376,21 @@ const handleIconError = state => {
   };
 };
 
-const handleScroll = (state, scrollTop) => {
+const handleScroll = (state, scrollTop, scrollSource = Script) => {
   const newScrollTop = Math.max(0, scrollTop);
   return {
     ...state,
     readmeScrollTop: newScrollTop,
-    scrollSource: User
+    scrollSource
   };
 };
 
+const {
+  set,
+  readFile: readFile$1,
+  invoke
+} = FileSystemWorker;
+
 const readFile = async uri => {
   return readFile$1(uri);
 };
@@ -2409,17 +2424,25 @@ const loadChangelogContent = async path => {
 const selectTabChangelog = async state => {
   const {
     extension,
-    baseUrl
+    baseUrl,
+    tabs
   } = state;
   const changelogContent = await loadChangelogContent(extension.path); // TODO use uri
   const changelogMarkdownHtml = await renderMarkdown(changelogContent, {
     baseUrl
   });
   const changelogDom = await getMarkdownVirtualDom(changelogMarkdownHtml);
+  const newTabs = tabs.map(tab => {
+    return {
+      ...tab,
+      selected: tab.name === Changelog
+    };
+  });
   return {
     ...state,
     selectedTab: Changelog,
-    changelogVirtualDom: changelogDom
+    changelogVirtualDom: changelogDom,
+    tabs: newTabs
   };
 };
 
@@ -2427,9 +2450,8 @@ const selectTabDefault = async state => {
   return state;
 };
 
-const loadReadmeContent = async path => {
+const loadReadmeContent = async readmeUrl => {
   try {
-    const readmeUrl = join(path, 'README.md');
     const readmeContent = await readFile(readmeUrl);
     return readmeContent;
   } catch (error) {
@@ -2445,18 +2467,26 @@ const loadReadmeContent = async path => {
 
 const selectTabDetails = async state => {
   const {
-    extension,
-    baseUrl
+    baseUrl,
+    readmeUrl,
+    tabs
   } = state;
-  const readmeContent = await loadReadmeContent(extension.path);
+  const readmeContent = await loadReadmeContent(readmeUrl);
   const readmeHtml = await renderMarkdown(readmeContent, {
     baseUrl
   });
   const detailsDom = await getMarkdownVirtualDom(readmeHtml);
+  const newTabs = tabs.map(tab => {
+    return {
+      ...tab,
+      selected: tab.name === Details
+    };
+  });
   return {
     ...state,
     selectedTab: Details,
-    detailsVirtualDom: detailsDom
+    detailsVirtualDom: detailsDom,
+    tabs: newTabs
   };
 };
 
@@ -2465,7 +2495,8 @@ const selectTabFeatures = async state => {
     extension,
     baseUrl,
     selectedFeature,
-    features
+    features,
+    tabs
   } = state;
   if (features.length === 0) {
     return state;
@@ -2473,10 +2504,17 @@ const selectTabFeatures = async state => {
   const actualSelectedFeature = selectedFeature || Theme;
   const fn = getFeatureDetailsHandler(actualSelectedFeature);
   const partialNewState = await fn(extension, baseUrl);
+  const newTabs = tabs.map(tab => {
+    return {
+      ...tab,
+      selected: tab.name === Features
+    };
+  });
   return {
     ...state,
     selectedTab: Features,
     selectedFeature: features[0].id || '',
+    tabs: newTabs,
     ...partialNewState
   };
 };
@@ -2503,6 +2541,27 @@ const handleTabsClick = (state, name) => {
   return selectTab(state, name);
 };
 
+const sendMessagePortToFileSystemWorker = async port => {
+  await sendMessagePortToFileSystemWorker$1(port, 0);
+};
+
+const createFileSystemWorkerRpc = async () => {
+  try {
+    const rpc = await TransferMessagePortRpcParent.create({
+      commandMap: {},
+      send: sendMessagePortToFileSystemWorker
+    });
+    return rpc;
+  } catch (error) {
+    throw new VError(error, `Failed to create file system worker rpc`);
+  }
+};
+
+const initializeFileSystemWorker = async () => {
+  const rpc = await createFileSystemWorkerRpc();
+  set(rpc);
+};
+
 const sendMessagePortToMarkdownWorker = async port => {
   await sendMessagePortToMarkdownWorker$1(port, 0);
 };
@@ -2521,12 +2580,16 @@ const createMarkdownWorkerRpc = async () => {
 
 const initializeMarkdownWorker = async () => {
   const rpc = await createMarkdownWorkerRpc();
-  set$3(rpc);
+  set$4(rpc);
 };
 
 const initialize = async () => {
-  await initializeMarkdownWorker();
-  // TODO create connection to file system worker
+  await Promise.all([initializeMarkdownWorker(), initializeFileSystemWorker()]);
+};
+
+const existsFile = async uri => {
+  // TODO ask file system worker
+  return true;
 };
 
 const Web = 1;
@@ -2584,6 +2647,150 @@ const getBaseUrl = (extensionPath, platform) => {
   }
 };
 
+const getExtensionDetailButtons = (hasColorTheme, isBuiltin) => {
+  const allActions = [{
+    label: setColorTheme$3(),
+    onClick: HandleClickSetColorTheme,
+    enabled: hasColorTheme,
+    name: SetColorTheme
+  }, {
+    label: disable(),
+    onClick: HandleClickDisable,
+    enabled: true,
+    name: Disable
+  }, {
+    label: uninstall(),
+    onClick: HandleClickUninstall,
+    enabled: !isBuiltin,
+    name: Uninstall
+  }];
+  return allActions;
+};
+
+const getExtensionIdFromUri = uri => {
+  const id = uri.slice('extension-detail://'.length);
+  return id;
+};
+
+const getTabs = (selectedTab, hasReadme, hasFeatures, hasChangelog) => {
+  const tabs = [{
+    label: details(),
+    name: Details,
+    selected: selectedTab === Details,
+    enabled: hasReadme
+  }, {
+    label: features$1(),
+    name: Features,
+    selected: selectedTab === Features,
+    enabled: hasFeatures
+  }, {
+    label: changelog(),
+    name: Changelog,
+    selected: selectedTab === Changelog,
+    enabled: hasChangelog
+  }];
+  return tabs;
+};
+
+const Small = 1;
+const Normal = 2;
+const Large = 3;
+
+const getViewletSize = width => {
+  if (width < 180) {
+    return Small;
+  }
+  if (width < 768) {
+    return Normal;
+  }
+  return Large;
+};
+
+const isLanguageBasicsExtension = extension => {
+  return extension.name && extension.name.startsWith('Language Basics');
+};
+
+const isThemeExtension = extension => {
+  return extension.name && extension.name.endsWith(' Theme');
+};
+
+const getIcon = (extension, platform, assetDir) => {
+  if (!extension) {
+    return extensionDefaultIcon(assetDir);
+  }
+  if (!extension.path || !extension.icon) {
+    if (isLanguageBasicsExtension(extension)) {
+      return extensionLanguageBasics(assetDir);
+    }
+    if (isThemeExtension(extension)) {
+      return extensionTheme(assetDir);
+    }
+    return extensionDefaultIcon(assetDir);
+  }
+  if (platform === Remote || platform === Electron) {
+    if (extension.builtin) {
+      return `${assetDir}/extensions/${extension.id}/${extension.icon}`;
+    }
+    return `/remote/${extension.path}/${extension.icon}`; // TODO support windows paths
+  }
+  return '';
+};
+
+const getDescription = extension => {
+  if (!extension || !extension.description) {
+    return 'n/a';
+  }
+  return extension.description;
+};
+
+const getName = extension => {
+  if (extension && extension.name) {
+    return extension.name;
+  }
+  if (extension && extension.id) {
+    return extension.id;
+  }
+  return 'n/a';
+};
+
+const getBadge = (builtin, badgeEnabled) => {
+  if (builtin && badgeEnabled) {
+    return 'builtin';
+  }
+  return '';
+};
+
+const hasColorThemes = extension => {
+  return Boolean(extension && extension.colorThemes && extension.colorThemes.length > 0);
+};
+
+const loadHeaderContent = (state, platform, extension) => {
+  const {
+    assetDir,
+    builtinExtensionsBadgeEnabled
+  } = state;
+  const iconSrc = getIcon(extension, platform, assetDir);
+  const description = getDescription(extension);
+  const name = getName(extension);
+  const extensionUri = extension.uri || extension.path;
+  const extensionId = extension?.id || 'n/a';
+  const extensionVersion = extension?.version || 'n/a';
+  const hasColorTheme = hasColorThemes(extension);
+  const isBuiltin = extension?.builtin;
+  const badge = getBadge(isBuiltin, builtinExtensionsBadgeEnabled);
+  return {
+    badge,
+    description,
+    extension,
+    extensionId,
+    extensionUri,
+    extensionVersion,
+    hasColorTheme,
+    iconSrc,
+    name
+  };
+};
+
 const getCategories = () => {
   // TODO
   return [{
@@ -2685,37 +2892,22 @@ const getDisplaySize = size => {
   });
 };
 
-const getExtensionDetailButtons = (hasColorTheme, isBuiltin) => {
-  const allActions = [{
-    label: setColorTheme$3(),
-    onClick: HandleClickSetColorTheme,
-    enabled: hasColorTheme,
-    name: SetColorTheme
-  }, {
-    label: disable(),
-    onClick: HandleClickDisable,
-    enabled: true,
-    name: Disable
-  }, {
-    label: uninstall(),
-    onClick: HandleClickUninstall,
-    enabled: !isBuiltin,
-    name: Uninstall
-  }];
-  return allActions;
-};
-
-const getExtensionIdFromUri = uri => {
-  const id = uri.slice('extension-detail://'.length);
-  return id;
+const supportsFileSize = uri => {
+  if (uri.startsWith('http:') || uri.startsWith('https://')) {
+    return false;
+  }
+  return true;
 };
-
 const getFolderSize = async uri => {
   if (!uri) {
     throw new VError(`uri is required`);
   }
+  if (!supportsFileSize(uri)) {
+    return 0;
+  }
   try {
-    return await getFolderSize$1(uri);
+    // @ts-ignore
+    return await invoke('FileSystem.getFolderSize', uri);
   } catch {
     return 0;
   }
@@ -2778,122 +2970,20 @@ const getResources = isBuiltin => {
   }];
 };
 
-const getTabs = (selectedTab, hasReadme, hasFeatures, hasChangelog) => {
-  const tabs = [{
-    label: details(),
-    name: Details,
-    selected: selectedTab === Details,
-    enabled: hasReadme
-  }, {
-    label: features$1(),
-    name: Features,
-    selected: selectedTab === Features,
-    enabled: hasFeatures
-  }, {
-    label: changelog(),
-    name: Changelog,
-    selected: selectedTab === Changelog,
-    enabled: hasChangelog
-  }];
-  return tabs;
-};
-
-const Small = 1;
-const Normal = 2;
-const Large = 3;
-
-const getViewletSize = width => {
-  if (width < 180) {
-    return Small;
-  }
-  if (width < 768) {
-    return Normal;
-  }
-  return Large;
-};
-
-const isLanguageBasicsExtension = extension => {
-  return extension.name && extension.name.startsWith('Language Basics');
-};
-
-const isThemeExtension = extension => {
-  return extension.name && extension.name.endsWith(' Theme');
-};
-
-const getIcon = (extension, platform, assetDir) => {
-  if (!extension) {
-    return extensionDefaultIcon(assetDir);
-  }
-  if (!extension.path || !extension.icon) {
-    if (isLanguageBasicsExtension(extension)) {
-      return extensionLanguageBasics(assetDir);
-    }
-    if (isThemeExtension(extension)) {
-      return extensionTheme(assetDir);
-    }
-    return extensionDefaultIcon(assetDir);
-  }
-  if (platform === Remote || platform === Electron) {
-    if (extension.builtin) {
-      return `${assetDir}/extensions/${extension.id}/${extension.icon}`;
-    }
-    return `/remote/${extension.path}/${extension.icon}`; // TODO support windows paths
-  }
-  return '';
-};
-
-const getDescription = extension => {
-  if (!extension || !extension.description) {
-    return 'n/a';
-  }
-  return extension.description;
-};
-
-const getName = extension => {
-  if (extension && extension.name) {
-    return extension.name;
-  }
-  if (extension && extension.id) {
-    return extension.id;
-  }
-  return 'n/a';
-};
-
-const getBadge = (builtin, badgeEnabled) => {
-  if (builtin && badgeEnabled) {
-    return 'builtin';
-  }
-  return '';
-};
-
-const hasColorThemes = extension => {
-  return Boolean(extension && extension.colorThemes && extension.colorThemes.length > 0);
-};
-
-const loadHeaderContent = (state, platform, extension) => {
-  const {
-    assetDir,
-    builtinExtensionsBadgeEnabled
-  } = state;
-  const iconSrc = getIcon(extension, platform, assetDir);
-  const description = getDescription(extension);
-  const name = getName(extension);
-  const extensionUri = extension.uri || extension.path;
-  const extensionId = extension?.id || 'n/a';
-  const extensionVersion = extension?.version || 'n/a';
-  const hasColorTheme = hasColorThemes(extension);
-  const isBuiltin = extension?.builtin;
-  const badge = getBadge(isBuiltin, builtinExtensionsBadgeEnabled);
+const loadSideBarContent = async (extensionId, extensionVersion, extensionUri, isBuiltin) => {
+  const folderSize = await getFolderSize(extensionUri);
+  const displaySize = getDisplaySize(folderSize);
+  const installationEntries = getInstallationEntries(displaySize, extensionId, extensionVersion, extensionUri);
+  const marketplaceEntries = getMarketplaceEntries(isBuiltin);
+  const categories = getCategories();
+  const resources = getResources(isBuiltin);
   return {
-    badge,
-    description,
-    extension,
-    extensionId,
-    extensionUri,
-    extensionVersion,
-    hasColorTheme,
-    iconSrc,
-    name
+    installationEntries,
+    marketplaceEntries,
+    displaySize,
+    categories,
+    resources,
+    folderSize
   };
 };
 
@@ -2959,7 +3049,11 @@ const loadContent = async (state, platform, savedState) => {
     iconSrc,
     name
   } = headerData;
-  const readmeContent = await loadReadmeContent(extension.path);
+  const readmeUrl = join(extension.path, 'README.md');
+  join(extension.path, 'CHANGELOG.md');
+  const hasReadme = await existsFile();
+  const hasChangelog = await existsFile();
+  const readmeContent = await loadReadmeContent(readmeUrl);
   const baseUrl = getBaseUrl(extension.path, platform);
   const readmeHtml = await renderMarkdown(readmeContent, {
     baseUrl
@@ -2979,17 +3073,17 @@ const loadContent = async (state, platform, savedState) => {
   } = restoreState(savedState);
   const features = getFeatures(selectedFeature || Theme, extension);
   const hasFeatures = features.length > 0;
-  const hasReadme = true; // TODO
-  const hasChangelog = true; // TODO
   const tabs = getTabs(selectedTab, hasReadme, hasFeatures, hasChangelog);
   const enabledTabs = tabs.filter(tab => tab.enabled);
-  const folderSize = await getFolderSize(extensionUri);
-  const displaySize = getDisplaySize(folderSize);
-  const installationEntries = getInstallationEntries(displaySize, extensionId, extensionVersion, extensionUri);
-  const marketplaceEntries = getMarketplaceEntries(isBuiltin);
-  const categories = getCategories();
-  const resources = getResources(isBuiltin);
   const sizeValue = getViewletSize(width || 0);
+  const {
+    installationEntries,
+    marketplaceEntries,
+    displaySize,
+    categories,
+    resources,
+    folderSize
+  } = await loadSideBarContent(extensionId, extensionVersion, extensionUri, isBuiltin);
   return {
     ...state,
     badge,
@@ -3010,10 +3104,11 @@ const loadContent = async (state, platform, savedState) => {
     iconSrc,
     name,
     readmeScrollTop,
+    readmeUrl,
     resources,
+    scrollSource: Script,
     scrollToTopButtonEnabled: true,
     secondEntries: marketplaceEntries,
-    scrollSource: Script,
     selectedTab,
     sizeOnDisk: size,
     sizeValue,
@@ -3481,7 +3576,7 @@ const render2 = (uid, diffResult) => {
     oldState,
     newState
   } = get(uid);
-  set$1(uid, newState, newState);
+  set$2(uid, newState, newState);
   const commands = applyRender(oldState, newState, diffResult);
   return commands;
 };
@@ -3498,7 +3593,8 @@ const renderEventListeners = () => {
     params: ['handleReadmeContextMenu', 'event.clientX', 'event.clientY', 'event.target.href', 'event.target.src']
   }, {
     name: HandleReadmeScroll,
-    params: ['handleScroll', 'event.target.scrollTop'],
+    // @ts-ignore
+    params: ['handleScroll', 'event.target.scrollTop', User],
     passive: true
   }, {
     name: HandleTabsClick,
@@ -3587,7 +3683,7 @@ const listen = async () => {
   const rpc = await WebWorkerRpcClient.create({
     commandMap: commandMap
   });
-  set(rpc);
+  set$1(rpc);
 };
 
 const main = async () => {

package/package.json

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