@jupyterlab/git
Version:
A JupyterLab extension for version control using git
60 lines (59 loc) • 2.48 kB
JavaScript
import ListItem from '@mui/material/ListItem';
import * as React from 'react';
import { FixedSizeList } from 'react-window';
import { listItemClass, listItemIconClass, nameClass, wrapperClass } from '../style/BranchMenu';
import { submoduleHeaderStyle } from '../style/SubmoduleMenuStyle';
import { desktopIcon } from '../style/icons';
const ITEM_HEIGHT = 24.8; // HTML element height for a single item
const MIN_HEIGHT = 150; // Minimal HTML element height for the list
const MAX_HEIGHT = 400; // Maximal HTML element height for the list
/**
* React component for rendering a submodule menu.
*/
export class SubmoduleMenu extends React.Component {
/**
* Returns a React component for rendering a submodule menu.
*
* @param props - component properties
* @returns React component
*/
constructor(props) {
super(props);
/**
* Renders a menu item.
*
* @param props Row properties
* @returns React element
*/
this._renderItem = (props) => {
const { data, index, style } = props;
const submodule = data[index];
return (React.createElement(ListItem, { title: this.props.trans.__('Submodule: %1', submodule.name), className: listItemClass, role: "listitem", style: style },
React.createElement(desktopIcon.react, { className: listItemIconClass, tag: "span" }),
React.createElement("span", { className: nameClass }, submodule.name)));
};
}
/**
* Renders the component.
*
* @returns React element
*/
render() {
return React.createElement("div", { className: wrapperClass }, this._renderSubmoduleList());
}
/**
* Renders list of submodules.
*
* @returns React element
*/
_renderSubmoduleList() {
const submodules = this.props.submodules;
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: submoduleHeaderStyle }, "Submodules"),
React.createElement(FixedSizeList, { height: Math.min(Math.max(MIN_HEIGHT, submodules.length * ITEM_HEIGHT), MAX_HEIGHT), itemCount: submodules.length, itemData: submodules, itemKey: (index, data) => data[index].name, itemSize: ITEM_HEIGHT, style: {
overflowX: 'hidden',
paddingTop: 0,
paddingBottom: 0
}, width: 'auto' }, this._renderItem)));
}
}