mirror of
https://github.com/chanzuckerberg/cellxgene.git
synced 2026-09-25 16:38:11 +08:00
TS Revert (1) (#2402)
* revert all commits to before Typescript migration * update compat workflow to match latest deps (#2335) * update compat workflow to match latest deps * attempt to debug * attempt to debug * remove debugging code * typo * update deps to match desktop (#2340) * fix: don't run lint with `--fix` on push tests (#2273) * fix: don't run lint with `--fix` on push tests * npx Co-authored-by: maniarathi <mani.arathi@gmail.com> Co-authored-by: Madison Dunitz <madison.dunitz@chanzuckerberg.com> * rename X_approx_distribution to X_approximate_distribution (#2337) * Correctly handle non-finite numbers in heuristic determination of X distribution (#2342) * handle non-finites explicitly * improve and test edge case handling for distribution estimation * revert debugging changes * code readability * clean up type inferencing (#2332) * unit tests for 64 bit conversion * clean up type handling * type inference tests * more type inference fixes * use schema to determine user intent for data typing * stop using deprecated API * fbs type encoding test * add missing test * add more tests * correctly infer X type for CXG adaptor * lint * fix typo * ts migration * cleanup from PR review * lint * PR review changes * remove unused packages from client (#2359) * remove unused packages from client * add missing peer dep * fix: disable FE auth testing on compatibility tests (#2377) * update: release process (#2277) Co-authored-by: maniarathi <mani.arathi@gmail.com> * fix: remove spaces in param setup (#2380) * delete deploy workflow (#2396) * undo reformatting which now does not pass lint * fix snapshots which changed due to npm dep changes * add missing quoting to snapshot * another snapshot typo fix * TS Revert (2) - replay PR #2347 and #2354 (#2403) * replay edits from PR 2347 * TS Revert (3) - replay edits in PR #2327 (#2404) * replay edits in PR 2327 * TS Revert (4) - replay PR #2355 (#2405) * replay edits in PR 2355 * add additional babel config * reformat with new prettier config Co-authored-by: Severiano Badajoz <sbadajoz@chanzuckerberg.com> Co-authored-by: maniarathi <mani.arathi@gmail.com> Co-authored-by: Madison Dunitz <madison.dunitz@chanzuckerberg.com>
This commit is contained in:
co-authored by
maniarathi
Madison Dunitz
Severiano Badajoz
parent
295590a7c6
commit
eaae6df5e3
@@ -0,0 +1,72 @@
|
||||
import React from "react";
|
||||
|
||||
export default class MiniStackedBar extends React.PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.canvasRef = React.createRef();
|
||||
}
|
||||
|
||||
drawStacks = () => {
|
||||
const {
|
||||
domainValues,
|
||||
scale,
|
||||
domain,
|
||||
colorTable,
|
||||
occupancy,
|
||||
width,
|
||||
height,
|
||||
} = this.props;
|
||||
|
||||
if (!colorTable || !domainValues) return;
|
||||
|
||||
const { scale: colorScale } = colorTable;
|
||||
|
||||
const ctx = this.canvasRef?.current.getContext("2d");
|
||||
|
||||
ctx.clearRect(0, 0, width, height);
|
||||
let currentOffset = 0;
|
||||
|
||||
let occupancyValue;
|
||||
let scaledValue;
|
||||
let value;
|
||||
|
||||
for (let i = 0, { length } = domainValues; i < length; i += 1) {
|
||||
value = domainValues[i];
|
||||
occupancyValue = occupancy.get(value);
|
||||
scaledValue = scale(occupancyValue);
|
||||
ctx.fillStyle = occupancyValue
|
||||
? colorScale(domain.indexOf(value))
|
||||
: "rgb(255,255,255)";
|
||||
ctx.fillRect(currentOffset, 0, occupancyValue ? scaledValue : 0, height);
|
||||
currentOffset += occupancyValue ? scaledValue : 0;
|
||||
}
|
||||
};
|
||||
|
||||
componentDidUpdate = (prevProps) => {
|
||||
const { occupancy } = this.props;
|
||||
if (occupancy !== prevProps.occupancy) this.drawStacks();
|
||||
};
|
||||
|
||||
componentDidMount = () => {
|
||||
this.drawStacks();
|
||||
};
|
||||
|
||||
render() {
|
||||
const { width, height } = this.props;
|
||||
const { canvas } = this;
|
||||
if (canvas) canvas.getContext("2d").clearRect(0, 0, width, height);
|
||||
|
||||
return (
|
||||
<canvas
|
||||
style={{
|
||||
marginRight: 5,
|
||||
width,
|
||||
height,
|
||||
}}
|
||||
width={width}
|
||||
height={height}
|
||||
ref={this.canvasRef}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,90 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
export default class MiniStackedBar extends React.PureComponent {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any --- FIXME: disabled temporarily on migrate to TS.
|
||||
canvasRef: any;
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/no-explicit-any -- - FIXME: disabled temporarily on migrate to TS.
|
||||
constructor(props: any) {
|
||||
super(props);
|
||||
this.canvasRef = React.createRef();
|
||||
}
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types --- FIXME: disabled temporarily on migrate to TS.
|
||||
drawStacks = () => {
|
||||
const {
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'domainValues' does not exist on type 'Re... Remove this comment to see the full error message
|
||||
domainValues,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scale' does not exist on type 'Readonly<... Remove this comment to see the full error message
|
||||
scale,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'domain' does not exist on type 'Readonly... Remove this comment to see the full error message
|
||||
domain,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorTable' does not exist on type 'Read... Remove this comment to see the full error message
|
||||
colorTable,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'occupancy' does not exist on type 'Reado... Remove this comment to see the full error message
|
||||
occupancy,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'width' does not exist on type 'Readonly<... Remove this comment to see the full error message
|
||||
width,
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'height' does not exist on type 'Readonly... Remove this comment to see the full error message
|
||||
height,
|
||||
} = this.props;
|
||||
|
||||
if (!colorTable || !domainValues) return;
|
||||
|
||||
const { scale: colorScale } = colorTable;
|
||||
|
||||
const ctx = this.canvasRef?.current.getContext("2d");
|
||||
|
||||
ctx.clearRect(0, 0, width, height);
|
||||
let currentOffset = 0;
|
||||
|
||||
let occupancyValue;
|
||||
let scaledValue;
|
||||
let value;
|
||||
|
||||
for (let i = 0, { length } = domainValues; i < length; i += 1) {
|
||||
value = domainValues[i];
|
||||
occupancyValue = occupancy.get(value);
|
||||
scaledValue = scale(occupancyValue);
|
||||
ctx.fillStyle = occupancyValue
|
||||
? colorScale(domain.indexOf(value))
|
||||
: "rgb(255,255,255)";
|
||||
ctx.fillRect(currentOffset, 0, occupancyValue ? scaledValue : 0, height);
|
||||
currentOffset += occupancyValue ? scaledValue : 0;
|
||||
}
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/no-explicit-any -- - FIXME: disabled temporarily on migrate to TS.
|
||||
componentDidUpdate = (prevProps: any) => {
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'occupancy' does not exist on type 'Reado... Remove this comment to see the full error message
|
||||
const { occupancy } = this.props;
|
||||
if (occupancy !== prevProps.occupancy) this.drawStacks();
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types --- FIXME: disabled temporarily on migrate to TS.
|
||||
componentDidMount = () => {
|
||||
this.drawStacks();
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types --- FIXME: disabled temporarily on migrate to TS.
|
||||
render() {
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'width' does not exist on type 'Readonly<... Remove this comment to see the full error message
|
||||
const { width, height } = this.props;
|
||||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'canvas' does not exist on type 'MiniStac... Remove this comment to see the full error message
|
||||
const { canvas } = this;
|
||||
if (canvas) canvas.getContext("2d").clearRect(0, 0, width, height);
|
||||
|
||||
return (
|
||||
<canvas
|
||||
style={{
|
||||
marginRight: 5,
|
||||
width,
|
||||
height,
|
||||
}}
|
||||
width={width}
|
||||
height={height}
|
||||
ref={this.canvasRef}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user