@lvce-editor/source-control-worker 1.3.0 → 1.5.0

package/dist/sourceControlWorkerMain.js

@@ -1051,7 +1051,6 @@ const create2 = (id, uri, x, y, width, height, workspacePath) => {
     untracked: [],
     workingTree: [],
     inputValue: '',
-    displayItems: [],
     buttonIndex: -1,
     enabledProviderIds: [],
     isExpanded: true,
@@ -1062,7 +1061,10 @@ const create2 = (id, uri, x, y, width, height, workspacePath) => {
     gitRoot: '',
     itemHeight: 20,
     minimumSliderSize: 20,
-    workspacePath
+    workspacePath,
+    headerHeight: 40,
+    // TODO
+    actionsCache: Object.create(null)
   };
   set$1(id, state, state);
 };
@@ -1071,7 +1073,7 @@ const RenderItems = 4;
 
 const diffType = RenderItems;
 const isEqual = (oldState, newState) => {
-  return oldState.allGroups === newState.allGroups && oldState.displayItems === newState.displayItems && oldState.items === newState.items && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY && oldState.deltaY === newState.deltaY && oldState.buttonIndex === newState.buttonIndex && oldState.buttons === newState.buttons;
+  return oldState.allGroups === newState.allGroups && oldState.items === newState.items && oldState.items === newState.items && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY && oldState.deltaY === newState.deltaY && oldState.buttonIndex === newState.buttonIndex && oldState.buttons === newState.buttons;
 };
 
 const modules = [isEqual];
@@ -1097,7 +1099,7 @@ const diff2 = uid => {
   return result;
 };
 
