fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-10-03 13:18:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

TS migration. #2288. (#2328)

Browse Source 
* Added TS. Updated build and linting config. Added types.

* [ts-migrate][.] Rename files from JS/JSX to TS/TSX

Co-authored-by: ts-migrate <>

* [ts-migrate][.] Run TS Migrate

Co-authored-by: ts-migrate <>

* Corrected files mangled by ts-migrate.

* Updated lint config, minor linting.

* Re-enabled Husky.

* Updated tests and config.

* Reverted webpack devtool config.

* Removed obsolete snapshots.

* Added annotations snap.

* Updated tsconfig includes wrt linting.

* Removed ts-migrate.

Co-authored-by: Timmy Huang <tihuan@users.noreply.github.com>
This commit is contained in:
Mim Hastie
2021-07-26 20:18:17 +00:00
committed by GitHub
co-authored by ts-migrate Timmy Huang
parent 7328cbdbd5
commit 934cc5c69b
206 changed files with 4719 additions and 2085 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/util/truncate.js
-97
View File
@@ -1,97 +0,0 @@
import React, { cloneElement } from "react";
import { Tooltip2 } from "@blueprintjs/popover2";
import { tooltipHoverOpenDelayQuick } from "../../globals";
const SPLIT_STYLE = {
display: "flex",
overflow: "hidden",
justifyContent: "flex-start",
width: "100%", // There are probably additional styles that we don't want to stack
padding: 0,
};
const FIRST_HALF_STYLE = {
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
flexShrink: 1,
minWidth: "5px",
};
const SECOND_HALF_STYLE = {
position: "relative",
overflow: "hidden",
whiteSpace: "nowrap",
};
const SECOND_HALF_SPACING_STYLE = {
color: "transparent",
};
const SECOND_HALF_INNER_STYLE = {
position: "absolute",
right: 0,
};
export default (props) => {
const { children, tooltipAddendum = "" } = props;
// Truncate only support a single child with a text child
if (
React.Children.count(children) !== 1 ||
React.Children.count(children.props?.children) !== 1
) {
throw Error("Only pass a single child with text to Truncate");
}
const originalString = String(children.props.children);
let firstString;
let secondString;
if (originalString.length === 1) {
firstString = originalString;
} else {
firstString = originalString.substr(0, originalString.length / 2);
secondString = originalString.substr(originalString.length / 2);
if (firstString.charAt(firstString.length - 1) === " ") {
firstString = `${firstString.substr(0, firstString.length - 1)}\u00a0`;
}
if (secondString.charAt(0) === " ") {
secondString = `\u00a0${secondString.substr(1)}`;
}
}
const inheritedColor = children.props.style?.color;
const splitStyle = { ...children.props.style, ...SPLIT_STYLE };
const secondHalfContentStyle = {
...SECOND_HALF_INNER_STYLE,
color: inheritedColor || "inherit",
};
const truncatedJSX = (
<span style={splitStyle}>
<span style={FIRST_HALF_STYLE}>{firstString}</span>
<span style={SECOND_HALF_STYLE}>
<span style={SECOND_HALF_SPACING_STYLE}>{secondString}</span>
<span style={secondHalfContentStyle}>{secondString}</span>
</span>
</span>
);
// clone children, changing the children(text) to the truncated string
const newChildren = React.Children.map(children, (child) =>
cloneElement(child, {
children: truncatedJSX,
"aria-label": originalString,
})
);
return (
<Tooltip2
content={`${originalString}${tooltipAddendum}`}
hoverOpenDelay={tooltipHoverOpenDelayQuick}
targetProps={{ style: children.props.style }}
>
{newChildren}
</Tooltip2>
);
};