-const commandIds = ['acceptInput', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusNone', 'focusPrevious', 'handleClick', 'handleClickAt', 'handleIconThemeChange', 'handleWheel'];
+const commandIds = ['acceptInput', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusNone', 'focusPrevious', 'handleClick', 'handleClickAt', 'handleFocus', 'handleIconThemeChange', 'handleMouseOut', 'handleMouseOutAt', 'handleMouseOver', 'handleMouseOverAt', 'handleWheel', 'selectIndex'];
 
 const getCommandIds = () => {
   return commandIds;
@@ -1147,6 +1149,7 @@ const executeProvider = async ({
 
 const CommandExecute = 'ExtensionHostCommand.executeCommand';
 const SourceControlGetEnabledProviderIds = 'ExtensionHostSourceControl.getEnabledProviderIds';
+const SourceControlGetFileBefore = 'ExtensionHostSourceControl.GetFileBefore';
 const SourceControlGetGroups = 'ExtensionHostSourceControl.getGroups';
 
 const executeCommand = (id, ...args) => {
@@ -1183,8 +1186,8 @@ const getDisplayItemsGroup = (group, isExpanded) => {
     throw new Error('Source control group is missing an items property');
   }
   const length = items.length;
-  const type = DirectoryExpanded ;
-  const icon = 'ChevronDown' ;
+  const type = isExpanded ? DirectoryExpanded : Directory;
+  const icon = isExpanded ? 'ChevronDown' : 'ChevronRight';
   if (length > 0) {
     displayItems.push({
       file: '',
@@ -1201,7 +1204,7 @@ const getDisplayItemsGroup = (group, isExpanded) => {
       groupId: id
     });
   }
-  {
+  if (isExpanded) {
     for (let i = 0; i < length; i++) {
       const item = items[i];
       const {
@@ -1236,7 +1239,7 @@ const getDisplayItemsGroup = (group, isExpanded) => {
 const getDisplayItems = (allGroups, isExpanded) => {
   const displayItems = [];
   for (const group of allGroups) {
-    const groupDisplayItems = getDisplayItemsGroup(group);
+    const groupDisplayItems = getDisplayItemsGroup(group, isExpanded);
     displayItems.push(...groupDisplayItems);
   }
   return displayItems;
@@ -1318,6 +1321,14 @@ const getFinalDeltaY = (height, itemHeight, itemsLength) => {
   return finalDeltaY;
 };
 
+const getFileBefore$1 = (providerId, path) => {
+  return executeProvider({
+    event: 'none',
+    method: SourceControlGetFileBefore,
+    params: [providerId, path]
+    // noProviderFoundMessage: 'No source control provider found',
+  });
+};
 const getGroups$2 = (providerId, path) => {
   return executeProvider({
     event: 'none',
@@ -1335,6 +1346,9 @@ const getEnabledProviderIds$1 = (scheme, root) => {
   });
 };
 
+const getFileBefore = (providerId, file) => {
+  return getFileBefore$1(providerId, file);
+};
 const getEnabledProviderIds = (scheme, root) => {
   string(scheme);
   string(root);
@@ -1368,40 +1382,21 @@ const getListHeight = (itemsLength, itemHeight, maxHeight) => {
   return Math.min(totalHeight, maxHeight);
 };
 
-// TODO optimize this function to return the minimum number
-// of visible items needed, e.g. when not scrolled 5 items with
-// 20px fill 100px but when scrolled 6 items are needed
-const getNumberOfVisibleItems = (listHeight, itemHeight) => {
-  return Math.ceil(listHeight / itemHeight) + 1;
-};
-
-const Disk = 'file';
-
-const RE_PROTOCOL = /^([a-z-]+):\/\//;
-const getProtocol = uri => {
-  if (!uri) {
-    return Disk;
-  }
-  const protocolMatch = uri.match(RE_PROTOCOL);
-  if (protocolMatch) {
-    return protocolMatch[1];
-  }
-  return Disk;
-};
-
-const get = key => {
-  return false;
+const getExtensions = async () => {
+  return invoke('Extensions.getExtensions');
 };
 
-const getScrollBarSize = (size, contentSize, minimumSliderSize) => {
-  if (size >= contentSize) {
-    return 0;
+const requestSourceActions = async () => {
+  const extensions = await getExtensions();
+  const newCache = Object.create(null);
+  for (const extension of extensions) {
+    if (extension && extension['source-control-actions']) {
+      for (const [key, value] of Object.entries(extension['source-control-actions'])) {
+        newCache.cache[key] = value;
+      }
+    }
   }
-  return Math.max(Math.round(size ** 2 / contentSize), minimumSliderSize);
-};
-
-const getExtensions = async () => {
-  return invoke('Extensions.getExtensions');
+  return newCache;
 };
 
 const state = {
@@ -1417,14 +1412,8 @@ const ensureActions = async () => {
   if (Object.keys(state.cache).length > 0) {
     return;
   }
-  const extensions = await getExtensions();
-  for (const extension of extensions) {
-    if (extension && extension['source-control-actions']) {
-      for (const [key, value] of Object.entries(extension['source-control-actions'])) {
-        state.cache[key] = value;
-      }
-    }
-  }
+  const newCache = await requestSourceActions();
+  state.cache = newCache;
 };
 const getSourceControlActions = async (providerId, groupId, type) => {
   string(groupId);
@@ -1434,7 +1423,7 @@ const getSourceControlActions = async (providerId, groupId, type) => {
   return value;
 };
 
-const getNewButtons = async (displayItems, providerId, buttonIndex) => {
+const getNewButtons = async (displayItems, providerId, buttonIndex, actionsCache) => {
   if (buttonIndex === -1) {
     return [];
   }
@@ -1445,14 +1434,48 @@ const getNewButtons = async (displayItems, providerId, buttonIndex) => {
   const actions = await getSourceControlActions(providerId, item.groupId, item.type);
   return actions;
 };
+
+// TODO optimize this function to return the minimum number
+// of visible items needed, e.g. when not scrolled 5 items with
+// 20px fill 100px but when scrolled 6 items are needed
+const getNumberOfVisibleItems = (listHeight, itemHeight) => {
+  return Math.ceil(listHeight / itemHeight) + 1;
+};
+
+const Disk = 'file';
+
+const RE_PROTOCOL = /^([a-z-]+):\/\//;
+const getProtocol = uri => {
+  if (!uri) {
+    return Disk;
+  }
+  const protocolMatch = uri.match(RE_PROTOCOL);
+  if (protocolMatch) {
+    return protocolMatch[1];
+  }
+  return Disk;
+};
+
+const get = key => {
+  return false;
+};
+
+const getScrollBarSize = (size, contentSize, minimumSliderSize) => {
+  if (size >= contentSize) {
+    return 0;
+  }
+  return Math.max(Math.round(size ** 2 / contentSize), minimumSliderSize);
+};
+
 const loadContent = async state => {
   const {
     itemHeight,
     height,
     minimumSliderSize,
     workspacePath,
-    fileIconCache
-  } = state;
+    fileIconCache,
+    providerId,
+    buttonIndex} = state;
   const root = workspacePath;
   const scheme = getProtocol(root);
   const enabledProviderIds = await getEnabledProviderIds(scheme, root);
@@ -1461,8 +1484,8 @@ const loadContent = async state => {
     gitRoot
   } = await getGroups(enabledProviderIds);
   const isExpanded = true;
-  const items = getDisplayItems(allGroups);
-  const buttons = await getNewButtons(items, state.providerId, state.buttonIndex);
+  const items = getDisplayItems(allGroups, isExpanded);
+  const buttons = await getNewButtons(items, providerId, buttonIndex);
   const splitButtonEnabled = get();
   const total = items.length;
   const contentHeight = total * itemHeight;
@@ -1509,6 +1532,98 @@ const handleButtonClick = async (state, clickedIndex) => {
   return newState;
 };
 
+const getIndex = (state, eventX, eventY) => {
+  const {
+    headerHeight,
+    y,
+    itemHeight
+  } = state;
+  const relativeY = eventY - y - headerHeight;
+  const index = Math.floor(relativeY / itemHeight);
+  return index;
+};
+
+const handleClickDirectory = async (state, item) => {
+  const {
+    allGroups
+  } = state;
+  const isExpanded = true;
+  const displayItems = getDisplayItems(allGroups, isExpanded);
+  const newMaxLineY = displayItems.length;
+  return {
+    ...state,
+    items: displayItems,
+    isExpanded,
+    maxLineY: newMaxLineY
+  };
+};
+
+const handleClickDirectoryExpanded = async (state, item) => {
+  const {
+    allGroups,
+    maxLineY
+  } = state;
+  const isExpanded = false;
+  const displayItems = getDisplayItems(allGroups, isExpanded);
+  const newMaxLineY = Math.min(displayItems.length, maxLineY);
+  return {
+    ...state,
+    items: displayItems,
+    isExpanded,
+    maxLineY: newMaxLineY
+  };
+};
+
+const readFile = async (uri, encoding = 'utf8') => {
+  const content = await invoke$1('FileSystem.readFile', uri);
+  return content;
+};
+
+const openUri = uri => {
+  return invoke$1('Main.openUri', uri);
+};
+
+const handleClickFile = async (state, item) => {
+  const {
+    enabledProviderIds,
+    root
+  } = state;
+  const providerId = enabledProviderIds[0];
+  const absolutePath = `${root}/${item.file}`;
+  // TODO handle error
+  const [fileBefore] = await Promise.all([getFileBefore(providerId, item.file), readFile(absolutePath)]);
+  {
+    await openUri(`inline-diff://data://${fileBefore}<->${absolutePath}`);
+  }
+  return state;
+};
+
+const selectIndex = async (state, index) => {
+  const {
+    items
+  } = state;
+  if (index < 0 || index >= items.length) {
+    return state;
+  }
+  const item = items[index];
+  switch (item.type) {
+    case Directory:
+      return handleClickDirectory(state);
+    case DirectoryExpanded:
+      return handleClickDirectoryExpanded(state);
+    case File:
+      return handleClickFile(state, item);
+    default:
+      console.warn(`unknown item type: ${item.type}`);
+      return state;
+  }
+};
+
+const handleClickAt = async (state, eventX, eventY) => {
+  const index = getIndex(state, eventX, eventY);
+  return selectIndex(state, index);
+};
+
 const show = async (x, y, id, ...args) => {
   return invoke$1('ContextMenu.show', x, y, id, ...args);
 };
@@ -1520,6 +1635,55 @@ const handleContextMenu = async (state, button, x, y) => {
   return state;
 };
 
+const handleFocus = async state => {
+  return state;
+};
+
+const handleMouseOut = (state, index) => {
+  const {
+    items
+  } = state;
+  if (index === -1 || index > items.length) {
+    return {
+      ...state,
+      buttonIndex: -1,
+      buttons: []
+    };
+  }
+  return state;
+};
+
+const handleMouseOutAt = (state, eventX, eventY) => {
+  const index = getIndex(state, eventX, eventY);
+  return handleMouseOut(state, index);
+};
+
+const handleMouseOver = async (state, index) => {
+  const {
+    items,
+    providerId,
+    buttonIndex
+  } = state;
+  if (index === buttonIndex) {
+    return state;
+  }
+  const item = items[index];
+  if (!item) {
+    return state;
+  }
+  const actions = await getSourceControlActions(providerId, item.groupId, item.type);
+  return {
+    ...state,
+    buttonIndex: index,
+    buttons: actions
+  };
+};
+
+const handleMouseOverAt = async (state, eventX, eventY) => {
+  const index = getIndex(state, eventX, eventY);
+  return handleMouseOver(state, index);
+};
+
 const getPortTuple = () => {
   const {
     port1,
@@ -1562,6 +1726,7 @@ const initialize = async () => {
 };
 
 const Actions = 'Actions';
+const Grow = 'Grow';
 const Chevron = 'Chevron';
 const ChevronRight = 'ChevronRight';
 const DecorationIcon = 'DecorationIcon';
@@ -1588,20 +1753,16 @@ const StrikeThrough = 'StrikeThrough';
 const TreeItem$1 = 'TreeItem';
 const Viewlet = 'Viewlet';
 
-const HandleClick = 'handleClick';
 const HandleClickAt = 'handleClickAt';
 const HandleContextMenu = 'handleContextMenu';
 const HandleFocus = 'handleFocus';
 const HandleInput = 'handleInput';
 const HandleMouseOut = 'handleMouseOut';
+const HandleMouseOutAt = 'handleMouseOutAt';
 const HandleMouseOver = 'handleMouseOver';
+const HandleMouseOverAt = 'handleMouseOverAt';
 const HandleWheel = 'handleWheel';
 
-const None = 'none';
-const ToolBar = 'toolbar';
-const Tree = 'tree';
-const TreeItem = 'treeitem';
-
 const SourceControlInput$1 = 'SourceControlInput';
 
 const emptyObject = {};
@@ -1652,36 +1813,10 @@ const getSourceControlHeaderVirtualDom = () => {
   }];
 };
 
-const emptySourceControlButtons = [];
-
-const getIconVirtualDom = (icon, type = Div) => {
-  return {
-    type,
-    className: `MaskIcon MaskIcon${icon}`,
-    role: None,
-    childCount: 0
-  };
-};
-
-const addButtons = (dom, buttons) => {
-  if (buttons === emptySourceControlButtons) {
-    return;
-  }
-  dom[0].childCount += buttons.length;
-  for (const button of buttons) {
-    const {
-      icon,
-      label
-    } = button;
-    dom.push({
-      type: Button$1,
-      className: SourceControlButton,
-      title: label,
-      ariaLabel: label,
-      childCount: 1
-    }, getIconVirtualDom(icon, Span));
-  }
-};
+const None = 'none';
+const ToolBar = 'toolbar';
+const Tree = 'tree';
+const TreeItem = 'treeitem';
 
 const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
@@ -1703,10 +1838,46 @@ const getBadgeVirtualDom = (className, count) => {
   }, text(`${count}`)];
 };
 
+const emptySourceControlButtons = [];
+
+const getIconVirtualDom = (icon, type = Div) => {
+  return {
+    type,
+    className: `MaskIcon MaskIcon${icon}`,
+    role: None,
+    childCount: 0
+  };
+};
+
+const getButtonVirtualDom = button => {
+  const {
+    icon,
+    label
+  } = button;
+  return [{
+    type: Button$1,
+    className: SourceControlButton,
+    title: label,
+    ariaLabel: label,
+    childCount: 1
+  }, getIconVirtualDom(icon, Span)];
+};
+
+const getButtonsVirtualDom = buttons => {
+  if (buttons === emptySourceControlButtons) {
+    return [];
+  }
+  return [{
+    type: Div,
+    className: 'SourceControlButtons',
+    childCount: buttons.length
+  }, ...buttons.flatMap(getButtonVirtualDom)];
+};
+
 const getLabelClassName = decorationStrikeThrough => {
-  let className = Label + ' Grow';
+  let className = mergeClassNames(Label, Grow);
   if (decorationStrikeThrough) {
-    className += ` ${StrikeThrough}`;
+    className = mergeClassNames(className, StrikeThrough);
   }
   return className;
 };
@@ -1726,28 +1897,27 @@ const createItemDirectory = item => {
     buttons
   } = item;
   const labelClassName = getLabelClassName(decorationStrikeThrough);
-  const dom = [{
+  const buttonsDom = getButtonsVirtualDom(buttons);
+  const hasButtons = buttons.length;
+  return [{
     type: Div,
     className: TreeItem$1,
     role: TreeItem,
     ariaExpanded: type === DirectoryExpanded,
     ariaPosInSet: posInSet,
     ariaSetSize: setSize,
-    childCount: 3,
+    childCount: 3 + (hasButtons ? 1 : 0),
     paddingLeft: PaddingLeft,
     paddingRight: PaddingRight
   }, {
     type: Div,
-    className: `${Chevron} MaskIcon${icon}`,
+    className: mergeClassNames(Chevron, `MaskIcon${icon}`),
     childCount: 0
   }, {
     type: Div,
     className: labelClassName,
     childCount: 1
-  }, text(label)];
-  addButtons(dom, buttons);
-  dom.push(...getBadgeVirtualDom(SourceControlBadge, badgeCount));
-  return dom;
+  }, text(label), ...buttonsDom, ...getBadgeVirtualDom(SourceControlBadge, badgeCount)];
 };
 
 const getFileIconVirtualDom = icon => {
@@ -1787,6 +1957,8 @@ const createItemOther = item => {
   } = item;
   const labelClassName = getLabelClassName(decorationStrikeThrough);
   const dom = [];
+  const hasButtons = buttons.length;
+  const buttonsDom = getButtonsVirtualDom(buttons);
   dom.push({
     type: Div,
     className: TreeItem$1,
@@ -1794,7 +1966,7 @@ const createItemOther = item => {
     ariaPosInSet: posInSet,
     ariaSetSize: setSize,
     title: file,
-    childCount: 3,
+    childCount: 3 + (hasButtons ? 1 : 0),
     paddingLeft: '1rem',
     paddingRight: '12px'
   }, ...getIconsDom(icon, fileIcon));
@@ -1812,7 +1984,7 @@ const createItemOther = item => {
       childCount: 1
     }, text(detail));
   }
-  addButtons(dom, buttons);
+  dom.push(...buttonsDom);
   dom.push({
     type: Img,
     className: DecorationIcon,
@@ -1833,9 +2005,23 @@ const getSourceControlItemVirtualDom = item => {
   }
 };
 
-const getSourceControlItemsVirtualDom$1 = (hasItems, buttonText) => {
-  const dom = [];
-  dom.push({
+const getSourceControlListVirtualDom = items => {
+  return [{
+    type: Div,
+    className: SourceControlItems,
+    role: Tree,
+    childCount: items.length,
+    onClick: HandleClickAt,
+    onPointerOver: HandleMouseOverAt,
+    onPointerOut: HandleMouseOutAt
+  }, ...items.flatMap(getSourceControlItemVirtualDom)];
+};
+
+const getSplitButtonVirtualDom = (hasItems, splitButtonEnabled, buttonText) => {
+  if (!splitButtonEnabled || !hasItems) {
+    return [];
+  }
+  return [{
     type: Div,
     className: `${SplitButton} ${hasItems ? '' : SplitButtonDisabled}`,
     childCount: 3
@@ -1857,38 +2043,21 @@ const getSourceControlItemsVirtualDom$1 = (hasItems, buttonText) => {
     type: Div,
     className: `${MaskIcon} ${MaskIconChevronDown}`,
     childCount: 0
-  });
-  return dom;
-};
-
-const getSourceControlItemsVirtualDom = (items, splitButtonEnabled) => {
-  const dom = [];
-  dom.push(...getSourceControlHeaderVirtualDom());
-  if (splitButtonEnabled) {
-    const hasItems = items.length > 0;
-    dom.push(...getSourceControlItemsVirtualDom$1(hasItems, 'Commit'));
-  }
-  dom.push({
-    type: Div,
-    className: SourceControlItems,
-    role: Tree,
-    childCount: items.length
-  }, ...items.flatMap(getSourceControlItemVirtualDom));
-  return dom;
+  }];
 };
 
 const getSourceControlVirtualDom = (items, splitButtonEnabled) => {
+  const hasItems = items.length > 0;
   const dom = [{
     type: Div,
     className: mergeClassNames(Viewlet, SourceControl),
     tabIndex: 0,
-    onClick: HandleClick,
     onContextMenu: HandleContextMenu,
     onMouseOver: HandleMouseOver,
     onMouseOut: HandleMouseOut,
     onWheel: HandleWheel,
     childCount: splitButtonEnabled ? 3 : 2
-  }, ...getSourceControlItemsVirtualDom(items, splitButtonEnabled)];
+  }, ...getSourceControlHeaderVirtualDom(), ...getSplitButtonVirtualDom(hasItems, splitButtonEnabled, 'Commit'), ...getSourceControlListVirtualDom(items)];
   return dom;
 };
 
@@ -1996,9 +2165,15 @@ const renderEventListeners = () => {
   }, {
     name: HandleClickAt,
     params: ['handleClickAt', 'event.clientX', 'event.clientY']
+  }, {
+    name: HandleMouseOverAt,
+    params: ['handleMouseOverAt', 'event.clientX', 'event.clientY']
   }, {
     name: HandleMouseOver,
     params: ['handleMouseOver', 'event.clientX', 'event.clientY']
+  }, {
+    name: HandleMouseOutAt,
+    params: ['handleMouseOutAt', 'event.clientX', 'event.clientY']
   }, {
     name: HandleInput,
     params: ['handleInput', 'event.target.value']
@@ -2021,13 +2196,15 @@ const saveState = uid => {
   } = value;
   const {
     root,
-    maxLineY
+    maxLineY,
+    isExpanded
   } = newState;
   return {
     root,
     minLineY: 0,
     maxLineY,
-    deltaY: 0
+    deltaY: 0,
+    isExpanded
   };
 };
 
@@ -2059,12 +2236,19 @@ const commandMap = {
   'SourceControl.diff2': diff2,
   'SourceControl.getCommandIds': getCommandIds,
   'SourceControl.handleButtonClick': wrapCommand(handleButtonClick),
+  'SourceControl.handleClickAt': wrapCommand(handleClickAt),
   'SourceControl.handleContextMenu': wrapCommand(handleContextMenu),
+  'SourceControl.handleFocus': wrapCommand(handleFocus),
+  'SourceControl.handleMouseOut': wrapCommand(handleMouseOut),
+  'SourceControl.handleMouseOutAt': wrapCommand(handleMouseOutAt),
+  'SourceControl.handleMouseOver': wrapCommand(handleMouseOver),
+  'SourceControl.handleMouseOverAt': wrapCommand(handleMouseOverAt),
   'SourceControl.loadContent': wrapCommand(loadContent),
   'SourceControl.render2': render2,
   'SourceControl.renderActions2': renderActions,
   'SourceControl.renderEventListeners': renderEventListeners,
   'SourceControl.saveState': saveState,
+  'SourceControl.selectIndex': wrapCommand(selectIndex),
   'SourceControl.terminate': terminate,
   'SourceControl.updateIcons': wrapCommand(updateIcons)
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/source-control-worker",
-  "version": "1.3.0",
+  "version": "1.5.0",
   "description": "Source Control Worker",
   "keywords": [
     "Lvce Editor"