fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-09-30 21:28:11 +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/actions/annotation.js → client/src/actions/annotation.ts
+40 -31
View File
@@ -9,9 +9,9 @@ import { MatrixFBS, AnnotationsHelpers } from "../util/stateManager";
const { isUserAnnotation } = AnnotationsHelpers;
export const annotationCreateCategoryAction = (
newCategoryName,
categoryToDuplicate
) => async (dispatch, getState) => {
newCategoryName: any,
categoryToDuplicate: any
) => async (dispatch: any, getState: any) => {
/*
Add a new user-created category to the obs annotations.
@@ -89,9 +89,9 @@ export const annotationCreateCategoryAction = (
};
export const annotationRenameCategoryAction = (
oldCategoryName,
newCategoryName
) => (dispatch, getState) => {
oldCategoryName: any,
newCategoryName: any
) => (dispatch: any, getState: any) => {
/*
Rename a user-created annotation category
*/
@@ -124,9 +124,9 @@ export const annotationRenameCategoryAction = (
});
};
export const annotationDeleteCategoryAction = (categoryName) => (
dispatch,
getState
export const annotationDeleteCategoryAction = (categoryName: any) => (
dispatch: any,
getState: any
) => {
/*
Delete a user-created category
@@ -149,10 +149,10 @@ export const annotationDeleteCategoryAction = (categoryName) => (
};
export const annotationCreateLabelInCategory = (
categoryName,
labelName,
assignSelected
) => async (dispatch, getState) => {
categoryName: any,
labelName: any,
assignSelected: any
) => async (dispatch: any, getState: any) => {
/*
Add a new label to a user-defined category. If assignSelected is true, assign
the label to all currently selected cells.
@@ -188,9 +188,9 @@ export const annotationCreateLabelInCategory = (
};
export const annotationDeleteLabelFromCategory = (
categoryName,
labelName
) => async (dispatch, getState) => {
categoryName: any,
labelName: any
) => async (dispatch: any, getState: any) => {
/*
delete a label from a user-defined category
*/
@@ -218,10 +218,10 @@ export const annotationDeleteLabelFromCategory = (
};
export const annotationRenameLabelInCategory = (
categoryName,
oldLabelName,
newLabelName
) => async (dispatch, getState) => {
categoryName: any,
oldLabelName: any,
newLabelName: any
) => async (dispatch: any, getState: any) => {
/*
label name change
*/
@@ -255,9 +255,9 @@ export const annotationRenameLabelInCategory = (
};
export const annotationLabelCurrentSelection = (
categoryName,
labelName
) => async (dispatch, getState) => {
categoryName: any,
labelName: any
) => async (dispatch: any, getState: any) => {
/*
set the label on all currently selected
*/
@@ -284,13 +284,16 @@ export const annotationLabelCurrentSelection = (
});
};
function writableAnnotations(annoMatrix) {
function writableAnnotations(annoMatrix: any) {
return annoMatrix.schema.annotations.obs.columns
.filter((s) => s.writable)
.map((s) => s.name);
.filter((s: any) => s.writable)
.map((s: any) => s.name);
}
export const needToSaveObsAnnotations = (annoMatrix, lastSavedAnnoMatrix) => {
export const needToSaveObsAnnotations = (
annoMatrix: any,
lastSavedAnnoMatrix: any
) => {
/*
Return true if there are LIKELY user-defined annotation modifications between the two
annoMatrices. Technically not an action creator, but intimately intertwined
@@ -314,11 +317,14 @@ export const needToSaveObsAnnotations = (annoMatrix, lastSavedAnnoMatrix) => {
// no schema changes; check for change in contents
return currentWritable.some(
(col) => annoMatrix.col(col) !== lastSavedAnnoMatrix.col(col)
(col: any) => annoMatrix.col(col) !== lastSavedAnnoMatrix.col(col)
);
};
export const saveObsAnnotationsAction = () => async (dispatch, getState) => {
export const saveObsAnnotationsAction = () => async (
dispatch: any,
getState: any
) => {
/*
Save the user-created obs annotations IF any have changed.
*/
@@ -388,7 +394,10 @@ export const saveObsAnnotationsAction = () => async (dispatch, getState) => {
}
};
export const saveGenesetsAction = () => async (dispatch, getState) => {
export const saveGenesetsAction = () => async (
dispatch: any,
getState: any
) => {
const state = getState();
// bail if gene sets not available, or in readonly mode.
@@ -465,7 +474,7 @@ export const saveGenesetsAction = () => async (dispatch, getState) => {
res,
});
}
return Promise.all([
return await Promise.all([
dispatch({
type: "autosave: genesets complete",
lastSavedGenesets: genesets,
client/src/actions/embedding.js → client/src/actions/embedding.ts
+6 -6
View File
@@ -6,9 +6,9 @@ import { AnnoMatrixObsCrossfilter } from "../annoMatrix";
import { _setEmbeddingSubset } from "../util/stateManager/viewStackHelpers";
export async function _switchEmbedding(
prevAnnoMatrix,
prevCrossfilter,
newEmbeddingName
prevAnnoMatrix: any,
prevCrossfilter: any,
newEmbeddingName: any
) {
/*
DRY helper used by embedding action creators
@@ -25,9 +25,9 @@ export async function _switchEmbedding(
return [annoMatrix, obsCrossfilter];
}
export const layoutChoiceAction = (newLayoutChoice) => async (
dispatch,
getState
export const layoutChoiceAction = (newLayoutChoice: any) => async (
dispatch: any,
getState: any
) => {
/*
On layout choice, make sure we have selected all on the previous layout, AND the new
client/src/actions/geneset.js → client/src/actions/geneset.ts
+26 -13
View File
@@ -21,7 +21,10 @@ The behavior manifest in these action creators:
Note that crossfilter indices are lazy created, as needed.
*/
export const genesetDelete = (genesetName) => (dispatch, getState) => {
export const genesetDelete = (genesetName: any) => (
dispatch: any,
getState: any
) => {
const state = getState();
const { genesets } = state;
const gs = genesets?.genesets?.get(genesetName) ?? {};
@@ -40,9 +43,9 @@ export const genesetDelete = (genesetName) => (dispatch, getState) => {
});
};
export const genesetAddGenes = (genesetName, genes) => async (
dispatch,
getState
export const genesetAddGenes = (genesetName: any, genes: any) => async (
dispatch: any,
getState: any
) => {
const state = getState();
const { obsCrossfilter: prevObsCrossfilter, annoMatrix } = state;
@@ -50,7 +53,7 @@ export const genesetAddGenes = (genesetName, genes) => async (
const varIndex = schema.annotations.var.index;
const df = await annoMatrix.fetch("var", varIndex);
const geneNames = df.col(varIndex).asArray();
genes = genes.reduce((acc, gene) => {
genes = genes.reduce((acc: any, gene: any) => {
if (geneNames.indexOf(gene.geneSymbol) === -1) {
postUserErrorToast(
`${gene.geneSymbol} doesn't appear to be a valid gene name.`
@@ -78,9 +81,9 @@ export const genesetAddGenes = (genesetName, genes) => async (
});
};
export const genesetDeleteGenes = (genesetName, geneSymbols) => (
dispatch,
getState
export const genesetDeleteGenes = (genesetName: any, geneSymbols: any) => (
dispatch: any,
getState: any
) => {
const state = getState();
const obsCrossfilter = dropGeneset(dispatch, state, genesetName, geneSymbols);
@@ -97,7 +100,11 @@ export const genesetDeleteGenes = (genesetName, geneSymbols) => (
Private
*/
function dropGenesetSummaryDimension(obsCrossfilter, state, genesetName) {
function dropGenesetSummaryDimension(
obsCrossfilter: any,
state: any,
genesetName: any
) {
const { annoMatrix, genesets } = state;
const varIndex = annoMatrix.schema.annotations?.var?.index;
const gs = genesets?.genesets?.get(genesetName) ?? {};
@@ -113,7 +120,7 @@ function dropGenesetSummaryDimension(obsCrossfilter, state, genesetName) {
return obsCrossfilter.dropDimension("X", query);
}
function dropGeneDimension(obsCrossfilter, state, gene) {
function dropGeneDimension(obsCrossfilter: any, state: any, gene: any) {
const { annoMatrix } = state;
const varIndex = annoMatrix.schema.annotations?.var?.index;
const query = {
@@ -126,10 +133,16 @@ function dropGeneDimension(obsCrossfilter, state, gene) {
return obsCrossfilter.dropDimension("X", query);
}
function dropGeneset(dispatch, state, genesetName, geneSymbols) {
function dropGeneset(
dispatch: any,
state: any,
genesetName: any,
geneSymbols: any
) {
const { obsCrossfilter: prevObsCrossfilter } = state;
const obsCrossfilter = geneSymbols.reduce(
(crossfilter, gene) => dropGeneDimension(crossfilter, state, gene),
(crossfilter: any, gene: any) =>
dropGeneDimension(crossfilter, state, gene),
dropGenesetSummaryDimension(prevObsCrossfilter, state, genesetName)
);
dispatch({
@@ -137,7 +150,7 @@ function dropGeneset(dispatch, state, genesetName, geneSymbols) {
continuousNamespace: { isGeneSetSummary: true },
selection: genesetName,
});
geneSymbols.forEach((g) =>
geneSymbols.forEach((g: any) =>
dispatch({
type: "continuous metadata histogram cancel",
continuousNamespace: { isUserDefined: true },
client/src/actions/index.js → client/src/actions/index.ts
+22 -18
View File
@@ -15,7 +15,7 @@ import * as genesetActions from "./geneset";
/*
return promise fetching user-configured colors
*/
async function userColorsFetchAndLoad(dispatch) {
async function userColorsFetchAndLoad(dispatch: any) {
return fetchJson("colors").then((response) =>
dispatch({
type: "universe: user color load success",
@@ -28,7 +28,7 @@ async function schemaFetch() {
return fetchJson("schema");
}
async function configFetch(dispatch) {
async function configFetch(dispatch: any) {
return fetchJson("config").then((response) => {
const config = { ...globals.configDefaults, ...response.config };
dispatch({
@@ -39,7 +39,7 @@ async function configFetch(dispatch) {
});
}
async function userInfoFetch(dispatch) {
async function userInfoFetch(dispatch: any) {
return fetchJson("userinfo").then((response) => {
const { userinfo: userInfo } = response || {};
dispatch({
@@ -50,7 +50,7 @@ async function userInfoFetch(dispatch) {
});
}
async function genesetsFetch(dispatch, config) {
async function genesetsFetch(dispatch: any, config: any) {
/* request genesets ONLY if the backend supports the feature */
const defaultResponse = {
genesets: [],
@@ -71,25 +71,26 @@ async function genesetsFetch(dispatch, config) {
}
}
function prefetchEmbeddings(annoMatrix) {
function prefetchEmbeddings(annoMatrix: any) {
/*
prefetch requests for all embeddings
*/
const { schema } = annoMatrix;
const available = schema.layout.obs.map((v) => v.name);
available.forEach((embName) => annoMatrix.prefetch("emb", embName));
const available = schema.layout.obs.map((v: any) => v.name);
available.forEach((embName: any) => annoMatrix.prefetch("emb", embName));
}
/*
Application bootstrap
*/
const doInitialDataLoad = () =>
catchErrorsWrap(async (dispatch) => {
catchErrorsWrap(async (dispatch: any) => {
dispatch({ type: "initial data load start" });
try {
const [config, schema] = await Promise.all([
configFetch(dispatch),
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
schemaFetch(dispatch),
userColorsFetchAndLoad(dispatch),
userInfoFetch(dispatch),
@@ -113,7 +114,7 @@ const doInitialDataLoad = () =>
const layoutSchema = schema?.schema?.layout?.obs ?? [];
if (
defaultEmbedding &&
layoutSchema.some((s) => s.name === defaultEmbedding)
layoutSchema.some((s: any) => s.name === defaultEmbedding)
) {
dispatch(embActions.layoutChoiceAction(defaultEmbedding));
}
@@ -122,21 +123,22 @@ const doInitialDataLoad = () =>
}
}, true);
function requestSingleGeneExpressionCountsForColoringPOST(gene) {
function requestSingleGeneExpressionCountsForColoringPOST(gene: any) {
return {
type: "color by expression",
gene,
};
}
const requestUserDefinedGene = (gene) => ({
const requestUserDefinedGene = (gene: any) => ({
type: "request user defined gene success",
data: {
genes: [gene],
},
});
const dispatchDiffExpErrors = (dispatch, response) => {
const dispatchDiffExpErrors = (dispatch: any, response: any) => {
switch (response.status) {
case 403:
dispatchNetworkErrorMessageToUser(
@@ -159,10 +161,11 @@ const dispatchDiffExpErrors = (dispatch, response) => {
}
};
const requestDifferentialExpression = (set1, set2, num_genes = 50) => async (
dispatch,
getState
) => {
const requestDifferentialExpression = (
set1: any,
set2: any,
num_genes = 50
) => async (dispatch: any, getState: any) => {
dispatch({ type: "request differential expression started" });
try {
/*
@@ -210,7 +213,8 @@ const requestDifferentialExpression = (set1, set2, num_genes = 50) => async (
const varIndex = await annoMatrix.fetch("var", varIndexName);
const diffexpLists = { negative: [], positive: [] };
for (const polarity of Object.keys(diffexpLists)) {
diffexpLists[polarity] = response[polarity].map((v) => [
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
diffexpLists[polarity] = response[polarity].map((v: any) => [
varIndex.at(v[0], varIndexName),
...v.slice(1),
]);
@@ -229,7 +233,7 @@ const requestDifferentialExpression = (set1, set2, num_genes = 50) => async (
}
};
function fetchJson(pathAndQuery) {
function fetchJson(pathAndQuery: any) {
return doJsonRequest(
`${globals.API.prefix}${globals.API.version}${pathAndQuery}`
);
client/src/actions/selection.js → client/src/actions/selection.ts
+39 -32
View File
@@ -2,11 +2,11 @@
Action creators for selection
*/
export const selectContinuousMetadataAction = (
type,
query,
range,
type: any,
query: any,
range: any,
oldProps = {}
) => async (dispatch, getState) => {
) => async (dispatch: any, getState: any) => {
const { obsCrossfilter: prevObsCrossfilter } = getState();
const selection = range
@@ -29,13 +29,13 @@ export const selectContinuousMetadataAction = (
};
export const selectCategoricalMetadataAction = (
type, // action type
metadataField, // annotation category name
labels,
label, // the label being selected/deselected
isSelected, // bool
type: any, // action type
metadataField: any, // annotation category name
labels: any,
label: any, // the label being selected/deselected
isSelected: any, // bool
oldProps = {}
) => async (dispatch, getState) => {
) => async (dispatch: any, getState: any) => {
const {
obsCrossfilter: prevObsCrossfilter,
categoricalSelection,
@@ -43,7 +43,7 @@ export const selectCategoricalMetadataAction = (
const labelSelectionState = new Map(categoricalSelection[metadataField]);
labels.forEach(
(l) => labelSelectionState.has(l) || labelSelectionState.set(l, true)
(l: any) => labelSelectionState.has(l) || labelSelectionState.set(l, true)
);
labelSelectionState.set(label, isSelected);
@@ -70,19 +70,19 @@ export const selectCategoricalMetadataAction = (
};
export const selectCategoricalAllMetadataAction = (
type, // action type
metadataField, // annotation category name
labels,
isSelected, // bool, select all or none
type: any, // action type
metadataField: any, // annotation category name
labels: any,
isSelected: any, // bool, select all or none
oldProps = {}
) => async (dispatch, getState) => {
) => async (dispatch: any, getState: any) => {
const {
obsCrossfilter: prevObsCrossfilter,
categoricalSelection,
} = getState();
const labelSelectionState = new Map(categoricalSelection[metadataField]);
labels.forEach((label) => labelSelectionState.set(label, isSelected));
labels.forEach((label: any) => labelSelectionState.set(label, isSelected));
const selection = { mode: isSelected ? "all" : "none" };
const obsCrossfilter = await prevObsCrossfilter.select(
@@ -108,10 +108,11 @@ export const graphBrushStartAction = () =>
/* no change to crossfilter until a change fires */
({ type: "graph brush start" });
const _graphBrushWithinRectAction = (type, embName, brushCoords) => async (
dispatch,
getState
) => {
const _graphBrushWithinRectAction = (
type: any,
embName: any,
brushCoords: any
) => async (dispatch: any, getState: any) => {
const { obsCrossfilter: prevObsCrossfilter } = getState();
const selection = { mode: "within-rect", ...brushCoords };
@@ -128,7 +129,10 @@ const _graphBrushWithinRectAction = (type, embName, brushCoords) => async (
});
};
const _graphAllAction = (type, embName) => async (dispatch, getState) => {
const _graphAllAction = (type: any, embName: any) => async (
dispatch: any,
getState: any
) => {
const { obsCrossfilter: prevObsCrossfilter } = getState();
const obsCrossfilter = await prevObsCrossfilter.select("emb", embName, {
@@ -141,30 +145,30 @@ const _graphAllAction = (type, embName) => async (dispatch, getState) => {
});
};
export const graphBrushChangeAction = (embName, brushCoords) =>
export const graphBrushChangeAction = (embName: any, brushCoords: any) =>
_graphBrushWithinRectAction("graph brush change", embName, brushCoords);
export const graphBrushEndAction = (embName, brushCoords) =>
export const graphBrushEndAction = (embName: any, brushCoords: any) =>
_graphBrushWithinRectAction("graph brush end", embName, brushCoords);
export const graphBrushCancelAction = (embName) =>
export const graphBrushCancelAction = (embName: any) =>
_graphAllAction("graph brush cancel", embName);
export const graphBrushDeselectAction = (embName) =>
export const graphBrushDeselectAction = (embName: any) =>
_graphAllAction("graph brush deselect", embName);
export const graphLassoStartAction = () =>
/* no change to crossfilter until a change fires */
({ type: "graph lasso start" });
export const graphLassoCancelAction = (embName) =>
export const graphLassoCancelAction = (embName: any) =>
_graphAllAction("graph lasso cancel", embName);
export const graphLassoDeselectAction = (embName) =>
export const graphLassoDeselectAction = (embName: any) =>
_graphAllAction("graph lasso cancel", embName);
export const graphLassoEndAction = (embName, polygon) => async (
dispatch,
getState
export const graphLassoEndAction = (embName: any, polygon: any) => async (
dispatch: any,
getState: any
) => {
const { obsCrossfilter: prevObsCrossfilter } = getState();
@@ -188,7 +192,10 @@ export const graphLassoEndAction = (embName, polygon) => async (
/*
Differential expression set selection
*/
export const setCellSetFromSelection = (cellSetId) => (dispatch, getState) => {
export const setCellSetFromSelection = (cellSetId: any) => (
dispatch: any,
getState: any
) => {
const { obsCrossfilter } = getState();
const selected = obsCrossfilter.allSelectedLabels();
client/src/actions/viewStack.js → client/src/actions/viewStack.ts
+6 -3
View File
@@ -18,7 +18,10 @@ import {
_userResetSubsetAnnoMatrix,
} from "../util/stateManager/viewStackHelpers";
export const clipAction = (min, max) => (dispatch, getState) => {
export const clipAction = (min: any, max: any) => (
dispatch: any,
getState: any
) => {
/*
apply a clip to the current annoMatrix. By convention, the clip
view is ALWAYS the top view.
@@ -34,7 +37,7 @@ export const clipAction = (min, max) => (dispatch, getState) => {
});
};
export const subsetAction = () => (dispatch, getState) => {
export const subsetAction = () => (dispatch: any, getState: any) => {
/*
Subset the annoMatrix to the current crossfilter selection by pushing a
subset view.
@@ -58,7 +61,7 @@ export const subsetAction = () => (dispatch, getState) => {
});
};
export const resetSubsetAction = () => (dispatch, getState) => {
export const resetSubsetAction = () => (dispatch: any, getState: any) => {
/*
Reset the annoMatrix to all data. Because we may have multiple views
stacked, we pop them all. By convention, any clip transformation will
client/src/annoMatrix/annoMatrix.js → client/src/annoMatrix/annoMatrix.ts
+82 -26
View File
@@ -17,6 +17,28 @@ import { _queryValidate, _queryCacheKey } from "./query";
const _dataframeCache = dataframeMemo(128);
export default class AnnoMatrix {
public isView: any;
public nObs: any;
public nVar: any;
public rowIndex: any;
public schema: any;
public userFlags: any;
public viewOf: any;
protected _cache: any;
private _pendingLoad: any;
private _whereCache: any;
private _gcInfo: any;
/*
Abstract base class for all AnnoMatrix objects. This class provides a proxy
to the annotated matrix data authoritatively served by the server/back-end.
@@ -54,7 +76,7 @@ export default class AnnoMatrix {
return ["obs", "var", "emb", "X"];
}
constructor(schema, nObs, nVar, rowIndex = null) {
constructor(schema: any, nObs: any, nVar: any, rowIndex = null) {
/*
Private constructor - this is an abstract base class. Do not use.
*/
@@ -83,13 +105,13 @@ export default class AnnoMatrix {
this.userFlags = {};
/*
Private instance variables.
Private instance variables.
These are caches - lazily loaded. The only guarantee is that if they
are loaded, they will conform to the schema & dimensionality constraints.
These are caches - lazily loaded. The only guarantee is that if they
are loaded, they will conform to the schema & dimensionality constraints.
Do NOT use directly - instead, use the fetch() and preload() API.
*/
Do NOT use directly - instead, use the fetch() and preload() API.
*/
this._cache = {
obs: Dataframe.empty(this.rowIndex),
var: Dataframe.empty(this.rowIndex),
@@ -109,6 +131,7 @@ export default class AnnoMatrix {
/**
** Schema helper/accessors
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
getMatrixColumns(field) {
/*
Return array of column names in the field. ONLY supported on the
@@ -132,6 +155,7 @@ export default class AnnoMatrix {
return AnnoMatrix.fields();
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
getColumnSchema(field, col) {
/*
Return the schema for the field & column ,eg,
@@ -144,6 +168,7 @@ export default class AnnoMatrix {
return _getColumnSchema(this.schema, field, col);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
getColumnDimensions(field, col) {
/*
Return the dimensions on this field / column. For most fields, which are 1D,
@@ -174,6 +199,7 @@ export default class AnnoMatrix {
/**
** Load / read interfaces
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
fetch(field, q) {
/*
Return the given query on a single matrix field as a single dataframe.
@@ -231,6 +257,7 @@ export default class AnnoMatrix {
return this._fetch(field, q);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
prefetch(field, q) {
/*
Start a data fetch & cache fill. Identical to fetch() except it does
@@ -261,7 +288,8 @@ export default class AnnoMatrix {
** The actual implementation is in the sub-classes, which MUST override these.
**/
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'col' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
addObsAnnoCategory(col, category) {
/*
Add a new category value (aka "label") to a writable obs column, and return the new AnnoMatrix.
@@ -278,7 +306,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'col' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
async removeObsAnnoCategory(col, category, unassignedCategory) {
/*
Remove a category value from an obs column, reassign any obs having that value
@@ -299,7 +328,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'col' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
dropObsColumn(col) {
/*
Drop an entire writable column, eg a user-created obs annotation. Typical use
@@ -315,7 +345,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'colSchema' is declared but its value is never rea... Remove this comment to see the full error message
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
addObsColumn(colSchema, Ctor, value) {
/*
Add a new writable OBS annotation column, with the caller-specified schema, initial value
@@ -344,7 +375,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'oldCol' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
renameObsColumn(oldCol, newCol) {
/*
Rename the obs column 'oldCol' to have name 'newCol' and returns new AnnoMatrix.
@@ -359,7 +391,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'col' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
async setObsColumnValues(col, obsLabels, value) {
/*
Set all obs with label in array 'obsLabels' to have 'value'. Typical use would be
@@ -377,7 +410,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'col' is declared but its value is never read.
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
async resetObsColumnValues(col, oldValue, newValue) {
/*
Set by value - all elements in the column with value 'oldValue' are set to 'newValue'.
@@ -394,7 +428,8 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// eslint-disable-next-line class-methods-use-this, no-unused-vars -- make sure subclass implements
// @ts-expect-error ts-migrate(6133) FIXME: 'colSchema' is declared but its value is never rea... Remove this comment to see the full error message
// eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars -- make sure subclass implements
addEmbedding(colSchema) {
/*
Add a new obs embedding to the AnnoMatrix, with provided schema.
@@ -407,28 +442,35 @@ export default class AnnoMatrix {
_subclassResponsibility();
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
getCacheKeys(field, query) {
/*
Return cache keys for columns associated with this query. May return
[unknown] if no keys are known (ie, nothing is or was cached).
*/
Return cache keys for columns associated with this query. May return
[unknown] if no keys are known (ie, nothing is or was cached).
*/
return _whereCacheGet(this._whereCache, this.schema, field, query);
}
/**
** Private interfaces below.
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_resolveCachedQueries(field, queries) {
return queries
.map((query) =>
_whereCacheGet(this._whereCache, this.schema, field, query).filter(
(cacheKey) =>
cacheKey !== undefined && this._cache[field].hasCol(cacheKey)
return (
queries
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'query' implicitly has an 'any' type.
.map((query) =>
_whereCacheGet(this._whereCache, this.schema, field, query).filter(
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'cacheKey' implicitly has an 'any' type.
(cacheKey) =>
cacheKey !== undefined && this._cache[field].hasCol(cacheKey)
)
)
)
.flat();
.flat()
);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
async _fetch(field, q) {
if (!AnnoMatrix.fields().includes(field)) return undefined;
const queries = Array.isArray(q) ? q : [q];
@@ -441,6 +483,7 @@ export default class AnnoMatrix {
/* find any query not already cached */
const uncachedQueries = queries.filter((query) =>
_whereCacheGet(this._whereCache, this.schema, field, query).some(
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'cacheKey' implicitly has an 'any' type.
(cacheKey) =>
cacheKey === undefined || !this._cache[field].hasCol(cacheKey)
)
@@ -450,8 +493,10 @@ export default class AnnoMatrix {
if (uncachedQueries.length > 0) {
await Promise.all(
uncachedQueries.map((query) =>
// @ts-expect-error ts-migrate(7006) FIXME: Parameter '_field' implicitly has an 'any' type.
this._getPendingLoad(field, query, async (_field, _query) => {
/* fetch, then index. _doLoad is subclass interface */
// @ts-expect-error ts-migrate(2488) FIXME: Type 'void' must have a '[Symbol.iterator]()' meth... Remove this comment to see the full error message
const [whereCacheUpdate, df] = await this._doLoad(_field, _query);
this._cache[_field] = this._cache[_field].withColsFrom(df);
this._whereCache = _whereCacheMerge(
@@ -472,6 +517,7 @@ export default class AnnoMatrix {
return response;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
async _getPendingLoad(field, query, fetchFn) {
/*
Given a query on a field, ensure that we only have a single outstanding
@@ -527,19 +573,21 @@ export default class AnnoMatrix {
To be effective, the GC callback needs to be invoked from the undo/redo code,
as much of the cache is pinned by that data structure.
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_gcField(field, isHot, pinnedColumns) {
const maxColumns = isHot ? 256 : 10; // maybe to aggressive?
const maxColumns = isHot ? 256 : 10;
const cache = this._cache[field];
if (cache.colIndex.size() < maxColumns) return; // trivial rejection
const candidates = cache.colIndex
.labels()
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
.filter((col) => !pinnedColumns.includes(col));
const excessCount = candidates.length + pinnedColumns.length - maxColumns;
if (excessCount > 0) {
const { _gcInfo } = this;
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'a' implicitly has an 'any' type.
candidates.sort((a, b) => {
let atime = _gcInfo.get(_columnCacheKey(field, a));
if (atime === undefined) atime = 0;
@@ -558,13 +606,16 @@ export default class AnnoMatrix {
// )}]`
// );
this._cache[field] = toDrop.reduce(
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'df' implicitly has an 'any' type.
(df, col) => df.dropCol(col),
this._cache[field]
);
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
toDrop.forEach((col) => _gcInfo.delete(_columnCacheKey(field, col)));
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_gcFetchCleanup(field, pinnedColumns) {
/*
Called during data load/fetch. By definition, this is 'hot', so we
@@ -579,6 +630,7 @@ export default class AnnoMatrix {
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'hints' implicitly has an 'any' type.
_gc(hints) {
/*
Called from middleware, or elsewhere. isHot is true if we are in the active store,
@@ -591,6 +643,7 @@ export default class AnnoMatrix {
);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_gcUpdateStats(field, dataframe) {
/*
called each time a query is performed, allowing the gc to update any bookkeeping
@@ -600,6 +653,7 @@ export default class AnnoMatrix {
const cols = dataframe.colIndex.labels();
const { _gcInfo } = this;
const now = Date.now();
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'c' implicitly has an 'any' type.
cols.forEach((c) => {
_gcInfo.set(_columnCacheKey(field, c), now);
});
@@ -617,6 +671,7 @@ export default class AnnoMatrix {
Do not override _clone();
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'clone' implicitly has an 'any' type.
_cloneDeeper(clone) {
clone._cache = _shallowClone(this._cache);
clone._gcInfo = new Map();
@@ -640,6 +695,7 @@ export default class AnnoMatrix {
/*
private utility functions below
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
function _columnCacheKey(field, column) {
return `${field}/${column}`;
}
client/src/annoMatrix/clone.js → client/src/annoMatrix/clone.ts
+1 -1
View File
@@ -1,6 +1,6 @@
/*
Shallow clone an object, correctly handling prototype
*/
export default function _shallowClone(orig) {
export default function _shallowClone(orig: any) {
return Object.assign(Object.create(Object.getPrototypeOf(orig)), orig);
}
client/src/annoMatrix/crossfilter.js → client/src/annoMatrix/crossfilter.ts
+81 -31
View File
@@ -10,26 +10,31 @@ AnnoMatrix stay in sync:
import Crossfilter from "../util/typedCrossfilter";
import { _getColumnSchema } from "./schema";
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
function _dimensionNameFromDf(field, df) {
const colNames = df.colIndex.labels();
return _dimensionName(field, colNames);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
function _dimensionName(field, colNames) {
if (!Array.isArray(colNames)) return `${field}/${colNames}`;
return `${field}/${colNames.join(":")}`;
}
export default class AnnoMatrixObsCrossfilter {
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
constructor(annoMatrix, _obsCrossfilter = null) {
this.annoMatrix = annoMatrix;
this.obsCrossfilter =
(this as any).annoMatrix = annoMatrix;
(this as any).obsCrossfilter =
_obsCrossfilter || new Crossfilter(annoMatrix._cache.obs);
this.obsCrossfilter = this.obsCrossfilter.setData(annoMatrix._cache.obs);
(this as any).obsCrossfilter = (this as any).obsCrossfilter.setData(
annoMatrix._cache.obs
);
}
size() {
return this.obsCrossfilter.size();
return (this as any).obsCrossfilter.size();
}
/**
@@ -39,14 +44,23 @@ export default class AnnoMatrixObsCrossfilter {
See API documentation in annoMatrix.js.
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
addObsColumn(colSchema, Ctor, value) {
const annoMatrix = this.annoMatrix.addObsColumn(colSchema, Ctor, value);
const obsCrossfilter = this.obsCrossfilter.setData(annoMatrix._cache.obs);
const annoMatrix = (this as any).annoMatrix.addObsColumn(
colSchema,
Ctor,
value
);
const obsCrossfilter = (this as any).obsCrossfilter.setData(
annoMatrix._cache.obs
);
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
dropObsColumn(col) {
const annoMatrix = this.annoMatrix.dropObsColumn(col);
const annoMatrix = (this as any).annoMatrix.dropObsColumn(col);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
const dimName = _dimensionName("obs", col);
if (obsCrossfilter.hasDimension(dimName)) {
@@ -55,10 +69,12 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'oldCol' implicitly has an 'any' type.
renameObsColumn(oldCol, newCol) {
const annoMatrix = this.annoMatrix.renameObsColumn(oldCol, newCol);
const annoMatrix = (this as any).annoMatrix.renameObsColumn(oldCol, newCol);
const oldDimName = _dimensionName("obs", oldCol);
const newDimName = _dimensionName("obs", newCol);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (obsCrossfilter.hasDimension(oldDimName)) {
obsCrossfilter = obsCrossfilter.renameDimension(oldDimName, newDimName);
@@ -66,9 +82,14 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
addObsAnnoCategory(col, category) {
const annoMatrix = this.annoMatrix.addObsAnnoCategory(col, category);
const annoMatrix = (this as any).annoMatrix.addObsAnnoCategory(
col,
category
);
const dimName = _dimensionName("obs", col);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (obsCrossfilter.hasDimension(dimName)) {
obsCrossfilter = obsCrossfilter.delDimension(dimName);
@@ -76,13 +97,15 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
async removeObsAnnoCategory(col, category, unassignedCategory) {
const annoMatrix = await this.annoMatrix.removeObsAnnoCategory(
const annoMatrix = await (this as any).annoMatrix.removeObsAnnoCategory(
col,
category,
unassignedCategory
);
const dimName = _dimensionName("obs", col);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (obsCrossfilter.hasDimension(dimName)) {
obsCrossfilter = obsCrossfilter.delDimension(dimName);
@@ -90,13 +113,15 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
async setObsColumnValues(col, rowLabels, value) {
const annoMatrix = await this.annoMatrix.setObsColumnValues(
const annoMatrix = await (this as any).annoMatrix.setObsColumnValues(
col,
rowLabels,
value
);
const dimName = _dimensionName("obs", col);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (obsCrossfilter.hasDimension(dimName)) {
obsCrossfilter = obsCrossfilter.delDimension(dimName);
@@ -104,13 +129,15 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
async resetObsColumnValues(col, oldValue, newValue) {
const annoMatrix = await this.annoMatrix.resetObsColumnValues(
const annoMatrix = await (this as any).annoMatrix.resetObsColumnValues(
col,
oldValue,
newValue
);
const dimName = _dimensionName("obs", col);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (obsCrossfilter.hasDimension(dimName)) {
obsCrossfilter = obsCrossfilter.delDimension(dimName);
@@ -118,9 +145,13 @@ export default class AnnoMatrixObsCrossfilter {
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
addEmbedding(colSchema) {
const annoMatrix = this.annoMatrix.addEmbedding(colSchema);
return new AnnoMatrixObsCrossfilter(annoMatrix, this.obsCrossfilter);
const annoMatrix = (this as any).annoMatrix.addEmbedding(colSchema);
return new AnnoMatrixObsCrossfilter(
annoMatrix,
(this as any).obsCrossfilter
);
}
/**
@@ -128,11 +159,15 @@ export default class AnnoMatrixObsCrossfilter {
* want to stop trackin the selection state, but aren't sure we want to blow the
* annomatrix cache.
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
dropDimension(field, query) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Anno... Remove this comment to see the full error message
const { annoMatrix } = this;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
const keys = annoMatrix
.getCacheKeys(field, query)
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'k' implicitly has an 'any' type.
.filter((k) => k !== undefined);
const dimName = _dimensionName(field, keys);
if (obsCrossfilter.hasDimension(dimName)) {
@@ -146,8 +181,11 @@ export default class AnnoMatrixObsCrossfilter {
are just wrappers to lazy create indices.
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
async select(field, query, spec) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Anno... Remove this comment to see the full error message
const { annoMatrix } = this;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
let { obsCrossfilter } = this;
if (!annoMatrix?._cache?.[field]) {
@@ -180,55 +218,59 @@ export default class AnnoMatrixObsCrossfilter {
/*
Select all on any dimension in this field.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Anno... Remove this comment to see the full error message
const { annoMatrix } = this;
const currentDims = this.obsCrossfilter.dimensionNames();
const currentDims = (this as any).obsCrossfilter.dimensionNames();
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'xfltr' implicitly has an 'any' type.
const obsCrossfilter = currentDims.reduce((xfltr, dim) => {
return xfltr.select(dim, { mode: "all" });
}, this.obsCrossfilter);
}, (this as any).obsCrossfilter);
return new AnnoMatrixObsCrossfilter(annoMatrix, obsCrossfilter);
}
countSelected() {
/* if no data yet indexed in the crossfilter, just say everything is selected */
if (this.obsCrossfilter.size() === 0) return this.annoMatrix.nObs;
return this.obsCrossfilter.countSelected();
if ((this as any).obsCrossfilter.size() === 0)
return (this as any).annoMatrix.nObs;
return (this as any).obsCrossfilter.countSelected();
}
allSelectedMask() {
/* if no data yet indexed in the crossfilter, just say everything is selected */
if (
this.obsCrossfilter.size() === 0 ||
this.obsCrossfilter.dimensionNames().length === 0
(this as any).obsCrossfilter.size() === 0 ||
(this as any).obsCrossfilter.dimensionNames().length === 0
) {
/* fake the mask */
return new Uint8Array(this.annoMatrix.nObs).fill(1);
return new Uint8Array((this as any).annoMatrix.nObs).fill(1);
}
return this.obsCrossfilter.allSelectedMask();
return (this as any).obsCrossfilter.allSelectedMask();
}
allSelectedLabels() {
/* if no data yet indexed in the crossfilter, just say everything is selected */
if (
this.obsCrossfilter.size() === 0 ||
this.obsCrossfilter.dimensionNames().length === 0
(this as any).obsCrossfilter.size() === 0 ||
(this as any).obsCrossfilter.dimensionNames().length === 0
) {
return this.annoMatrix.rowIndex.labels();
return (this as any).annoMatrix.rowIndex.labels();
}
const mask = this.obsCrossfilter.allSelectedMask();
const index = this.annoMatrix.rowIndex.isubsetMask(mask);
const mask = (this as any).obsCrossfilter.allSelectedMask();
const index = (this as any).annoMatrix.rowIndex.isubsetMask(mask);
return index.labels();
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'array' implicitly has an 'any' type.
fillByIsSelected(array, selectedValue, deselectedValue) {
/* if no data yet indexed in the crossfilter, just say everything is selected */
if (
this.obsCrossfilter.size() === 0 ||
this.obsCrossfilter.dimensionNames().length === 0
(this as any).obsCrossfilter.size() === 0 ||
(this as any).obsCrossfilter.dimensionNames().length === 0
) {
return array.fill(selectedValue);
}
return this.obsCrossfilter.fillByIsSelected(
return (this as any).obsCrossfilter.fillByIsSelected(
array,
selectedValue,
deselectedValue
@@ -239,21 +281,29 @@ export default class AnnoMatrixObsCrossfilter {
** Private below
**/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
_addObsCrossfilterDimension(annoMatrix, obsCrossfilter, field, df) {
if (field === "var") return obsCrossfilter;
const dimName = _dimensionNameFromDf(field, df);
const dimParams = this._getObsDimensionParams(field, df);
obsCrossfilter = obsCrossfilter.setData(annoMatrix._cache.obs);
// @ts-expect-error ts-migrate(2488) FIXME: Type 'any[] | undefined' must have a '[Symbol.iter... Remove this comment to see the full error message
obsCrossfilter = obsCrossfilter.addDimension(dimName, ...dimParams);
return obsCrossfilter;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_getColumnBaseType(field, col) {
/* Look up the primitive type for this field/col */
const colSchema = _getColumnSchema(this.annoMatrix.schema, field, col);
const colSchema = _getColumnSchema(
(this as any).annoMatrix.schema,
field,
col
);
return colSchema.type;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
_getObsDimensionParams(field, df) {
/* return the crossfilter dimensiontype type and params for this field/dataframe */
client/src/annoMatrix/fetchHelpers.js → client/src/annoMatrix/fetchHelpers.ts
+4 -4
View File
@@ -1,19 +1,19 @@
export { doBinaryRequest, doFetch } from "../util/actionHelpers";
/* double URI encode - needed for query-param filters */
export function _dubEncURIComp(s) {
export function _dubEncURIComp(s: any) {
return encodeURIComponent(encodeURIComponent(s));
}
/* currently unused, consider deleting */
export function _fetchResult(promise) {
export function _fetchResult(promise: any) {
let _status = "pending";
const res = promise.then(
(r) => {
(r: any) => {
_status = "success";
return r;
},
(e) => {
(e: any) => {
_status = "error";
throw e;
}
client/src/annoMatrix/index.js → client/src/annoMatrix/index.ts
View File
client/src/annoMatrix/loader.js → client/src/annoMatrix/loader.ts
+39 -17
View File
@@ -23,6 +23,8 @@ import {
const promiseThrottle = new PromiseLimit(5);
export default class AnnoMatrixLoader extends AnnoMatrix {
baseURL: any;
/*
AnnoMatrix implementation which proxies to HTTP server using the CXG REST API.
Used as the base (non-view) instance.
@@ -33,7 +35,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
new AnnoMatrixLoader(serverBaseURL, schema) -> instance
*/
constructor(baseURL, schema) {
constructor(baseURL: any, schema: any) {
const { nObs, nVar } = schema.dataframe;
super(schema, nObs, nVar);
@@ -48,7 +50,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
/**
** Public. API described in base class.
**/
addObsAnnoCategory(col, category) {
addObsAnnoCategory(col: any, category: any) {
/*
Add a new category (aka label) to the schema for an obs column.
*/
@@ -60,7 +62,11 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
return newAnnoMatrix;
}
async removeObsAnnoCategory(col, category, unassignedCategory) {
async removeObsAnnoCategory(
col: any,
category: any,
unassignedCategory: any
) {
/*
Remove a single "category" (aka "label") from the data & schema of an obs column.
*/
@@ -80,7 +86,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
return newAnnoMatrix;
}
dropObsColumn(col) {
dropObsColumn(col: any) {
/*
drop column from field
*/
@@ -88,11 +94,12 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
_writableCheck(colSchema); // throws on error
const newAnnoMatrix = this._clone();
newAnnoMatrix._cache.obs = this._cache.obs.dropCol(col);
newAnnoMatrix._cache.obs = (this as any)._cache.obs.dropCol(col);
newAnnoMatrix.schema = removeObsAnnoColumn(this.schema, col);
return newAnnoMatrix;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
addObsColumn(colSchema, Ctor, value) {
/*
add a column to field, initializing with value. Value may
@@ -105,7 +112,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
const colName = colSchema.name;
if (
_getColumnSchema(this.schema, "obs", colName) ||
this._cache.obs.hasCol(colName)
(this as any)._cache.obs.hasCol(colName)
) {
throw new Error("column already exists");
}
@@ -121,7 +128,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
} else {
data = new Ctor(this.nObs).fill(value);
}
newAnnoMatrix._cache.obs = this._cache.obs.withCol(colName, data);
newAnnoMatrix._cache.obs = (this as any)._cache.obs.withCol(colName, data);
_normalizeCategoricalSchema(
colSchema,
newAnnoMatrix._cache.obs.col(colName)
@@ -130,15 +137,15 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
return newAnnoMatrix;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'oldCol' implicitly has an 'any' type.
renameObsColumn(oldCol, newCol) {
/*
Rename the obs oldColName to newColName. oldCol must be writable.
*/
const oldColSchema = _getColumnSchema(this.schema, "obs", oldCol);
_writableCheck(oldColSchema); // throws on error
const value = this._cache.obs.hasCol(oldCol)
? this._cache.obs.col(oldCol).asArray()
_writableCheck(oldColSchema);
const value = (this as any)._cache.obs.hasCol(oldCol)
? (this as any)._cache.obs.col(oldCol).asArray()
: undefined;
return this.dropObsColumn(oldCol).addObsColumn(
{
@@ -150,6 +157,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
async setObsColumnValues(col, rowLabels, value) {
/*
Set all rows identified by rowLabels to value.
@@ -159,11 +167,11 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
// ensure that we have the data in cache before we manipulate it
await this.fetch("obs", col);
if (!this._cache.obs.hasCol(col))
if (!(this as any)._cache.obs.hasCol(col))
throw new Error("Internal error - user annotation data missing");
const rowIndices = this.rowIndex.getOffsets(rowLabels);
const data = this._cache.obs.col(col).asArray().slice();
const data = (this as any)._cache.obs.col(col).asArray().slice();
for (let i = 0, len = rowIndices.length; i < len; i += 1) {
const idx = rowIndices[i];
if (idx === undefined) throw new Error("Unknown row label");
@@ -171,7 +179,10 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
}
const newAnnoMatrix = this._clone();
newAnnoMatrix._cache.obs = this._cache.obs.replaceColData(col, data);
newAnnoMatrix._cache.obs = (this as any)._cache.obs.replaceColData(
col,
data
);
const { categories } = colSchema;
if (!categories?.includes(value)) {
newAnnoMatrix.schema = addObsAnnoCategory(this.schema, col, value);
@@ -179,6 +190,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
return newAnnoMatrix;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'col' implicitly has an 'any' type.
async resetObsColumnValues(col, oldValue, newValue) {
/*
Set all rows with value 'oldValue' to 'newValue'.
@@ -192,16 +204,19 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
// ensure that we have the data in cache before we manipulate it
await this.fetch("obs", col);
if (!this._cache.obs.hasCol(col))
if (!(this as any)._cache.obs.hasCol(col))
throw new Error("Internal error - user annotation data missing");
const data = this._cache.obs.col(col).asArray().slice();
const data = (this as any)._cache.obs.col(col).asArray().slice();
for (let i = 0, l = data.length; i < l; i += 1) {
if (data[i] === oldValue) data[i] = newValue;
}
const newAnnoMatrix = this._clone();
newAnnoMatrix._cache.obs = this._cache.obs.replaceColData(col, data);
newAnnoMatrix._cache.obs = (this as any)._cache.obs.replaceColData(
col,
data
);
const { categories } = colSchema;
if (!categories?.includes(newValue)) {
newAnnoMatrix.schema = addObsAnnoCategory(this.schema, col, newValue);
@@ -209,6 +224,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
return newAnnoMatrix;
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
addEmbedding(colSchema) {
/*
add new layout to the obs embeddings
@@ -226,6 +242,7 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
/**
** Private below
**/
// @ts-expect-error ts-migrate(2416) FIXME: Property '_doLoad' in type 'AnnoMatrixLoader' is n... Remove this comment to see the full error message
async _doLoad(field, query) {
/*
_doLoad - evaluates the query against the field. Returns:
@@ -280,12 +297,14 @@ export default class AnnoMatrixLoader extends AnnoMatrix {
Utility functions below
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
function _writableCheck(colSchema) {
if (!colSchema?.writable) {
throw new Error("Unknown or readonly obs column");
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
function _writableCategoryTypeCheck(colSchema) {
_writableCheck(colSchema);
if (colSchema.type !== "categorical") {
@@ -293,6 +312,7 @@ function _writableCategoryTypeCheck(colSchema) {
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'baseURL' implicitly has an 'any' type.
function _embLoader(baseURL, _field, query) {
_expectSimpleQuery(query);
@@ -302,6 +322,7 @@ function _embLoader(baseURL, _field, query) {
return () => doBinaryRequest(url);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'baseURL' implicitly has an 'any' type.
function _obsOrVarLoader(baseURL, field, query) {
_expectSimpleQuery(query);
@@ -311,6 +332,7 @@ function _obsOrVarLoader(baseURL, field, query) {
return () => doBinaryRequest(url);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'baseURL' implicitly has an 'any' type.
function _XLoader(baseURL, field, query) {
_expectComplexQuery(query);
client/src/annoMatrix/middleware.js → client/src/annoMatrix/middleware.ts
+8 -6
View File
@@ -11,7 +11,7 @@ Undoable metareducer and the AnnoMatrix private API. It would be helpful
to make the Undoable interface better factored.
*/
const annoMatrixGC = (store) => (next) => (action) => {
const annoMatrixGC = (store: any) => (next: any) => (action: any) => {
if (_itIsTimeForGC()) {
_doGC(store);
}
@@ -34,7 +34,7 @@ function _itIsTimeForGC() {
return false;
}
function _doGC(store) {
function _doGC(store: any) {
const state = store.getState();
// these should probably be a function imported from undoable.js, etc, as
@@ -43,8 +43,8 @@ function _doGC(store) {
const undoableFuture = state["@@undoable/future"];
const undoableStack = undoablePast
.concat(undoableFuture)
.flatMap((snapshot) =>
snapshot.filter((v) => v[0] === "annoMatrix").map((v) => v[1])
.flatMap((snapshot: any) =>
snapshot.filter((v: any) => v[0] === "annoMatrix").map((v: any) => v[1])
);
const currentAnnoMatrix = state.annoMatrix;
@@ -53,14 +53,16 @@ function _doGC(store) {
as our current gc algo is more aggressive with those not hot.
*/
const allAnnoMatrices = new Map(
undoableStack.map((m) => [m, { isHot: false }])
undoableStack.map((m: any) => [m, { isHot: false }])
);
let am = currentAnnoMatrix;
while (am) {
allAnnoMatrices.set(am, { isHot: true });
am = am.viewOf;
}
allAnnoMatrices.forEach((hints, annoMatrix) => annoMatrix._gc(hints));
allAnnoMatrices.forEach((hints, annoMatrix) =>
(annoMatrix as any)._gc(hints)
);
}
export default annoMatrixGC;
client/src/annoMatrix/query.js → client/src/annoMatrix/query.ts
+10 -10
View File
@@ -10,7 +10,7 @@ import { _dubEncURIComp } from "./fetchHelpers";
* @param {object | string} query - the query
* @returns {object | string} - the normalized query
*/
export function _queryValidate(query) {
export function _queryValidate(query: any) {
if (typeof query !== "object") return query;
if (query.where && query.summarize)
@@ -40,11 +40,11 @@ export function _queryValidate(query) {
throw new Error("query must specify one of where or summarize");
}
export function _expectSimpleQuery(query) {
export function _expectSimpleQuery(query: any) {
if (typeof query === "object") throw new Error("expected simple query");
}
export function _expectComplexQuery(query) {
export function _expectComplexQuery(query: any) {
if (typeof query !== "object") throw new Error("expected complex query");
}
@@ -55,7 +55,7 @@ export function _expectComplexQuery(query) {
* @param {string|object} query
* @returns the key
*/
export function _queryCacheKey(field, query) {
export function _queryCacheKey(field: any, query: any) {
if (typeof query === "object") {
// complex query
if (query.where) {
@@ -84,22 +84,22 @@ export function _queryCacheKey(field, query) {
return `${field}/${query}`;
}
function _urlEncodeWhereQuery(q) {
function _urlEncodeWhereQuery(q: any) {
const { field: queryField, column: queryColumn, value: queryValue } = q;
return `${_dubEncURIComp(queryField)}:${_dubEncURIComp(
queryColumn
)}=${_dubEncURIComp(queryValue)}`;
}
function _urlEncodeSummarizeQuery(q) {
function _urlEncodeSummarizeQuery(q: any) {
const { method, field, column, values } = q;
const filter = values
.map((value) => _urlEncodeWhereQuery({ field, column, value }))
.map((value: any) => _urlEncodeWhereQuery({ field, column, value }))
.join("&");
return `method=${method}&${filter}`;
}
export function _urlEncodeComplexQuery(q) {
export function _urlEncodeComplexQuery(q: any) {
if (typeof q === "object") {
if (q.where) {
return _urlEncodeWhereQuery(q.where);
@@ -111,7 +111,7 @@ export function _urlEncodeComplexQuery(q) {
throw new Error("Unrecognized complex query type");
}
export function _urlEncodeLabelQuery(colKey, q) {
export function _urlEncodeLabelQuery(colKey: any, q: any) {
if (!colKey) throw new Error("Unsupported query by name");
if (typeof q !== "string") throw new Error("Query must be a simple label.");
return `${colKey}=${encodeURIComponent(q)}`;
@@ -120,7 +120,7 @@ export function _urlEncodeLabelQuery(colKey, q) {
/**
* Generate the column key the server will send us for this query.
*/
export function _hashStringValues(arrayOfString) {
export function _hashStringValues(arrayOfString: any) {
const hash = sha1(arrayOfString.join(""));
return hash;
}
client/src/annoMatrix/schema.js → client/src/annoMatrix/schema.ts
+13 -5
View File
@@ -4,7 +4,7 @@ Private helper functions related to schema
import catLabelSort from "../util/catLabelSort";
import { unassignedCategoryLabel } from "../globals";
export function _getColumnSchema(schema, field, col) {
export function _getColumnSchema(schema: any, field: any, col: any) {
/* look up the column definition */
switch (field) {
case "obs":
@@ -26,7 +26,7 @@ export function _getColumnSchema(schema, field, col) {
}
}
export function _getColumnDimensionNames(schema, field, col) {
export function _getColumnDimensionNames(schema: any, field: any, col: any) {
/*
field/col may be an alias for multiple columns. Currently used to map ND
values to 1D dataframe columns for embeddings/layout. Signified by the presence
@@ -39,6 +39,7 @@ export function _getColumnDimensionNames(schema, field, col) {
return colSchema.dims || [col];
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'schema' implicitly has an 'any' type.
export function _schemaColumns(schema, field) {
switch (field) {
case "obs":
@@ -52,18 +53,25 @@ export function _schemaColumns(schema, field) {
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'schema' implicitly has an 'any' type.
export function _getWritableColumns(schema, field) {
if (field !== "obs") return [];
return schema.annotations.obs.columns
.filter((v) => v.writable)
.map((v) => v.name);
return (
schema.annotations.obs.columns
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'v' implicitly has an 'any' type.
.filter((v) => v.writable)
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'v' implicitly has an 'any' type.
.map((v) => v.name)
);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'schema' implicitly has an 'any' type.
export function _isContinuousType(schema) {
const { type } = schema;
return !(type === "string" || type === "boolean" || type === "categorical");
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colSchema' implicitly has an 'any' type... Remove this comment to see the full error message
export function _normalizeCategoricalSchema(colSchema, col) {
const { type, writable } = colSchema;
if (
client/src/annoMatrix/viewCreators.js → client/src/annoMatrix/viewCreators.ts
+6 -1
View File
@@ -5,7 +5,7 @@ instances of AnnoMatrix, implementing common UI functions.
import { AnnoMatrixRowSubsetView, AnnoMatrixClipView } from "./views";
export function isubsetMask(annoMatrix, obsMask) {
export function isubsetMask(annoMatrix: any, obsMask: any) {
/*
Subset annomatrix to contain the rows which have truish value in the mask.
Maks length must equal annoMatrix.nObs (row count).
@@ -13,6 +13,7 @@ export function isubsetMask(annoMatrix, obsMask) {
return isubset(annoMatrix, _maskToList(obsMask));
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
export function isubset(annoMatrix, obsOffsets) {
/*
Subset annomatrix to contain the positions contained in the obsOffsets array
@@ -25,6 +26,7 @@ export function isubset(annoMatrix, obsOffsets) {
return new AnnoMatrixRowSubsetView(annoMatrix, obsIndex);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
export function subset(annoMatrix, obsLabels) {
/*
subset based on labels
@@ -33,6 +35,7 @@ export function subset(annoMatrix, obsLabels) {
return new AnnoMatrixRowSubsetView(annoMatrix, obsIndex);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
export function subsetByIndex(annoMatrix, obsIndex) {
/*
subset based upon the new obs index.
@@ -40,6 +43,7 @@ export function subsetByIndex(annoMatrix, obsIndex) {
return new AnnoMatrixRowSubsetView(annoMatrix, obsIndex);
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'annoMatrix' implicitly has an 'any' typ... Remove this comment to see the full error message
export function clip(annoMatrix, qmin, qmax) {
/*
Create a view that clips all continuous data to the [min, max] range.
@@ -53,6 +57,7 @@ export function clip(annoMatrix, qmin, qmax) {
Private utility functions below
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'mask' implicitly has an 'any' type.
function _maskToList(mask) {
/* convert masks to lists - method wastes space, but is fast */
if (!mask) {
client/src/annoMatrix/views.js → client/src/annoMatrix/views.ts
+26 -13
View File
@@ -9,21 +9,26 @@ import { _whereCacheCreate } from "./whereCache";
import { _isContinuousType, _getColumnSchema } from "./schema";
class AnnoMatrixView extends AnnoMatrix {
constructor(viewOf, rowIndex = null) {
constructor(viewOf: any, rowIndex = null) {
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
const nObs = rowIndex ? rowIndex.size() : viewOf.nObs;
super(viewOf.schema, nObs, viewOf.nVar, rowIndex || viewOf.rowIndex);
this.viewOf = viewOf;
this.isView = true;
}
addObsAnnoCategory(col, category) {
addObsAnnoCategory(col: any, category: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = this.viewOf.addObsAnnoCategory(col, category);
newAnnoMatrix.schema = newAnnoMatrix.viewOf.schema;
return newAnnoMatrix;
}
async removeObsAnnoCategory(col, category, unassignedCategory) {
async removeObsAnnoCategory(
col: any,
category: any,
unassignedCategory: any
) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = await this.viewOf.removeObsAnnoCategory(
col,
@@ -34,7 +39,7 @@ class AnnoMatrixView extends AnnoMatrix {
return newAnnoMatrix;
}
dropObsColumn(col) {
dropObsColumn(col: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = this.viewOf.dropObsColumn(col);
newAnnoMatrix._cache.obs = this._cache.obs.dropCol(col);
@@ -42,21 +47,21 @@ class AnnoMatrixView extends AnnoMatrix {
return newAnnoMatrix;
}
addObsColumn(colSchema, Ctor, value) {
addObsColumn(colSchema: any, Ctor: any, value: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = this.viewOf.addObsColumn(colSchema, Ctor, value);
newAnnoMatrix.schema = newAnnoMatrix.viewOf.schema;
return newAnnoMatrix;
}
renameObsColumn(oldCol, newCol) {
renameObsColumn(oldCol: any, newCol: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = this.viewOf.renameObsColumn(oldCol, newCol);
newAnnoMatrix.schema = newAnnoMatrix.viewOf.schema;
return newAnnoMatrix;
}
async setObsColumnValues(col, rowLabels, value) {
async setObsColumnValues(col: any, rowLabels: any, value: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = await this.viewOf.setObsColumnValues(
col,
@@ -68,7 +73,7 @@ class AnnoMatrixView extends AnnoMatrix {
return newAnnoMatrix;
}
async resetObsColumnValues(col, oldValue, newValue) {
async resetObsColumnValues(col: any, oldValue: any, newValue: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = await this.viewOf.resetObsColumnValues(
col,
@@ -80,7 +85,7 @@ class AnnoMatrixView extends AnnoMatrix {
return newAnnoMatrix;
}
addEmbedding(colSchema) {
addEmbedding(colSchema: any) {
const newAnnoMatrix = this._clone();
newAnnoMatrix.viewOf = this.viewOf.addEmbedding(colSchema);
newAnnoMatrix.schema = newAnnoMatrix.viewOf.schema;
@@ -92,17 +97,20 @@ class AnnoMatrixMapView extends AnnoMatrixView {
/*
A view which knows how to transform its data.
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'viewOf' implicitly has an 'any' type.
constructor(viewOf, mapFn) {
super(viewOf);
this.mapFn = mapFn;
(this as any).mapFn = mapFn;
}
// @ts-expect-error ts-migrate(2416) FIXME: Property '_doLoad' in type 'AnnoMatrixMapView' is ... Remove this comment to see the full error message
async _doLoad(field, query) {
const df = await this.viewOf._fetch(field, query);
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'colData' implicitly has an 'any' type.
const dfMapped = df.mapColumns((colData, colIdx) => {
const colLabel = df.colIndex.getLabel(colIdx);
const colSchema = _getColumnSchema(this.schema, field, colLabel);
return this.mapFn(field, colLabel, colSchema, colData, df);
return (this as any).mapFn(field, colLabel, colSchema, colData, df);
});
const whereCacheUpdate = _whereCacheCreate(
field,
@@ -117,12 +125,14 @@ export class AnnoMatrixClipView extends AnnoMatrixMapView {
/*
A view which is a clipped transformation of its parent
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'viewOf' implicitly has an 'any' type.
constructor(viewOf, qmin, qmax) {
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
super(viewOf, (field, colLabel, colSchema, colData, df) =>
_clipAnnoMatrix(field, colLabel, colSchema, colData, df, qmin, qmax)
);
this.isClipped = true;
this.clipRange = [qmin, qmax];
(this as any).isClipped = true;
(this as any).clipRange = [qmin, qmax];
Object.seal(this);
}
}
@@ -131,11 +141,13 @@ export class AnnoMatrixRowSubsetView extends AnnoMatrixView {
/*
A view which is a subset of total rows.
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'viewOf' implicitly has an 'any' type.
constructor(viewOf, rowIndex) {
super(viewOf, rowIndex);
Object.seal(this);
}
// @ts-expect-error ts-migrate(2416) FIXME: Property '_doLoad' in type 'AnnoMatrixRowSubsetVie... Remove this comment to see the full error message
async _doLoad(field, query) {
const df = await this.viewOf._fetch(field, query);
@@ -158,6 +170,7 @@ export class AnnoMatrixRowSubsetView extends AnnoMatrixView {
Utility functions below
*/
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
function _clipAnnoMatrix(field, colLabel, colSchema, colData, df, qmin, qmax) {
/* only clip obs and var scalar columns */
if (field !== "obs" && field !== "X") return colData;
client/src/annoMatrix/whereCache.js → client/src/annoMatrix/whereCache.ts
+12 -2
View File
@@ -51,7 +51,12 @@ creates a cache entry of:
import { _getColumnDimensionNames } from "./schema";
import { _hashStringValues } from "./query";
export function _whereCacheGet(whereCache, schema, field, query) {
export function _whereCacheGet(
whereCache: any,
schema: any,
field: any,
query: any
) {
/*
query will either be an where query (object) or a column name (string).
@@ -85,6 +90,7 @@ export function _whereCacheGet(whereCache, schema, field, query) {
return _getColumnDimensionNames(schema, field, query) ?? [undefined];
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'field' implicitly has an 'any' type.
export function _whereCacheCreate(field, query, columnLabels) {
/*
Create a new whereCache
@@ -131,10 +137,11 @@ export function _whereCacheCreate(field, query, columnLabels) {
return {};
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'dst' implicitly has an 'any' type.
function __mergeQueries(dst, src) {
for (const [queryField, columnMap] of Object.entries(src)) {
dst[queryField] = dst[queryField] || new Map();
for (const [queryColumn, valueMap] of columnMap) {
for (const [queryColumn, valueMap] of columnMap as any) {
if (!dst[queryField].has(queryColumn))
dst[queryField].set(queryColumn, new Map());
for (const [queryValue, columnLabels] of valueMap) {
@@ -144,6 +151,7 @@ function __mergeQueries(dst, src) {
}
}
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'dst' implicitly has an 'any' type.
function __whereCacheMerge(dst, src) {
/*
merge src into dst (modifies dst)
@@ -161,6 +169,7 @@ function __whereCacheMerge(dst, src) {
dst.summarize = dst.summarize || {};
for (const [field, method] of Object.entries(src.summarize)) {
dst.summarize[field] = dst.summarize[field] || {};
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
for (const [methodName, query] of Object.entries(method)) {
dst.summarize[field][methodName] =
dst.summarize[field][methodName] || {};
@@ -171,6 +180,7 @@ function __whereCacheMerge(dst, src) {
return dst;
}
// @ts-expect-error ts-migrate(7019) FIXME: Rest parameter 'caches' implicitly has an 'any[]' ... Remove this comment to see the full error message
export function _whereCacheMerge(...caches) {
return caches.reduce(__whereCacheMerge, {});
}
client/src/components/annoDialog.js → client/src/components/annoDialog.tsx
+21 -2
View File
@@ -1,30 +1,49 @@
import React from "react";
import { Button, Tooltip, Dialog, Classes, Colors } from "@blueprintjs/core";
class AnnoDialog extends React.PureComponent {
constructor(props) {
type State = any;
class AnnoDialog extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {};
}
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isActive' does not exist on type 'Readon... Remove this comment to see the full error message
isActive,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'text' does not exist on type 'Readonly<{... Remove this comment to see the full error message
text,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'title' does not exist on type 'Readonly<... Remove this comment to see the full error message
title,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'instruction' does not exist on type 'Rea... Remove this comment to see the full error message
instruction,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'cancelTooltipContent' does not exist on ... Remove this comment to see the full error message
cancelTooltipContent,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'errorMessage' does not exist on type 'Re... Remove this comment to see the full error message
errorMessage,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'validationError' does not exist on type ... Remove this comment to see the full error message
validationError,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoSelect' does not exist on type 'Read... Remove this comment to see the full error message
annoSelect,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoInput' does not exist on type 'Reado... Remove this comment to see the full error message
annoInput,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'secondaryInstructions' does not exist on... Remove this comment to see the full error message
secondaryInstructions,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'secondaryInput' does not exist on type '... Remove this comment to see the full error message
secondaryInput,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleCancel' does not exist on type 'Re... Remove this comment to see the full error message
handleCancel,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleSubmit' does not exist on type 'Re... Remove this comment to see the full error message
handleSubmit,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'primaryButtonText' does not exist on typ... Remove this comment to see the full error message
primaryButtonText,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'secondaryButtonText' does not exist on t... Remove this comment to see the full error message
secondaryButtonText,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleSecondaryButtonSubmit' does not ex... Remove this comment to see the full error message
handleSecondaryButtonSubmit,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'primaryButtonProps' does not exist on ty... Remove this comment to see the full error message
primaryButtonProps,
} = this.props;
client/src/components/app.js → client/src/components/app.tsx
+11 -7
View File
@@ -15,30 +15,32 @@ import TermsOfServicePrompt from "./termsPrompt";
import actions from "../actions";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
loading: state.controls.loading,
error: state.controls.error,
graphRenderCounter: state.controls.graphRenderCounter,
loading: (state as any).controls.loading,
error: (state as any).controls.error,
graphRenderCounter: (state as any).controls.graphRenderCounter,
}))
class App extends React.Component {
componentDidMount() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
/* listen for url changes, fire one when we start the app up */
window.addEventListener("popstate", this._onURLChanged);
this._onURLChanged();
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
dispatch(actions.doInitialDataLoad(window.location.search));
this.forceUpdate();
}
_onURLChanged() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({ type: "url changed", url: document.location.href });
}
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'loading' does not exist on type 'Readonl... Remove this comment to see the full error message
const { loading, error, graphRenderCounter } = this.props;
return (
<Container>
@@ -70,13 +72,15 @@ class App extends React.Component {
{loading || error ? null : (
<Layout>
<LeftSideBar />
{(viewportRef) => (
{(viewportRef: any) => (
<>
<MenuBar />
<Embedding />
<Autosave />
<TermsOfServicePrompt />
{/* @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call. */}
<Legend viewportRef={viewportRef} />
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ key: any; viewportRef: any; }' is not assi... Remove this comment to see the full error message */}
<Graph key={graphRenderCounter} viewportRef={viewportRef} />
</>
)}
client/src/components/autosave/filenameDialog.js → client/src/components/autosave/filenameDialog.tsx
+32 -18
View File
@@ -11,18 +11,23 @@ import {
Tooltip,
} from "@blueprintjs/core";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
idhash: state.config?.parameters?.["annotations-user-data-idhash"] ?? null,
annotations: state.annotations,
auth: state.config?.authentication,
userInfo: state.userInfo,
writableCategoriesEnabled: state.config?.parameters?.annotations ?? false,
idhash:
(state as any).config?.parameters?.["annotations-user-data-idhash"] ?? null,
annotations: (state as any).annotations,
auth: (state as any).config?.authentication,
userInfo: (state as any).userInfo,
writableCategoriesEnabled:
(state as any).config?.parameters?.annotations ?? false,
writableGenesetsEnabled: !(
state.config?.parameters?.annotations_genesets_readonly ?? true
(state as any).config?.parameters?.annotations_genesets_readonly ?? true
),
}))
class FilenameDialog extends React.Component {
constructor(props) {
class FilenameDialog extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
filenameText: "",
@@ -32,9 +37,9 @@ class FilenameDialog extends React.Component {
dismissFilenameDialog = () => {};
handleCreateFilename = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
const { filenameText } = this.state;
dispatch({
type: "set annotations collection name",
data: filenameText,
@@ -45,26 +50,26 @@ class FilenameDialog extends React.Component {
const legalNames = /^\w+$/;
const { filenameText } = this.state;
let err = false;
if (filenameText === "") {
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'boolean'.
err = "empty_string";
} else if (!legalNames.test(filenameText)) {
/*
IMPORTANT: this test must ultimately match the test applied by the
backend, which is designed to ensure a safe file name can be created
from the data collection name. If you change this, you will also need
to change the validation code in the backend, or it will have no effect.
*/
IMPORTANT: this test must ultimately match the test applied by the
backend, which is designed to ensure a safe file name can be created
from the data collection name. If you change this, you will also need
to change the validation code in the backend, or it will have no effect.
*/
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'boolean'.
err = "characters";
}
return err;
};
filenameErrorMessage = () => {
const err = this.filenameError();
let markup = null;
// @ts-expect-error ts-migrate(2367) FIXME: This condition will always return 'false' since th... Remove this comment to see the full error message
if (err === "empty_string") {
markup = (
<span
@@ -78,6 +83,7 @@ class FilenameDialog extends React.Component {
Name cannot be blank
</span>
);
// @ts-expect-error ts-migrate(2367) FIXME: This condition will always return 'false' since th... Remove this comment to see the full error message
} else if (err === "characters") {
markup = (
<span
@@ -97,14 +103,18 @@ class FilenameDialog extends React.Component {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableCategoriesEnabled' does not exis... Remove this comment to see the full error message
writableCategoriesEnabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableGenesetsEnabled' does not exist ... Remove this comment to see the full error message
writableGenesetsEnabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annotations' does not exist on type 'Rea... Remove this comment to see the full error message
annotations,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'idhash' does not exist on type 'Readonly... Remove this comment to see the full error message
idhash,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'userInfo' does not exist on type 'Readon... Remove this comment to see the full error message
userInfo,
} = this.props;
const { filenameText } = this.state;
return (writableCategoriesEnabled || writableGenesetsEnabled) &&
annotations.promptForFilename &&
!annotations.dataCollectionNameIsReadOnly &&
@@ -128,6 +138,7 @@ class FilenameDialog extends React.Component {
<InputGroup
autoFocus
value={filenameText}
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
intent={this.filenameError(filenameText) ? "warning" : "none"}
onChange={(e) =>
this.setState({ filenameText: e.target.value })
@@ -138,12 +149,14 @@ class FilenameDialog extends React.Component {
<p
style={{
marginTop: 7,
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
visibility: this.filenameError(filenameText)
? "visible"
: "hidden",
color: Colors.ORANGE3,
}}
>
{/* @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1. */}
{this.filenameErrorMessage(filenameText)}
</p>
</div>
@@ -171,6 +184,7 @@ class FilenameDialog extends React.Component {
<Button onClick={this.dismissFilenameDialog}>Cancel</Button>
</Tooltip>
<Button
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
disabled={!filenameText || this.filenameError(filenameText)}
onClick={this.handleCreateFilename}
intent="primary"
client/src/components/autosave/index.js → client/src/components/autosave/index.tsx
+30 -15
View File
@@ -3,23 +3,30 @@ import { connect } from "react-redux";
import actions from "../../actions";
import FilenameDialog from "./filenameDialog";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
annotations: (state as any).annotations,
obsAnnotationSaveInProgress:
state.autosave?.obsAnnotationSaveInProgress ?? false,
genesetSaveInProgress: state.autosave?.genesetSaveInProgress ?? false,
error: state.autosave?.error,
writableCategoriesEnabled: state.config?.parameters?.annotations ?? false,
(state as any).autosave?.obsAnnotationSaveInProgress ?? false,
genesetSaveInProgress:
(state as any).autosave?.genesetSaveInProgress ?? false,
error: (state as any).autosave?.error,
writableCategoriesEnabled:
(state as any).config?.parameters?.annotations ?? false,
writableGenesetsEnabled: !(
state.config?.parameters?.annotations_genesets_readonly ?? true
(state as any).config?.parameters?.annotations_genesets_readonly ?? true
),
annoMatrix: state.annoMatrix,
genesets: state.genesets,
lastSavedAnnoMatrix: state.autosave?.lastSavedAnnoMatrix,
lastSavedGenesets: state.autosave?.lastSavedGenesets,
annoMatrix: (state as any).annoMatrix,
genesets: (state as any).genesets,
lastSavedAnnoMatrix: (state as any).autosave?.lastSavedAnnoMatrix,
lastSavedGenesets: (state as any).autosave?.lastSavedGenesets,
}))
class Autosave extends React.Component {
constructor(props) {
class Autosave extends React.Component<{}, State> {
clearInterval: any;
constructor(props: {}) {
super(props);
this.state = {
timer: null,
@@ -27,8 +34,8 @@ class Autosave extends React.Component {
}
componentDidMount() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableCategoriesEnabled' does not exis... Remove this comment to see the full error message
const { writableCategoriesEnabled, writableGenesetsEnabled } = this.props;
let { timer } = this.state;
if (timer) clearInterval(timer);
if (writableCategoriesEnabled || writableGenesetsEnabled) {
@@ -46,8 +53,11 @@ class Autosave extends React.Component {
tick = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsAnnotationSaveInProgress' does not ex... Remove this comment to see the full error message
obsAnnotationSaveInProgress,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesetSaveInProgress' does not exist on... Remove this comment to see the full error message
genesetSaveInProgress,
} = this.props;
if (!obsAnnotationSaveInProgress && this.needToSaveObsAnnotations()) {
@@ -60,12 +70,14 @@ class Autosave extends React.Component {
needToSaveObsAnnotations = () => {
/* return true if we need to save obs cell labels, false if we don't */
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, lastSavedAnnoMatrix } = this.props;
return actions.needToSaveObsAnnotations(annoMatrix, lastSavedAnnoMatrix);
};
needToSaveGenesets = () => {
/* return true if we need to save gene ses, false if we do not */
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesets' does not exist on type 'Readon... Remove this comment to see the full error message
const { genesets, lastSavedGenesets } = this.props;
return genesets.initialized && genesets.genesets !== lastSavedGenesets;
};
@@ -75,11 +87,13 @@ class Autosave extends React.Component {
}
saveInProgress() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsAnnotationSaveInProgress' does not ex... Remove this comment to see the full error message
const { obsAnnotationSaveInProgress, genesetSaveInProgress } = this.props;
return obsAnnotationSaveInProgress || genesetSaveInProgress;
}
statusMessage() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'error' does not exist on type 'Readonly<... Remove this comment to see the full error message
const { error } = this.props;
if (error) {
return `Autosave error: ${error}`;
@@ -89,14 +103,15 @@ class Autosave extends React.Component {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableCategoriesEnabled' does not exis... Remove this comment to see the full error message
writableCategoriesEnabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableGenesetsEnabled' does not exist ... Remove this comment to see the full error message
writableGenesetsEnabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'lastSavedAnnoMatrix' does not exist on t... Remove this comment to see the full error message
lastSavedAnnoMatrix,
} = this.props;
const initialDataLoadComplete = lastSavedAnnoMatrix;
if (!writableCategoriesEnabled && !writableGenesetsEnabled) return null;
return (
<div
id="autosave"
client/src/components/brushableHistogram/error.js → client/src/components/brushableHistogram/error.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import React from "react";
import * as globals from "../../globals";
const ErrorLoading = ({ displayName, zebra }) => {
const ErrorLoading = ({ displayName, zebra }: any) => {
return (
<div
style={{
client/src/components/brushableHistogram/footer.js → client/src/components/brushableHistogram/footer.tsx
+8
View File
@@ -2,13 +2,21 @@ import React from "react";
const HistogramFooter = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'displayName' does not exist on type '{ c... Remove this comment to see the full error message
displayName,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'hideRanges' does not exist on type '{ ch... Remove this comment to see the full error message
hideRanges,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'rangeMin' does not exist on type '{ chil... Remove this comment to see the full error message
rangeMin,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'rangeMax' does not exist on type '{ chil... Remove this comment to see the full error message
rangeMax,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'rangeColorMin' does not exist on type '{... Remove this comment to see the full error message
rangeColorMin,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'rangeColorMax' does not exist on type '{... Remove this comment to see the full error message
rangeColorMax,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type '{ childre... Remove this comment to see the full error message
isObs,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isGeneSetSummary' does not exist on type... Remove this comment to see the full error message
isGeneSetSummary,
}) => {
/*
client/src/components/brushableHistogram/header.js → client/src/components/brushableHistogram/header.tsx
+9
View File
@@ -5,14 +5,23 @@ import * as globals from "../../globals";
const HistogramHeader = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'fieldId' does not exist on type '{ child... Remove this comment to see the full error message
fieldId,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorBy' does not exist on type '{ chi... Remove this comment to see the full error message
isColorBy,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onColorByClick' does not exist on type '... Remove this comment to see the full error message
onColorByClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onRemoveClick' does not exist on type '{... Remove this comment to see the full error message
onRemoveClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterPlotX' does not exist on type '... Remove this comment to see the full error message
isScatterPlotX,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterPlotY' does not exist on type '... Remove this comment to see the full error message
isScatterPlotY,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onScatterPlotXClick' does not exist on t... Remove this comment to see the full error message
onScatterPlotXClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onScatterPlotYClick' does not exist on t... Remove this comment to see the full error message
onScatterPlotYClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type '{ childre... Remove this comment to see the full error message
isObs,
}) => {
/*
client/src/components/brushableHistogram/histogram.js → client/src/components/brushableHistogram/histogram.tsx
+14 -3
View File
@@ -18,7 +18,7 @@ const Histogram = ({
isColorBy,
selectionRange,
mini,
}) => {
}: any) => {
const svgRef = useRef(null);
const [brush, setBrush] = useState(null);
@@ -69,14 +69,18 @@ const Histogram = ({
.data(bins)
.enter()
.append("rect")
// @ts-expect-error ts-migrate(6133) FIXME: 'd' is declared but its value is never read.
.attr("x", (d, i) => x(binStart(i)) + 1)
.attr("y", (d) => y(d))
// @ts-expect-error ts-migrate(6133) FIXME: 'd' is declared but its value is never read.
.attr("width", (d, i) => x(binEnd(i)) - x(binStart(i)) - binPadding)
.attr("height", (d) => y(0) - y(d))
.style(
"fill",
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
isColorBy
? (d, i) => colorScale(histogramScale(binStart(i)))
? // @ts-expect-error ts-migrate(6133) FIXME: 'd' is declared but its value is never read.
(d: any, i: any) => colorScale(histogramScale(binStart(i)))
: defaultBarColor
);
}
@@ -101,6 +105,7 @@ const Histogram = ({
const brushXselection = container
.insert("g")
.attr("class", "brush")
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
.attr("data-testid", `${svgRef.current.dataset.testid}-brushable-area`)
.call(brushX);
@@ -113,6 +118,7 @@ const Histogram = ({
d3
.axisBottom(x)
.ticks(4)
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
.tickFormat(d3.format(maybeScientific(x)))
);
@@ -126,8 +132,9 @@ const Histogram = ({
.axisRight(y)
.ticks(3)
.tickFormat(
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
d3.format(
y.domain().some((n) => Math.abs(n) >= 10000) ? ".0e" : ","
y.domain().some((n: any) => Math.abs(n) >= 10000) ? ".0e" : ","
)
)
);
@@ -137,6 +144,7 @@ const Histogram = ({
svg.selectAll(".axis path").style("stroke", "rgb(230,230,230)");
svg.selectAll(".axis line").style("stroke", "rgb(230,230,230)");
// @ts-expect-error ts-migrate(2345) FIXME: Argument of type '{ brushX: d3.BrushBehavior<unkno... Remove this comment to see the full error message
setBrush({ brushX, brushXselection });
}
}, [histogram, isColorBy]);
@@ -146,6 +154,7 @@ const Histogram = ({
paint/update selection brush
*/
if (!brush) return;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'brushX' does not exist on type 'null'.
const { brushX, brushXselection } = brush;
const selection = d3.brushSelection(brushXselection.node());
if (!selectionRange && selection) {
@@ -162,7 +171,9 @@ const Histogram = ({
} else {
/* there is an active selection and a brush - make sure they match */
const moveDeltaThreshold = 1;
// @ts-expect-error ts-migrate(2363) FIXME: The right-hand side of an arithmetic operation mus... Remove this comment to see the full error message
const dX0 = Math.abs(x0 - selection[0]);
// @ts-expect-error ts-migrate(2363) FIXME: The right-hand side of an arithmetic operation mus... Remove this comment to see the full error message
const dX1 = Math.abs(x1 - selection[1]);
/*
only update the brush if it is grossly incorrect,
client/src/components/brushableHistogram/index.js → client/src/components/brushableHistogram/index.tsx
+95 -58
View File
@@ -29,27 +29,31 @@ const MARGIN_MINI = {
const WIDTH_MINI = 120 - MARGIN_MINI.LEFT - MARGIN_MINI.RIGHT;
const HEIGHT_MINI = 15 - MARGIN_MINI.TOP - MARGIN_MINI.BOTTOM;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state, ownProps) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type '{}'.
const { isObs, isUserDefined, isGeneSetSummary, field } = ownProps;
const myName = makeContinuousDimensionName(
{ isObs, isUserDefined, isGeneSetSummary },
field
);
return {
annoMatrix: state.annoMatrix,
isScatterplotXXaccessor: state.controls.scatterplotXXaccessor === field,
isScatterplotYYaccessor: state.controls.scatterplotYYaccessor === field,
continuousSelectionRange: state.continuousSelection[myName],
isColorAccessor: state.colors.colorAccessor === field,
annoMatrix: (state as any).annoMatrix,
isScatterplotXXaccessor:
(state as any).controls.scatterplotXXaccessor === field,
isScatterplotYYaccessor:
(state as any).controls.scatterplotYYaccessor === field,
continuousSelectionRange: (state as any).continuousSelection[myName],
isColorAccessor: (state as any).colors.colorAccessor === field,
};
})
class HistogramBrush extends React.PureComponent {
static watchAsync(props, prevProps) {
static watchAsync(props: any, prevProps: any) {
return !shallowEqual(props.watchProps, prevProps.watchProps);
}
/* memoized closure to prevent HistogramHeader unecessary repaint */
handleColorAction = memoize((dispatch) => (field, isObs) => {
handleColorAction = memoize((dispatch) => (field: any, isObs: any) => {
if (isObs) {
dispatch({
type: "color by continuous metadata",
@@ -60,25 +64,31 @@ class HistogramBrush extends React.PureComponent {
}
});
onBrush = (selection, x, eventType) => {
// @ts-expect-error ts-migrate(6133) FIXME: 'selection' is declared but its value is never rea... Remove this comment to see the full error message
onBrush = (selection: any, x: any, eventType: any) => {
const type = `continuous metadata histogram ${eventType}`;
return () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'field' does not exist on type 'Readonly<... Remove this comment to see the full error message
field,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type 'Readonly<... Remove this comment to see the full error message
isObs,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserDefined' does not exist on type 'R... Remove this comment to see the full error message
isUserDefined,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isGeneSetSummary' does not exist on type... Remove this comment to see the full error message
isGeneSetSummary,
} = this.props;
// ignore programmatically generated events
if (!d3.event.sourceEvent) return;
if (!(d3 as any).event.sourceEvent) return;
// ignore cascading events, which are programmatically generated
if (d3.event.sourceEvent.sourceEvent) return;
if ((d3 as any).event.sourceEvent.sourceEvent) return;
const query = this.createQuery();
const range = d3.event.selection
? [x(d3.event.selection[0]), x(d3.event.selection[1])]
const range = (d3 as any).event.selection
? [x((d3 as any).event.selection[0]), x((d3 as any).event.selection[1])]
: null;
const otherProps = {
selection: field,
@@ -94,42 +104,52 @@ class HistogramBrush extends React.PureComponent {
};
};
onBrushEnd = (selection, x) => {
// @ts-expect-error ts-migrate(6133) FIXME: 'selection' is declared but its value is never rea... Remove this comment to see the full error message
onBrushEnd = (selection: any, x: any) => {
return () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'field' does not exist on type 'Readonly<... Remove this comment to see the full error message
field,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type 'Readonly<... Remove this comment to see the full error message
isObs,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserDefined' does not exist on type 'R... Remove this comment to see the full error message
isUserDefined,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isGeneSetSummary' does not exist on type... Remove this comment to see the full error message
isGeneSetSummary,
} = this.props;
const minAllowedBrushSize = 10;
const smallAmountToAvoidInfiniteLoop = 0.1;
// ignore programmatically generated events
if (!d3.event.sourceEvent) return;
if (!(d3 as any).event.sourceEvent) return;
// ignore cascading events, which are programmatically generated
if (d3.event.sourceEvent.sourceEvent) return;
if ((d3 as any).event.sourceEvent.sourceEvent) return;
let type;
let range = null;
if (d3.event.selection) {
if ((d3 as any).event.selection) {
type = "continuous metadata histogram end";
if (
d3.event.selection[1] - d3.event.selection[0] >
(d3 as any).event.selection[1] - (d3 as any).event.selection[0] >
minAllowedBrushSize
) {
range = [x(d3.event.selection[0]), x(d3.event.selection[1])];
range = [
x((d3 as any).event.selection[0]),
x((d3 as any).event.selection[1]),
];
} else {
/* the user selected range is too small and will be hidden #587, so take control of it procedurally */
/* https://stackoverflow.com/questions/12354729/d3-js-limit-size-of-brush */
const procedurallyResizedBrushWidth =
d3.event.selection[0] +
(d3 as any).event.selection[0] +
minAllowedBrushSize +
smallAmountToAvoidInfiniteLoop; //
range = [x(d3.event.selection[0]), x(procedurallyResizedBrushWidth)];
range = [
x((d3 as any).event.selection[0]),
x(procedurallyResizedBrushWidth),
];
}
} else {
type = "continuous metadata histogram cancel";
@@ -151,6 +171,7 @@ class HistogramBrush extends React.PureComponent {
};
handleSetGeneAsScatterplotX = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, field } = this.props;
dispatch({
type: "set scatterplot x",
@@ -159,6 +180,7 @@ class HistogramBrush extends React.PureComponent {
};
handleSetGeneAsScatterplotY = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, field } = this.props;
dispatch({
type: "set scatterplot y",
@@ -168,10 +190,15 @@ class HistogramBrush extends React.PureComponent {
removeHistogram = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'field' does not exist on type 'Readonly<... Remove this comment to see the full error message
field,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotXXaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotXXaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotYYaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotYYaccessor,
} = this.props;
dispatch({
@@ -198,11 +225,13 @@ class HistogramBrush extends React.PureComponent {
};
fetchAsyncProps = async () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, width } = this.props;
const { isClipped } = annoMatrix;
const query = this.createQuery();
// @ts-expect-error ts-migrate(2488) FIXME: Type 'any[] | null' must have a '[Symbol.iterator]... Remove this comment to see the full error message
const df = await annoMatrix.fetch(...query);
const column = df.icol(0);
@@ -261,7 +290,7 @@ class HistogramBrush extends React.PureComponent {
};
// eslint-disable-next-line class-methods-use-this -- instance method allows for memoization per annotation
calcHistogramCache(col, newMargin, newWidth, newHeight) {
calcHistogramCache(col: any, newMargin: any, newWidth: any, newHeight: any) {
/*
recalculate expensive stuff, notably bins, summaries, etc.
*/
@@ -269,35 +298,30 @@ class HistogramBrush extends React.PureComponent {
const summary = col.summarize(); /* this is memoized, so it's free the second time you call it */
const { min: domainMin, max: domainMax } = summary;
const numBins = 40;
const {
TOP: topMargin,
LEFT: leftMargin,
} = newMargin; /* changes with mini */
histogramCache.domain = [
domainMin,
domainMax,
]; /* doesn't change with mini */
histogramCache.x = d3
const { TOP: topMargin, LEFT: leftMargin } = newMargin;
(histogramCache as any).domain = [domainMin, domainMax];
/* doesn't change with mini */ (histogramCache as any).x = d3
.scaleLinear()
.domain([domainMin, domainMax])
.range([leftMargin, leftMargin + newWidth]);
histogramCache.bins = col.histogram(numBins, [
(histogramCache as any).bins = col.histogram(numBins, [
domainMin,
domainMax,
]); /* memoized */
]);
/* memoized */ (histogramCache as any).binWidth =
(domainMax - domainMin) / numBins;
histogramCache.binWidth = (domainMax - domainMin) / numBins;
(histogramCache as any).binStart = (i: any) =>
domainMin + i * (histogramCache as any).binWidth;
(histogramCache as any).binEnd = (i: any) =>
domainMin + (i + 1) * (histogramCache as any).binWidth;
histogramCache.binStart = (i) => domainMin + i * histogramCache.binWidth;
histogramCache.binEnd = (i) =>
domainMin + (i + 1) * histogramCache.binWidth;
const yMax = (histogramCache as any).bins.reduce((l: any, r: any) =>
l > r ? l : r
);
const yMax = histogramCache.bins.reduce((l, r) => (l > r ? l : r));
histogramCache.y = d3
(histogramCache as any).y = d3
.scaleLinear()
.domain([0, yMax])
.range([topMargin + newHeight, topMargin]);
@@ -306,13 +330,8 @@ class HistogramBrush extends React.PureComponent {
}
createQuery() {
const {
isObs,
isGeneSetSummary,
field,
setGenes,
annoMatrix,
} = this.props;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type 'Readonly<... Remove this comment to see the full error message
const { isObs, isGeneSetSummary, field, setGenes, annoMatrix } = this.props;
const { schema } = annoMatrix;
if (isObs) {
return ["obs", field];
@@ -349,21 +368,35 @@ class HistogramBrush extends React.PureComponent {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
annoMatrix,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'field' does not exist on type 'Readonly<... Remove this comment to see the full error message
field,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserDefined' does not exist on type 'R... Remove this comment to see the full error message
isUserDefined,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isGeneSetSummary' does not exist on type... Remove this comment to see the full error message
isGeneSetSummary,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotXXaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotXXaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotYYaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotYYaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'zebra' does not exist on type 'Readonly<... Remove this comment to see the full error message
zebra,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'continuousSelectionRange' does not exist... Remove this comment to see the full error message
continuousSelectionRange,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isObs' does not exist on type 'Readonly<... Remove this comment to see the full error message
isObs,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'mini' does not exist on type 'Readonly<{... Remove this comment to see the full error message
mini,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'setGenes' does not exist on type 'Readon... Remove this comment to see the full error message
setGenes,
} = this.props;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'width' does not exist on type 'Readonly<... Remove this comment to see the full error message
let { width } = this.props;
if (!width) {
width = mini ? WIDTH_MINI : WIDTH;
@@ -392,7 +425,7 @@ class HistogramBrush extends React.PureComponent {
</Async.Rejected>
<Async.Fulfilled>
{(asyncProps) =>
asyncProps.OK2Render ? (
(asyncProps as any).OK2Render ? (
<div
id={`histogram_${fieldForId}`}
data-testid={`histogram-${field}`}
@@ -404,6 +437,7 @@ class HistogramBrush extends React.PureComponent {
>
{!mini && isObs ? (
<HistogramHeader
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ fieldId: any; isColorBy: any; isObs: any; ... Remove this comment to see the full error message
fieldId={field}
isColorBy={isColorAccessor}
isObs={isObs}
@@ -422,9 +456,11 @@ class HistogramBrush extends React.PureComponent {
<Histogram
field={field}
fieldForId={fieldForId}
display={asyncProps.isSingleValue ? "none" : "block"}
display={(asyncProps as any).isSingleValue ? "none" : "block"}
histogram={
mini ? asyncProps.miniHistogram : asyncProps.histogram
mini
? (asyncProps as any).miniHistogram
: (asyncProps as any).histogram
}
width={width}
height={mini ? HEIGHT_MINI : HEIGHT}
@@ -437,14 +473,15 @@ class HistogramBrush extends React.PureComponent {
/>
{!mini && (
<HistogramFooter
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isGeneSetSummary: any; isObs: any; display... Remove this comment to see the full error message
isGeneSetSummary={isGeneSetSummary}
isObs={isObs}
displayName={field}
hideRanges={asyncProps.isSingleValue}
rangeMin={asyncProps.unclippedRange[0]}
rangeMax={asyncProps.unclippedRange[1]}
rangeColorMin={asyncProps.unclippedRangeColor[0]}
rangeColorMax={asyncProps.unclippedRangeColor[1]}
hideRanges={(asyncProps as any).isSingleValue}
rangeMin={(asyncProps as any).unclippedRange[0]}
rangeMax={(asyncProps as any).unclippedRange[1]}
rangeColorMin={(asyncProps as any).unclippedRangeColor[0]}
rangeColorMax={(asyncProps as any).unclippedRangeColor[1]}
/>
)}
</div>
client/src/components/brushableHistogram/loading.js → client/src/components/brushableHistogram/loading.tsx
+1 -1
View File
@@ -3,7 +3,7 @@ import { Button } from "@blueprintjs/core";
import * as globals from "../../globals";
const StillLoading = ({ zebra, displayName }) => {
const StillLoading = ({ zebra, displayName }: any) => {
/*
Render a loading indicator for the field.
*/
client/src/components/categorical/annoSelect.js → client/src/components/categorical/annoSelect.tsx
+9 -2
View File
@@ -2,16 +2,21 @@ import React from "react";
import { Button, MenuItem } from "@blueprintjs/core";
import { Select } from "@blueprintjs/select";
class DuplicateCategorySelect extends React.PureComponent {
constructor(props) {
type State = any;
class DuplicateCategorySelect extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {};
}
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'allCategoryNames' does not exist on type... Remove this comment to see the full error message
allCategoryNames,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryToDuplicate' does not exist on t... Remove this comment to see the full error message
categoryToDuplicate,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleModalDuplicateCategorySelection' d... Remove this comment to see the full error message
handleModalDuplicateCategorySelection,
} = this.props;
return (
@@ -31,7 +36,9 @@ class DuplicateCategorySelect extends React.PureComponent {
<MenuItem
data-testclass="duplicate-category-dropdown-option"
onClick={handleClick}
// @ts-expect-error ts-migrate(2322) FIXME: Type 'unknown' is not assignable to type 'Key | nu... Remove this comment to see the full error message
key={d}
// @ts-expect-error ts-migrate(2322) FIXME: Type 'unknown' is not assignable to type 'ReactNod... Remove this comment to see the full error message
text={d}
/>
);
client/src/components/categorical/category/annoDialogAddLabel.js → client/src/components/categorical/category/annoDialogAddLabel.tsx
+23 -14
View File
@@ -5,20 +5,24 @@ import LabelInput from "../../labelInput";
import { labelPrompt, isLabelErroneous } from "../labelUtil";
import actions from "../../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
schema: state.annoMatrix?.schema,
obsCrossfilter: state.obsCrossfilter,
annotations: (state as any).annotations,
schema: (state as any).annoMatrix?.schema,
obsCrossfilter: (state as any).obsCrossfilter,
}))
class Category extends React.PureComponent {
constructor(props) {
class Category extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
newLabelText: "",
};
}
disableAddNewLabelMode = (e) => {
disableAddNewLabelMode = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
this.setState({
newLabelText: "",
@@ -29,10 +33,11 @@ class Category extends React.PureComponent {
if (e) e.preventDefault();
};
handleAddNewLabelToCategory = (e) => {
handleAddNewLabelToCategory = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
const { newLabelText } = this.state;
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
this.disableAddNewLabelMode();
dispatch(
actions.annotationCreateLabelInCategory(
@@ -44,10 +49,11 @@ class Category extends React.PureComponent {
e.preventDefault();
};
addLabelAndAssignCells = (e) => {
addLabelAndAssignCells = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
const { newLabelText } = this.state;
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
this.disableAddNewLabelMode();
dispatch(
actions.annotationCreateLabelInCategory(metadataField, newLabelText, true)
@@ -55,26 +61,28 @@ class Category extends React.PureComponent {
e.preventDefault();
};
labelNameError = (name) => {
labelNameError = (name: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField, schema } = this.props;
return isLabelErroneous(name, metadataField, schema);
};
instruction = (label) => {
instruction = (label: any) => {
return labelPrompt(this.labelNameError(label), "New, unique label", ":");
};
handleChangeOrSelect = (label) => {
handleChangeOrSelect = (label: any) => {
this.setState({ newLabelText: label });
};
render() {
const { newLabelText } = this.state;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField, annotations, obsCrossfilter } = this.props;
return (
<>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: any; inputProps: { "data-testid"... Remove this comment to see the full error message
isActive={
annotations.isAddingNewLabel &&
annotations.categoryAddingNewLabel === metadataField
@@ -95,6 +103,7 @@ class Category extends React.PureComponent {
handleCancel={this.disableAddNewLabelMode}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ labelSuggestions: null; onChange: (label: ... Remove this comment to see the full error message
labelSuggestions={null}
onChange={this.handleChangeOrSelect}
onSelect={this.handleChangeOrSelect}
client/src/components/categorical/category/annoDialogEditCategoryName.js → client/src/components/categorical/category/annoDialogEditCategoryName.tsx
+34 -27
View File
@@ -7,25 +7,30 @@ import { labelPrompt } from "../labelUtil";
import { AnnotationsHelpers } from "../../../util/stateManager";
import actions from "../../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
schema: state.annoMatrix?.schema,
annotations: (state as any).annotations,
schema: (state as any).annoMatrix?.schema,
}))
class AnnoDialogEditCategoryName extends React.PureComponent {
constructor(props) {
class AnnoDialogEditCategoryName extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
newCategoryText: props.metadataField,
};
}
handleChangeOrSelect = (name) => {
handleChangeOrSelect = (name: any) => {
this.setState({
newCategoryText: name,
});
};
disableEditCategoryMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch({
type: "annotation: disable category edit mode",
@@ -33,17 +38,19 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
this.setState({ newCategoryText: metadataField });
};
handleEditCategory = (e) => {
handleEditCategory = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
const { newCategoryText } = this.state;
/*
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema } = this.props;
const allCategoryNames = schema.annotations.obs.columns.map((c) => c.name);
const allCategoryNames = schema.annotations.obs.columns.map(
(c: any) => c.name
);
if (
(allCategoryNames.indexOf(newCategoryText) > -1 &&
newCategoryText !== metadataField) ||
@@ -51,9 +58,7 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
) {
return;
}
this.disableEditCategoryMode();
if (metadataField !== newCategoryText)
dispatch(
actions.annotationRenameCategoryAction(metadataField, newCategoryText)
@@ -61,35 +66,34 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
e.preventDefault();
};
editedCategoryNameError = (name) => {
editedCategoryNameError = (name: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField } = this.props;
/* check for syntax errors in category name */
const error = AnnotationsHelpers.annotationNameIsErroneous(name);
if (error) {
return error;
}
/* check for duplicative categories */
/*
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema } = this.props;
const allCategoryNames = schema.annotations.obs.columns.map((c) => c.name);
const allCategoryNames = schema.annotations.obs.columns.map(
(c: any) => c.name
);
const categoryNameAlreadyExists = allCategoryNames.indexOf(name) > -1;
const sameName = name === metadataField;
if (categoryNameAlreadyExists && !sameName) {
return "duplicate";
}
/* otherwise, no error */
return false;
};
instruction = (name) => {
instruction = (name: any) => {
return labelPrompt(
this.editedCategoryNameError(name),
"New, unique category name",
@@ -98,17 +102,19 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
};
allCategoryNames() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema } = this.props;
return schema.annotations.obs.columns.map((c) => c.name);
return schema.annotations.obs.columns.map((c: any) => c.name);
}
render() {
const { newCategoryText } = this.state;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField, annotations } = this.props;
return (
<>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: any; inputProps: { "data-testid"... Remove this comment to see the full error message
isActive={
annotations.isEditingCategoryName &&
annotations.categoryBeingEdited === metadataField
@@ -129,6 +135,7 @@ class AnnoDialogEditCategoryName extends React.PureComponent {
handleCancel={this.disableEditCategoryMode}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ label: any; labelSuggestions: null; onChan... Remove this comment to see the full error message
label={newCategoryText}
labelSuggestions={null}
onChange={this.handleChangeOrSelect}
client/src/components/categorical/category/annoMenuCategory.js → client/src/components/categorical/category/annoMenuCategory.tsx
+15 -5
View File
@@ -16,16 +16,20 @@ import { IconNames } from "@blueprintjs/icons";
import * as globals from "../../../globals";
import actions from "../../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
annotations: (state as any).annotations,
}))
class AnnoMenuCategory extends React.PureComponent {
constructor(props) {
class AnnoMenuCategory extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {};
}
activateAddNewLabelMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch({
type: "annotation: activate add new label mode",
@@ -34,8 +38,8 @@ class AnnoMenuCategory extends React.PureComponent {
};
activateEditCategoryMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch({
type: "annotation: activate category edit mode",
data: metadataField,
@@ -43,20 +47,26 @@ class AnnoMenuCategory extends React.PureComponent {
};
handleDeleteCategory = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch(actions.annotationDeleteCategoryAction(metadataField));
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annotations' does not exist on type 'Rea... Remove this comment to see the full error message
annotations,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserAnno' does not exist on type 'Read... Remove this comment to see the full error message
isUserAnno,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'createText' does not exist on type 'Read... Remove this comment to see the full error message
createText,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'editText' does not exist on type 'Readon... Remove this comment to see the full error message
editText,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'deleteText' does not exist on type 'Read... Remove this comment to see the full error message
deleteText,
} = this.props;
return (
<>
{isUserAnno ? (
client/src/components/categorical/category/index.js → client/src/components/categorical/category/index.tsx
+97 -24
View File
@@ -31,33 +31,39 @@ const LABEL_WIDTH = globals.leftSidebarWidth - 100;
const ANNO_BUTTON_WIDTH = 50;
const LABEL_WIDTH_ANNO = LABEL_WIDTH - ANNO_BUTTON_WIDTH;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state, ownProps) => {
const schema = state.annoMatrix?.schema;
const schema = (state as any).annoMatrix?.schema;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
const { metadataField } = ownProps;
const isUserAnno = schema?.annotations?.obsByName[metadataField]?.writable;
const categoricalSelection = state.categoricalSelection?.[metadataField];
const categoricalSelection = (state as any).categoricalSelection?.[
metadataField
];
return {
colors: state.colors,
colors: (state as any).colors,
categoricalSelection,
annotations: state.annotations,
annoMatrix: state.annoMatrix,
annotations: (state as any).annotations,
annoMatrix: (state as any).annoMatrix,
schema,
crossfilter: state.obsCrossfilter,
crossfilter: (state as any).obsCrossfilter,
isUserAnno,
genesets: state.genesets.genesets,
genesets: (state as any).genesets.genesets,
};
})
class Category extends React.PureComponent {
static getSelectionState(
categoricalSelection,
metadataField,
categorySummary
categoricalSelection: any,
// @ts-expect-error ts-migrate(6133) FIXME: 'metadataField' is declared but its value is never... Remove this comment to see the full error message
metadataField: any,
categorySummary: any
) {
// total number of categories in this dimension
const totalCatCount = categorySummary.numCategoryValues;
// number of selected options in this category
const selectedCatCount = categorySummary.categoryValues.reduce(
(res, label) => (categoricalSelection.get(label) ?? true ? res + 1 : res),
(res: any, label: any) =>
categoricalSelection.get(label) ?? true ? res + 1 : res,
0
);
return selectedCatCount === totalCatCount
@@ -67,13 +73,14 @@ class Category extends React.PureComponent {
: "some";
}
static watchAsync(props, prevProps) {
static watchAsync(props: any, prevProps: any) {
return !shallowEqual(props.watchProps, prevProps.watchProps);
}
createCategorySummaryFromDfCol = memoize(createCategorySummaryFromDfCol);
getSelectionState(categorySummary) {
getSelectionState(categorySummary: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoricalSelection' does not exist on ... Remove this comment to see the full error message
const { categoricalSelection, metadataField } = this.props;
return Category.getSelectionState(
categoricalSelection,
@@ -83,6 +90,7 @@ class Category extends React.PureComponent {
}
handleColorChange = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch({
type: "color by categorical metadata",
@@ -91,6 +99,7 @@ class Category extends React.PureComponent {
};
handleCategoryClick = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annotations' does not exist on type 'Rea... Remove this comment to see the full error message
const { annotations, metadataField, onExpansionChange } = this.props;
const editingCategory =
annotations.isEditingCategoryName &&
@@ -100,13 +109,13 @@ class Category extends React.PureComponent {
}
};
handleCategoryKeyPress = (e) => {
handleCategoryKeyPress = (e: any) => {
if (e.key === "Enter") {
this.handleCategoryClick();
}
};
handleToggleAllClick = (categorySummary) => {
handleToggleAllClick = (categorySummary: any) => {
const isChecked = this.getSelectionState(categorySummary);
if (isChecked === "all") {
this.toggleNone(categorySummary);
@@ -115,8 +124,9 @@ class Category extends React.PureComponent {
}
};
fetchAsyncProps = async (props) => {
fetchAsyncProps = async (props: any) => {
const { annoMatrix, metadataField, colors } = props.watchProps;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'crossfilter' does not exist on type 'Rea... Remove this comment to see the full error message
const { crossfilter } = this.props;
const [categoryData, categorySummary, colorData] = await this.fetchData(
@@ -136,13 +146,14 @@ class Category extends React.PureComponent {
};
};
async fetchData(annoMatrix, metadataField, colors) {
async fetchData(annoMatrix: any, metadataField: any, colors: any) {
/*
fetch our data and the color-by data if appropriate, and then build a summary
of our category and a color table for the color-by annotation.
*/
const { schema } = annoMatrix;
const { colorAccessor, colorMode } = colors;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesets' does not exist on type 'Readon... Remove this comment to see the full error message
const { genesets } = this.props;
let colorDataPromise = Promise.resolve(null);
if (colorAccessor) {
@@ -169,8 +180,9 @@ class Category extends React.PureComponent {
return [categoryData, categorySummary, colorData];
}
updateColorTable(colorData) {
updateColorTable(colorData: any) {
// color table, which may be null
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema, colors, metadataField } = this.props;
const { colorAccessor, userColors, colorMode } = colors;
return {
@@ -187,7 +199,8 @@ class Category extends React.PureComponent {
};
}
toggleNone(categorySummary) {
toggleNone(categorySummary: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch(
actions.selectCategoricalAllMetadataAction(
@@ -199,7 +212,8 @@ class Category extends React.PureComponent {
);
}
toggleAll(categorySummary) {
toggleAll(categorySummary: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField } = this.props;
dispatch(
actions.selectCategoricalAllMetadataAction(
@@ -213,12 +227,19 @@ class Category extends React.PureComponent {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isExpanded' does not exist on type 'Read... Remove this comment to see the full error message
isExpanded,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoricalSelection' does not exist on ... Remove this comment to see the full error message
categoricalSelection,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'crossfilter' does not exist on type 'Rea... Remove this comment to see the full error message
crossfilter,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colors' does not exist on type 'Readonly... Remove this comment to see the full error message
colors,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
annoMatrix,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserAnno' does not exist on type 'Read... Remove this comment to see the full error message
isUserAnno,
} = this.props;
@@ -250,18 +271,26 @@ class Category extends React.PureComponent {
<Async.Fulfilled persist>
{(asyncProps) => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'u... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorTable' does not exist on type 'unkn... Remove this comment to see the full error message
colorTable,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type 'unkno... Remove this comment to see the full error message
colorData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'un... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleCategoryToggleAllClick' does not e... Remove this comment to see the full error message
handleCategoryToggleAllClick,
} = asyncProps;
const isTruncated = !!categorySummary?.isTruncated;
const selectionState = this.getSelectionState(categorySummary);
return (
<CategoryRender
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ metadataField: any; checkboxID: string; is... Remove this comment to see the full error message
metadataField={metadataField}
checkboxID={checkboxID}
isUserAnno={isUserAnno}
@@ -290,7 +319,7 @@ class Category extends React.PureComponent {
export default Category;
const StillLoading = ({ metadataField, checkboxID }) => {
const StillLoading = ({ metadataField, checkboxID }: any) => {
/*
We are still loading this category, so render a "busy" signal.
*/
@@ -341,7 +370,7 @@ const StillLoading = ({ metadataField, checkboxID }) => {
);
};
const ErrorLoading = ({ metadataField, error }) => {
const ErrorLoading = ({ metadataField, error }: any) => {
console.error(error); // log error to console as it is unexpected.
return (
<div style={{ marginBottom: 10, marginTop: 4 }}>
@@ -361,16 +390,27 @@ const ErrorLoading = ({ metadataField, error }) => {
const CategoryHeader = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'checkboxID' does not exist on type '{ ch... Remove this comment to see the full error message
checkboxID,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserAnno' does not exist on type '{ ch... Remove this comment to see the full error message
isUserAnno,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isTruncated' does not exist on type '{ c... Remove this comment to see the full error message
isTruncated,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isExpanded' does not exist on type '{ ch... Remove this comment to see the full error message
isExpanded,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionState' does not exist on type '... Remove this comment to see the full error message
selectionState,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onColorChangeClick' does not exist on ty... Remove this comment to see the full error message
onColorChangeClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryMenuClick' does not exist on t... Remove this comment to see the full error message
onCategoryMenuClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryMenuKeyPress' does not exist o... Remove this comment to see the full error message
onCategoryMenuKeyPress,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryToggleAllClick' does not exist... Remove this comment to see the full error message
onCategoryToggleAllClick,
}) => {
/*
@@ -379,6 +419,7 @@ const CategoryHeader = React.memo(
const checkboxRef = useRef(null);
useEffect(() => {
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
checkboxRef.current.indeterminate = selectionState === "some";
}, [checkboxRef.current, selectionState]);
@@ -408,6 +449,7 @@ const CategoryHeader = React.memo(
</label>
<span
role="menuitem"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="0"
data-testclass="category-expand"
data-testid={`${metadataField}:category-expand`}
@@ -423,6 +465,7 @@ const CategoryHeader = React.memo(
maxWidth: isUserAnno ? LABEL_WIDTH_ANNO : LABEL_WIDTH,
}}
data-testid={`${metadataField}:category-label`}
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="-1"
>
{metadataField}
@@ -441,10 +484,13 @@ const CategoryHeader = React.memo(
)}
</span>
</div>
{<AnnoDialogEditCategoryName metadataField={metadataField} />}
{<AnnoDialogAddLabel metadataField={metadataField} />}
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ metadataField: any; }' is not assignable t... Remove this comment to see the full error message */}
<AnnoDialogEditCategoryName metadataField={metadataField} />
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ metadataField: any; }' is not assignable t... Remove this comment to see the full error message */}
<AnnoDialogAddLabel metadataField={metadataField} />
<div>
<AnnoMenu
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ metadataField: any; isUserAnno: any; creat... Remove this comment to see the full error message
metadataField={metadataField}
isUserAnno={isUserAnno}
createText="Add a new label to this category"
@@ -484,21 +530,37 @@ const CategoryHeader = React.memo(
const CategoryRender = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'checkboxID' does not exist on type '{ ch... Remove this comment to see the full error message
checkboxID,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserAnno' does not exist on type '{ ch... Remove this comment to see the full error message
isUserAnno,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isTruncated' does not exist on type '{ c... Remove this comment to see the full error message
isTruncated,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isExpanded' does not exist on type '{ ch... Remove this comment to see the full error message
isExpanded,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionState' does not exist on type '... Remove this comment to see the full error message
selectionState,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type '{ ... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type '{... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type '{ chi... Remove this comment to see the full error message
colorData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorTable' does not exist on type '{ ch... Remove this comment to see the full error message
colorTable,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onColorChangeClick' does not exist on ty... Remove this comment to see the full error message
onColorChangeClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryMenuClick' does not exist on t... Remove this comment to see the full error message
onCategoryMenuClick,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryMenuKeyPress' does not exist o... Remove this comment to see the full error message
onCategoryMenuKeyPress,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onCategoryToggleAllClick' does not exist... Remove this comment to see the full error message
onCategoryToggleAllClick,
}) => {
/*
@@ -533,6 +595,7 @@ const CategoryRender = React.memo(
}}
>
<CategoryHeader
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ metadataField: any; checkboxID: any; isUse... Remove this comment to see the full error message
metadataField={metadataField}
checkboxID={checkboxID}
isUserAnno={isUserAnno}
@@ -551,6 +614,7 @@ const CategoryRender = React.memo(
/* values*/
isExpanded ? (
<CategoryValueList
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isUserAnno: any; metadataField: any; categ... Remove this comment to see the full error message
isUserAnno={isUserAnno}
metadataField={metadataField}
categoryData={categoryData}
@@ -574,12 +638,19 @@ const CategoryRender = React.memo(
const CategoryValueList = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isUserAnno' does not exist on type '{ ch... Remove this comment to see the full error message
isUserAnno,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type '{ ... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type '{... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type '{ chi... Remove this comment to see the full error message
colorData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorTable' does not exist on type '{ ch... Remove this comment to see the full error message
colorTable,
}) => {
const tuples = [...categorySummary.categoryValueIndices];
@@ -594,6 +665,7 @@ const CategoryValueList = React.memo(
{tuples.map(([value, index]) => (
<Value
key={value}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ key: any; isUserAnno: any; metadataField: ... Remove this comment to see the full error message
isUserAnno={isUserAnno}
metadataField={metadataField}
categoryIndex={index}
@@ -615,6 +687,7 @@ const CategoryValueList = React.memo(
{tuples.map(([value, index]) => (
<Flipped key={value} flipId={value}>
<Value
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isUserAnno: any; metadataField: any; categ... Remove this comment to see the full error message
isUserAnno={isUserAnno}
metadataField={metadataField}
categoryIndex={index}
client/src/components/categorical/categoryContext.js → client/src/components/categorical/categoryContext.ts
View File
client/src/components/categorical/index.js → client/src/components/categorical/index.tsx
+37 -32
View File
@@ -10,13 +10,17 @@ import LabelInput from "../labelInput";
import { labelPrompt } from "./labelUtil";
import actions from "../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
writableCategoriesEnabled: state.config?.parameters?.annotations ?? false,
schema: state.annoMatrix?.schema,
userInfo: state.userInfo,
writableCategoriesEnabled:
(state as any).config?.parameters?.annotations ?? false,
schema: (state as any).annoMatrix?.schema,
userInfo: (state as any).userInfo,
}))
class Categories extends React.Component {
constructor(props) {
class Categories extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
createAnnoModeActive: false,
@@ -26,7 +30,8 @@ class Categories extends React.Component {
};
}
handleCreateUserAnno = (e) => {
handleCreateUserAnno = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
const { newCategoryText, categoryToDuplicate } = this.state;
dispatch(
@@ -55,50 +60,48 @@ class Categories extends React.Component {
});
};
handleModalDuplicateCategorySelection = (d) => {
handleModalDuplicateCategorySelection = (d: any) => {
this.setState({ categoryToDuplicate: d });
};
categoryNameError = (name) => {
categoryNameError = (name: any) => {
/*
return false if this is a LEGAL/acceptable category name or NULL/empty string,
or return an error type.
*/
return false if this is a LEGAL/acceptable category name or NULL/empty string,
or return an error type.
*/
/* allow empty string */
if (name === "") return false;
/*
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
test for uniqueness against *all* annotation names, not just the subset
we render as categorical.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema } = this.props;
const allCategoryNames = schema.annotations.obs.columns.map((c) => c.name);
const allCategoryNames = schema.annotations.obs.columns.map(
(c: any) => c.name
);
/* check category name syntax */
const error = AnnotationsHelpers.annotationNameIsErroneous(name);
if (error) {
return error;
}
/* disallow duplicates */
if (allCategoryNames.indexOf(name) !== -1) {
return "duplicate";
}
/* otherwise, no error */
return false;
};
handleChange = (name) => {
handleChange = (name: any) => {
this.setState({ newCategoryText: name });
};
handleSelect = (name) => {
handleSelect = (name: any) => {
this.setState({ newCategoryText: name });
};
instruction = (name) => {
instruction = (name: any) => {
return labelPrompt(
this.categoryNameError(name),
"New, unique category name",
@@ -106,7 +109,7 @@ class Categories extends React.Component {
);
};
onExpansionChange = (catName) => {
onExpansionChange = (catName: any) => {
const { expandedCats } = this.state;
if (expandedCats.has(catName)) {
const _expandedCats = new Set(expandedCats);
@@ -126,16 +129,13 @@ class Categories extends React.Component {
newCategoryText,
expandedCats,
} = this.state;
const {
writableCategoriesEnabled,
schema,
userInfo,
} = this.props;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'writableCategoriesEnabled' does not exis... Remove this comment to see the full error message
const { writableCategoriesEnabled, schema, userInfo } = this.props;
/* all names, sorted in display order. Will be rendered in this order */
// @ts-expect-error ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
const allCategoryNames = ControlsHelpers.selectableCategoryNames(
schema
).sort();
return (
<div
style={{
@@ -143,6 +143,7 @@ class Categories extends React.Component {
}}
>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: any; title: string; instruction:... Remove this comment to see the full error message
isActive={createAnnoModeActive}
title="Create new category"
instruction={this.instruction(newCategoryText)}
@@ -155,6 +156,7 @@ class Categories extends React.Component {
handleCancel={this.handleDisableAnnoMode}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ labelSuggestions: null; onChange: (name: a... Remove this comment to see the full error message
labelSuggestions={null}
onChange={this.handleChange}
onSelect={this.handleSelect}
@@ -169,6 +171,7 @@ class Categories extends React.Component {
}
annoSelect={
<AnnoSelect
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ handleModalDuplicateCategorySelection: (d:... Remove this comment to see the full error message
handleModalDuplicateCategorySelection={
this.handleModalDuplicateCategorySelection
}
@@ -209,12 +212,13 @@ class Categories extends React.Component {
{/* READ ONLY CATEGORICAL FIELDS */}
{/* this is duplicative but flat, could be abstracted */}
{allCategoryNames.map((catName) =>
{allCategoryNames.map((catName: any) =>
!schema.annotations.obsByName[catName].writable &&
(schema.annotations.obsByName[catName].categories?.length > 1 ||
!schema.annotations.obsByName[catName].categories) ? (
<Category
key={catName}
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
metadataField={catName}
onExpansionChange={this.onExpansionChange}
isExpanded={expandedCats.has(catName)}
@@ -223,10 +227,11 @@ class Categories extends React.Component {
) : null
)}
{/* WRITEABLE FIELDS */}
{allCategoryNames.map((catName) =>
{allCategoryNames.map((catName: any) =>
schema.annotations.obsByName[catName].writable ? (
<Category
key={catName}
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
metadataField={catName}
onExpansionChange={this.onExpansionChange}
isExpanded={expandedCats.has(catName)}
client/src/components/categorical/labelUtil.js → client/src/components/categorical/labelUtil.tsx
+3 -2
View File
@@ -3,7 +3,7 @@ import { Colors } from "@blueprintjs/core";
import { AnnotationsHelpers } from "../../util/stateManager";
export function isLabelErroneous(label, metadataField, schema) {
export function isLabelErroneous(label: any, metadataField: any, schema: any) {
/*
return false if this is a LEGAL/acceptable category name or NULL/empty string,
or return an error type.
@@ -35,9 +35,10 @@ const errorMessageMap = {
"multi-space-run": "Multiple consecutive spaces not allowed",
};
export function labelPrompt(err, prolog, epilog) {
export function labelPrompt(err: any, prolog: any, epilog: any) {
let errPrompt = null;
if (err) {
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
let errMsg = errorMessageMap[err] ?? "error";
errMsg = errMsg[0].toLowerCase() + errMsg.slice(1);
errPrompt = (
client/src/components/categorical/value/index.js → client/src/components/categorical/value/index.tsx
+96 -36
View File
@@ -13,6 +13,7 @@ import {
Position,
} from "@blueprintjs/core";
import * as globals from "../../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module '../categorical.css' or its cor... Remove this comment to see the full error message
import styles from "../categorical.css";
import AnnoDialog from "../../annoDialog";
import LabelInput from "../../labelInput";
@@ -29,15 +30,20 @@ const STACKED_BAR_HEIGHT = 11;
const STACKED_BAR_WIDTH = 100;
/* this is defined outside of the class so we can use it in connect() */
function _currentLabelAsString(ownProps) {
function _currentLabelAsString(ownProps: any) {
const { label } = ownProps;
// when called as a function, the String() constructor performs type conversion,
// and returns a primitive string.
return String(label);
}
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state, ownProps) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'pointDilation' does not exist on type 'D... Remove this comment to see the full error message
const { pointDilation, categoricalSelection } = state;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type '{... Remove this comment to see the full error message
const { metadataField, categorySummary, categoryIndex } = ownProps;
const isDilated =
pointDilation.metadataField === metadataField &&
@@ -48,27 +54,28 @@ function _currentLabelAsString(ownProps) {
const isSelected = category.get(label) ?? true;
return {
annotations: state.annotations,
schema: state.annoMatrix?.schema,
annotations: (state as any).annotations,
schema: (state as any).annoMatrix?.schema,
isDilated,
isSelected,
label,
};
})
class CategoryValue extends React.Component {
constructor(props) {
class CategoryValue extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
editedLabelText: this.currentLabelAsString(),
};
}
componentDidUpdate(prevProps) {
componentDidUpdate(prevProps: {}) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField, categoryIndex, categorySummary } = this.props;
if (
prevProps.metadataField !== metadataField ||
prevProps.categoryIndex !== categoryIndex ||
prevProps.categorySummary !== categorySummary
(prevProps as any).metadataField !== metadataField ||
(prevProps as any).categoryIndex !== categoryIndex ||
(prevProps as any).categorySummary !== categorySummary
) {
// eslint-disable-next-line react/no-did-update-set-state --- adequately checked to prevent looping
this.setState({
@@ -79,22 +86,26 @@ class CategoryValue extends React.Component {
// If coloring by and this isn't the colorAccessor and it isn't being edited
get shouldRenderStackedBarOrHistogram() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
const { colorAccessor, isColorBy, annotations } = this.props;
return !!colorAccessor && !isColorBy && !annotations.isEditingLabelName;
}
handleDeleteValue = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, label } = this.props;
dispatch(actions.annotationDeleteLabelFromCategory(metadataField, label));
};
handleAddCurrentSelectionToThisLabel = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, label } = this.props;
dispatch(actions.annotationLabelCurrentSelection(metadataField, label));
};
handleEditValue = (e) => {
handleEditValue = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, label } = this.props;
const { editedLabelText } = this.state;
this.cancelEditMode();
@@ -108,7 +119,8 @@ class CategoryValue extends React.Component {
e.preventDefault();
};
handleCreateArbitraryLabel = (txt) => {
handleCreateArbitraryLabel = (txt: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, label } = this.props;
this.cancelEditMode();
dispatch(
@@ -116,17 +128,19 @@ class CategoryValue extends React.Component {
);
};
labelNameError = (name) => {
labelNameError = (name: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
const { metadataField, schema } = this.props;
if (name === this.currentLabelAsString()) return false;
return isLabelErroneous(name, metadataField, schema);
};
instruction = (label) => {
instruction = (label: any) => {
return labelPrompt(this.labelNameError(label), "New, unique label", ":");
};
activateEditLabelMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, categoryIndex, label } = this.props;
dispatch({
type: "annotation: activate edit label mode",
@@ -137,6 +151,7 @@ class CategoryValue extends React.Component {
};
cancelEditMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, categoryIndex, label } = this.props;
this.setState({
editedLabelText: this.currentLabelAsString(),
@@ -151,9 +166,13 @@ class CategoryValue extends React.Component {
toggleOff = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryIndex' does not exist on type 'R... Remove this comment to see the full error message
categoryIndex,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
} = this.props;
const label = categorySummary.categoryValues[categoryIndex];
@@ -168,7 +187,7 @@ class CategoryValue extends React.Component {
);
};
shouldComponentUpdate = (nextProps, nextState) => {
shouldComponentUpdate = (nextProps: any, nextState: any) => {
/*
Checks to see if at least one of the following changed:
* world state
@@ -179,6 +198,7 @@ class CategoryValue extends React.Component {
If and only if true, update the component
*/
const { props, state } = this;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryIndex' does not exist on type 'R... Remove this comment to see the full error message
const { categoryIndex, categorySummary, isSelected } = props;
const {
categoryIndex: newCategoryIndex,
@@ -191,10 +211,12 @@ class CategoryValue extends React.Component {
const labelChanged = label !== newLabel;
const valueSelectionChange = isSelected !== newIsSelected;
const colorAccessorChange = props.colorAccessor !== nextProps.colorAccessor;
const annotationsChange = props.annotations !== nextProps.annotations;
const colorAccessorChange =
(props as any).colorAccessor !== nextProps.colorAccessor;
const annotationsChange =
(props as any).annotations !== nextProps.annotations;
const editingLabel = state.editedLabelText !== nextState.editedLabelText;
const dilationChange = props.isDilated !== nextProps.isDilated;
const dilationChange = (props as any).isDilated !== nextProps.isDilated;
const count = categorySummary.categoryValueCounts[categoryIndex];
const newCount = newCategorySummary.categoryValueCounts[newCategoryIndex];
@@ -205,7 +227,7 @@ class CategoryValue extends React.Component {
// if any one changes, but only for the currently colored-by category.
const colorMightHaveChanged =
nextProps.colorAccessor === nextProps.metadataField &&
props.categorySummary !== nextProps.categorySummary;
(props as any).categorySummary !== nextProps.categorySummary;
return (
labelChanged ||
@@ -221,9 +243,13 @@ class CategoryValue extends React.Component {
toggleOn = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryIndex' does not exist on type 'R... Remove this comment to see the full error message
categoryIndex,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
} = this.props;
const label = categorySummary.categoryValues[categoryIndex];
@@ -239,6 +265,7 @@ class CategoryValue extends React.Component {
};
handleMouseEnter = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, categoryIndex, label } = this.props;
dispatch({
type: "category value mouse hover start",
@@ -249,6 +276,7 @@ class CategoryValue extends React.Component {
};
handleMouseExit = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, metadataField, categoryIndex, label } = this.props;
dispatch({
type: "category value mouse hover end",
@@ -258,23 +286,24 @@ class CategoryValue extends React.Component {
});
};
handleTextChange = (text) => {
handleTextChange = (text: any) => {
this.setState({ editedLabelText: text });
};
handleChoice = (e) => {
handleChoice = (e: any) => {
/* Blueprint Suggest format */
this.setState({ editedLabelText: e.target });
};
createHistogramBins = (
metadataField,
categoryData,
colorAccessor,
colorData,
categoryValue,
width,
height
metadataField: any,
categoryData: any,
// @ts-expect-error ts-migrate(6133) FIXME: 'colorAccessor' is declared but its value is never... Remove this comment to see the full error message
colorAccessor: any,
colorData: any,
categoryValue: any,
width: any,
height: any
) => {
/*
Knowing that colorScale is based off continuous data,
@@ -309,14 +338,15 @@ class CategoryValue extends React.Component {
};
createStackedGraphBins = (
metadataField,
categoryData,
colorAccessor,
colorData,
categoryValue,
colorTable,
schema,
width
metadataField: any,
categoryData: any,
colorAccessor: any,
colorData: any,
categoryValue: any,
// @ts-expect-error ts-migrate(6133) FIXME: 'colorTable' is declared but its value is never re... Remove this comment to see the full error message
colorTable: any,
schema: any,
width: any
) => {
/*
Knowing that the color scale is based off of categorical data,
@@ -357,12 +387,13 @@ class CategoryValue extends React.Component {
return _currentLabelAsString(this.props);
}
isAddCurrentSelectionDisabled(crossfilter, category, value) {
isAddCurrentSelectionDisabled(crossfilter: any, category: any, value: any) {
/*
disable "add current selection to label", if one of the following is true:
1. no cells are selected
2. all currently selected cells already have this label, on this category
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'Re... Remove this comment to see the full error message
const { categoryData } = this.props;
// 1. no cells selected?
@@ -382,12 +413,19 @@ class CategoryValue extends React.Component {
renderMiniStackedBar = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'Re... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type 'Reado... Remove this comment to see the full error message
colorData,
// @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 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
schema,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'label' does not exist on type 'Readonly<... Remove this comment to see the full error message
label,
} = this.props;
const isColorBy = metadataField === colorAccessor;
@@ -425,6 +463,7 @@ class CategoryValue extends React.Component {
domain,
occupancy,
}}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ height: number; width: number; colorTable:... Remove this comment to see the full error message
height={STACKED_BAR_HEIGHT}
width={STACKED_BAR_WIDTH}
/>
@@ -433,12 +472,19 @@ class CategoryValue extends React.Component {
renderMiniHistogram = () => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type 'Reado... Remove this comment to see the full error message
colorData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'Re... Remove this comment to see the full error message
categoryData,
// @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 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
schema,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'label' does not exist on type 'Readonly<... Remove this comment to see the full error message
label,
} = this.props;
const colorScale = colorTable?.scale;
@@ -473,6 +519,7 @@ class CategoryValue extends React.Component {
yScale,
bins,
}}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ obsOrVarContinuousFieldDisplayName: any; d... Remove this comment to see the full error message
obsOrVarContinuousFieldDisplayName={colorAccessor}
domainLabel={label}
height={STACKED_BAR_HEIGHT}
@@ -483,15 +530,25 @@ class CategoryValue extends React.Component {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryIndex' does not exist on type 'R... Remove this comment to see the full error message
categoryIndex,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
colorAccessor,
// @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 'isUserAnno' does not exist on type 'Read... Remove this comment to see the full error message
isUserAnno,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annotations' does not exist on type 'Rea... Remove this comment to see the full error message
annotations,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isDilated' does not exist on type 'Reado... Remove this comment to see the full error message
isDilated,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isSelected' does not exist on type 'Read... Remove this comment to see the full error message
isSelected,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categorySummary' does not exist on type ... Remove this comment to see the full error message
categorySummary,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'label' does not exist on type 'Readonly<... Remove this comment to see the full error message
label,
} = this.props;
const colorScale = colorTable?.scale;
@@ -587,6 +644,7 @@ class CategoryValue extends React.Component {
<span
data-testid={`categorical-value-${metadataField}-${displayString}`}
data-testclass="categorical-value"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="-1"
style={{
width: labelWidth,
@@ -612,6 +670,7 @@ class CategoryValue extends React.Component {
{editModeActive ? (
<div>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: any; inputProps: { "data-testid"... Remove this comment to see the full error message
isActive={editModeActive}
inputProps={{
"data-testid": `${metadataField}:edit-label-name-dialog`,
@@ -630,6 +689,7 @@ class CategoryValue extends React.Component {
handleCancel={this.cancelEditMode}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ label: any; labelSuggestions: null; onChan... Remove this comment to see the full error message
label={editedLabelText}
labelSuggestions={null}
onChange={this.handleTextChange}
client/src/components/categorical/value/occupancy.js → client/src/components/categorical/value/occupancy.tsx
+24 -30
View File
@@ -8,64 +8,59 @@ import {
Position,
} from "@blueprintjs/core";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
schema: state.annoMatrix?.schema,
schema: (state as any).annoMatrix?.schema,
}))
class Occupancy extends React.PureComponent {
canvas: any;
_WIDTH = 100;
_HEIGHT = 11;
createHistogram = () => {
/*
Knowing that colorScale is based off continous data,
createHistogram fetches the continous data in relation to the cells releveant to the catagory value.
It then seperates that data into 50 bins for drawing the mini-histogram
*/
Knowing that colorScale is based off continous data,
createHistogram fetches the continous data in relation to the cells releveant to the catagory value.
It then seperates that data into 50 bins for drawing the mini-histogram
*/
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'Re... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type 'Reado... Remove this comment to see the full error message
colorData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryValue' does not exist on type 'R... Remove this comment to see the full error message
categoryValue,
} = this.props;
if (!this.canvas) return;
const groupBy = categoryData.col(metadataField);
const col = colorData.icol(0);
const range = col.summarize();
const histogramMap = col.histogram(
50,
[range.min, range.max],
groupBy
); /* Because the signature changes we really need different names for histogram to differentiate signatures */
const bins = histogramMap.has(categoryValue)
? histogramMap.get(categoryValue)
: new Array(50).fill(0);
const xScale = d3
.scaleLinear()
.domain([0, bins.length])
.range([0, this._WIDTH]);
const largestBin = Math.max(...bins);
const yScale = d3
.scaleLinear()
.domain([0, largestBin])
.range([0, this._HEIGHT]);
const ctx = this.canvas.getContext("2d");
ctx.fillStyle = "#000";
let x;
let y;
const rectWidth = this._WIDTH / bins.length;
for (let i = 0, { length } = bins; i < length; i += 1) {
x = xScale(i);
y = yScale(bins[i]);
@@ -75,32 +70,34 @@ class Occupancy extends React.PureComponent {
createOccupancyStack = () => {
/*
Knowing that the color scale is based off of catagorical data,
createOccupancyStack obtains a map showing the number if cells per colored value
Using the colorScale a stack of colored bars is drawn representing the map
*/
Knowing that the color scale is based off of catagorical data,
createOccupancyStack obtains a map showing the number if cells per colored value
Using the colorScale a stack of colored bars is drawn representing the map
*/
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'metadataField' does not exist on type 'R... Remove this comment to see the full error message
metadataField,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryData' does not exist on type 'Re... Remove this comment to see the full error message
categoryData,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoryValue' does not exist on type 'R... Remove this comment to see the full error message
categoryValue,
// @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 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
schema,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorData' does not exist on type 'Reado... Remove this comment to see the full error message
colorData,
} = this.props;
const { scale: colorScale } = colorTable;
const ctx = this.canvas?.getContext("2d");
if (!ctx) return;
const groupBy = categoryData.col(metadataField);
const occupancyMap = colorData
.col(colorAccessor)
.histogramCategorical(groupBy);
const occupancy = occupancyMap.get(categoryValue);
if (occupancy && occupancy.size > 0) {
// not all categories have occupancy, so occupancy may be undefined.
const x = d3
@@ -110,15 +107,12 @@ class Occupancy extends React.PureComponent {
.range([0, this._WIDTH]);
const categories =
schema.annotations.obsByName[colorAccessor]?.categories;
let currentOffset = 0;
const dfColumn = colorData.col(colorAccessor);
const categoryValues = dfColumn.summarizeCategorical().categories;
let o;
let scaledValue;
let value;
for (let i = 0, { length } = categoryValues; i < length; i += 1) {
value = categoryValues[i];
o = occupancy.get(value);
@@ -133,11 +127,11 @@ class Occupancy extends React.PureComponent {
};
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
const { colorAccessor, categoryValue, colorByIsCategorical } = this.props;
const { canvas } = this;
if (canvas)
canvas.getContext("2d").clearRect(0, 0, this._WIDTH, this._HEIGHT);
return (
<Popover
interactionKind={PopoverInteractionKind.HOVER_TARGET_ONLY}
client/src/components/continuous/continuous.js
-32
View File
@@ -1,32 +0,0 @@
/* rc slider https://www.npmjs.com/package/rc-slider */
import React from "react";
import { connect } from "react-redux";
import HistogramBrush from "../brushableHistogram";
@connect((state) => ({
schema: state.annoMatrix?.schema,
}))
class Continuous extends React.PureComponent {
render() {
/* initial value for iterator to simulate index, ranges is an object */
const { schema } = this.props;
if (!schema) return null;
const obsIndex = schema.annotations.obs.index;
const allContinuousNames = schema.annotations.obs.columns
.filter((col) => col.type === "int32" || col.type === "float32")
.filter((col) => col.name !== obsIndex)
.filter((col) => !col.writable) // skip user annotations - they will be treated as categorical
.map((col) => col.name);
return (
<div>
{allContinuousNames.map((key, zebra) => (
<HistogramBrush key={key} field={key} isObs zebra={zebra % 2 === 0} />
))}
</div>
);
}
}
export default Continuous;
client/src/components/continuous/continuous.tsx
+34
View File
@@ -0,0 +1,34 @@
/* rc slider https://www.npmjs.com/package/rc-slider */
import React from "react";
import { connect } from "react-redux";
import HistogramBrush from "../brushableHistogram";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
schema: (state as any).annoMatrix?.schema,
}))
class Continuous extends React.PureComponent {
render() {
/* initial value for iterator to simulate index, ranges is an object */
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
const { schema } = this.props;
if (!schema) return null;
const obsIndex = schema.annotations.obs.index;
const allContinuousNames = schema.annotations.obs.columns
.filter((col: any) => col.type === "int32" || col.type === "float32")
.filter((col: any) => col.name !== obsIndex)
.filter((col: any) => !col.writable) // skip user annotations - they will be treated as categorical
.map((col: any) => col.name);
return (
<div>
{allContinuousNames.map((key: any, zebra: any) => (
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
<HistogramBrush key={key} field={key} isObs zebra={zebra % 2 === 0} />
))}
</div>
);
}
}
export default Continuous;
client/src/components/continuous/setupParallelCoordinates.js → client/src/components/continuous/setupParallelCoordinates.ts
+6 -1
View File
@@ -5,7 +5,7 @@
******************************************/
import * as d3 from "d3";
const setupParallelCoordinates = (width, height, margin) => {
const setupParallelCoordinates = (width: any, height: any, margin: any) => {
const container = d3.select("#parcoords");
const svg = container
@@ -24,10 +24,15 @@ const setupParallelCoordinates = (width, height, margin) => {
.style("margin-top", `${margin.top}px`)
.style("margin-left", `${margin.left}px`);
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
const ctx = canvas.node().getContext("2d");
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
ctx.globalCompositeOperation = "darken";
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
ctx.globalAlpha = 0.15;
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
ctx.lineWidth = 1.5;
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
ctx.scale(devicePixelRatio, devicePixelRatio);
return {
client/src/components/continuous/util.js → client/src/components/continuous/util.ts
+7 -6
View File
@@ -12,14 +12,14 @@ export const innerHeight = height - 2;
export const devicePixelRatio = window.devicePixelRatio || 1;
export const createDimensions = (data) => {
const newArr = [];
export const createDimensions = (data: any) => {
const newArr: any = [];
each(data, (value, key) => {
if (value.range) {
newArr.push({
key /* room for confusion: lodash calls this key, it's also the name of the property parallel coords code is looking for */,
type: {
within: (d, extent, dim) =>
within: (d: any, extent: any, dim: any) =>
extent[0] <= dim.scale(d) && dim.scale(d) <= extent[1],
},
scale: d3
@@ -32,16 +32,17 @@ export const createDimensions = (data) => {
return newArr;
};
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
export const yAxis = d3.axisLeft();
export const brushstart = () => {
d3.event.sourceEvent.stopPropagation();
(d3 as any).event.sourceEvent.stopPropagation();
};
// Unused.
// export const d3_functor = v => (typeof v === "function" ? v : () => v);
export const project = (d, dimensions, xscale) =>
dimensions.map((p, i) => {
export const project = (d: any, dimensions: any, xscale: any) =>
dimensions.map((p: any, i: any) => {
// check if data element has property and contains a value
if (!(p.key in d) || d[p.key] === null) return null;
client/src/components/continuousLegend/index.js → client/src/components/continuousLegend/index.tsx
+13 -11
View File
@@ -9,7 +9,7 @@ import {
} from "../../util/stateManager/colorHelpers";
// create continuous color legend
const continuous = (selectorId, colorScale, colorAccessor) => {
const continuous = (selectorId: any, colorScale: any, colorAccessor: any) => {
const legendHeight = 200;
const legendWidth = 80;
const margin = { top: 10, right: 60, bottom: 10, left: 2 };
@@ -33,6 +33,7 @@ const continuous = (selectorId, colorScale, colorAccessor) => {
we flip the color scale as well [1, 0] instead of [0, 1] */
.node();
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
const ctx = canvas.getContext("2d");
const legendScale = d3
@@ -44,6 +45,7 @@ const continuous = (selectorId, colorScale, colorAccessor) => {
]); /* we flip this to make viridis colors dark if high in the color scale */
// image data hackery based on http://bl.ocks.org/mbostock/048d21cf747371b11884f75ad896e5a5
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
const image = ctx.createImageData(1, legendHeight);
d3.range(legendHeight).forEach((i) => {
const c = d3.rgb(colorScale(legendScale.invert(i)));
@@ -52,6 +54,7 @@ const continuous = (selectorId, colorScale, colorAccessor) => {
image.data[4 * i + 2] = c.b;
image.data[4 * i + 3] = 255;
});
// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
ctx.putImageData(image, 0, 0);
// A simpler way to do the above, but possibly slower. keep in mind the legend
@@ -105,27 +108,26 @@ const continuous = (selectorId, colorScale, colorAccessor) => {
.text(colorAccessor);
};
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annoMatrix: state.annoMatrix,
colors: state.colors,
genesets: state.genesets.genesets,
annoMatrix: (state as any).annoMatrix,
colors: (state as any).colors,
genesets: (state as any).genesets.genesets,
}))
class ContinuousLegend extends React.Component {
async componentDidUpdate(prevProps) {
async componentDidUpdate(prevProps: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, colors, genesets } = this.props;
if (!colors || !annoMatrix) return;
if (colors !== prevProps?.colors || annoMatrix !== prevProps?.annoMatrix) {
const { schema } = annoMatrix;
const { colorMode, colorAccessor, userColors } = colors;
const colorQuery = createColorQuery(
colorMode,
colorAccessor,
schema,
genesets
);
const colorDf = colorQuery ? await annoMatrix.fetch(...colorQuery) : null;
const colorTable = createColorTable(
colorMode,
@@ -134,19 +136,19 @@ class ContinuousLegend extends React.Component {
schema,
userColors
);
const colorScale = colorTable.scale;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'range' does not exist on type '((idx: an... Remove this comment to see the full error message
const range = colorScale?.range;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'domain' does not exist on type '((idx: a... Remove this comment to see the full error message
const [domainMin, domainMax] = colorScale?.domain?.() ?? [0, 0];
/* always remove it, if it's not continuous we don't put it back. */
d3.select("#continuous_legend").selectAll("*").remove();
if (colorAccessor && colorScale && range && domainMin < domainMax) {
/* fragile! continuous range is 0 to 1, not [#fa4b2c, ...], make this a flag? */
if (range()[0][0] !== "#") {
continuous(
"#continuous_legend",
// @ts-expect-error ts-migrate(2339) FIXME: Property 'domain' does not exist on type '((idx: a... Remove this comment to see the full error message
d3.scaleSequential(interpolateCool).domain(colorScale.domain()),
colorAccessor
);
client/src/components/embedding/index.js → client/src/components/embedding/index.tsx
+17 -11
View File
@@ -15,25 +15,30 @@ import * as globals from "../../globals";
import actions from "../../actions";
import { getDiscreteCellEmbeddingRowIndex } from "../../util/stateManager/viewStackHelpers";
type EmbeddingState = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
return {
layoutChoice: state.layoutChoice, // TODO: really should clean up naming, s/layout/embedding/g
schema: state.annoMatrix?.schema,
crossfilter: state.obsCrossfilter,
layoutChoice: (state as any).layoutChoice,
schema: (state as any).annoMatrix?.schema,
crossfilter: (state as any).obsCrossfilter,
};
})
class Embedding extends React.PureComponent {
constructor(props) {
class Embedding extends React.PureComponent<{}, EmbeddingState> {
constructor(props: {}) {
super(props);
this.state = {};
}
handleLayoutChoiceChange = (e) => {
handleLayoutChoiceChange = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch(actions.layoutChoiceAction(e.currentTarget.value));
};
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'layoutChoice' does not exist on type 'Re... Remove this comment to see the full error message
const { layoutChoice, schema, crossfilter } = this.props;
const { annoMatrix } = crossfilter;
return (
@@ -100,10 +105,11 @@ class Embedding extends React.PureComponent {
export default Embedding;
const loadAllEmbeddingCounts = async ({ annoMatrix, available }) => {
const loadAllEmbeddingCounts = async ({ annoMatrix, available }: any) => {
const embeddings = await Promise.all(
available.map((name) => annoMatrix.base().fetch("emb", name))
available.map((name: any) => annoMatrix.base().fetch("emb", name))
);
// @ts-expect-error ts-migrate(7006) FIXME: Parameter 'name' implicitly has an 'any' type.
return available.map((name, idx) => ({
embeddingName: name,
embedding: embeddings[idx],
@@ -111,7 +117,7 @@ const loadAllEmbeddingCounts = async ({ annoMatrix, available }) => {
}));
};
const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }) => {
const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }: any) => {
const { available } = layoutChoice;
const { data, error, isPending } = useAsync({
promiseFn: loadAllEmbeddingCounts,
@@ -127,7 +133,7 @@ const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }) => {
/* still loading, or errored out - just omit counts (TODO: spinner?) */
return (
<RadioGroup onChange={onChange} selectedValue={layoutChoice.current}>
{layoutChoice.available.map((name) => (
{layoutChoice.available.map((name: any) => (
<Radio label={`${name}`} value={name} key={name} />
))}
</RadioGroup>
@@ -136,7 +142,7 @@ const EmbeddingChoices = ({ onChange, annoMatrix, layoutChoice }) => {
if (data) {
return (
<RadioGroup onChange={onChange} selectedValue={layoutChoice.current}>
{data.map((summary) => {
{data.map((summary: any) => {
const { discreteCellIndex, embeddingName } = summary;
const sizeHint = `${discreteCellIndex.size()} cells`;
return (
client/src/components/framework/container.js → client/src/components/framework/container.tsx
+1 -1
View File
@@ -1,6 +1,6 @@
import React from "react";
function Container(props) {
function Container(props: any) {
const { children } = props;
return (
<div
client/src/components/framework/layout.js → client/src/components/framework/layout.tsx
+2
View File
@@ -2,6 +2,7 @@ import React from "react";
import * as globals from "../../globals";
class Layout extends React.Component {
viewportRef: any;
/*
Layout - this react component contains all the layout style and logic for the application once it has loaded.
@@ -23,6 +24,7 @@ class Layout extends React.Component {
render() {
const { children } = this.props;
// @ts-expect-error ts-migrate(2488) FIXME: Type 'ReactNode' must have a '[Symbol.iterator]()'... Remove this comment to see the full error message
const [leftSidebar, renderGraph, rightSidebar] = children;
return (
<div
client/src/components/framework/logo.js → client/src/components/framework/logo.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import React from "react";
import * as globals from "../../globals";
const Logo = (props) => {
const Logo = (props: any) => {
const { size } = props;
return (
<svg width={size} height={size} viewBox="0 0 48 48" fill="none">
client/src/components/framework/toasters.js → client/src/components/framework/toasters.ts
+5 -5
View File
@@ -11,20 +11,20 @@ const ToastTopCenter = Toaster.create({
/*
A "user" error - eg, bad input
*/
export const postUserErrorToast = (message) =>
export const postUserErrorToast = (message: any) =>
ToastTopCenter.show({ message, intent: Intent.WARNING });
/*
A toast the user must dismiss manually, because they need to act on its information,
ie., 8 bulk add genes out of 40 were bad. Manually see which ones and fix.
*/
export const keepAroundErrorToast = (message) =>
export const keepAroundErrorToast = (message: any) =>
ToastTopCenter.show({ message, timeout: 0, intent: Intent.WARNING });
/*
a hard network error
*/
export const postNetworkErrorToast = (message, key = undefined) =>
export const postNetworkErrorToast = (message: any, key = undefined) =>
ToastTopCenter.show(
{
message,
@@ -37,14 +37,14 @@ export const postNetworkErrorToast = (message, key = undefined) =>
/*
Async message to user
*/
export const postAsyncSuccessToast = (message) =>
export const postAsyncSuccessToast = (message: any) =>
ToastTopCenter.show({
message,
timeout: 10000,
intent: Intent.SUCCESS,
});
export const postAsyncFailureToast = (message) =>
export const postAsyncFailureToast = (message: any) =>
ToastTopCenter.show({
message,
timeout: 10000,
client/src/components/geneExpression/gene.js → client/src/components/geneExpression/gene.tsx
+25 -5
View File
@@ -9,17 +9,23 @@ import actions from "../../actions";
const MINI_HISTOGRAM_WIDTH = 110;
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state, ownProps) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'gene' does not exist on type '{}'.
const { gene } = ownProps;
return {
isColorAccessor: state.colors.colorAccessor === gene,
isScatterplotXXaccessor: state.controls.scatterplotXXaccessor === gene,
isScatterplotYYaccessor: state.controls.scatterplotYYaccessor === gene,
isColorAccessor: (state as any).colors.colorAccessor === gene,
isScatterplotXXaccessor:
(state as any).controls.scatterplotXXaccessor === gene,
isScatterplotYYaccessor:
(state as any).controls.scatterplotYYaccessor === gene,
};
})
class Gene extends React.Component {
constructor(props) {
class Gene extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
geneIsExpanded: false,
@@ -27,6 +33,7 @@ class Gene extends React.Component {
}
onColorChangeClick = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, gene } = this.props;
dispatch(actions.requestSingleGeneExpressionCountsForColoringPOST(gene));
};
@@ -37,6 +44,7 @@ class Gene extends React.Component {
};
handleSetGeneAsScatterplotX = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, gene } = this.props;
dispatch({
type: "set scatterplot x",
@@ -45,6 +53,7 @@ class Gene extends React.Component {
};
handleSetGeneAsScatterplotY = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, gene } = this.props;
dispatch({
type: "set scatterplot y",
@@ -53,18 +62,26 @@ class Gene extends React.Component {
};
handleDeleteGeneFromSet = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, gene, geneset } = this.props;
dispatch(actions.genesetDeleteGenes(geneset, [gene]));
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'gene' does not exist on type 'Readonly<{... Remove this comment to see the full error message
gene,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'geneDescription' does not exist on type ... Remove this comment to see the full error message
geneDescription,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isColorAccessor' does not exist on type ... Remove this comment to see the full error message
isColorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotXXaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotXXaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isScatterplotYYaccessor' does not exist ... Remove this comment to see the full error message
isScatterplotYYaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'quickGene' does not exist on type 'Reado... Remove this comment to see the full error message
quickGene,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'removeGene' does not exist on type 'Read... Remove this comment to see the full error message
removeGene,
} = this.props;
const { geneIsExpanded } = this.state;
@@ -84,6 +101,7 @@ class Gene extends React.Component {
>
<div
role="menuitem"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="0"
data-testclass="gene-expand"
data-testid={`${gene}:gene-expand`}
@@ -124,6 +142,7 @@ class Gene extends React.Component {
</div>
{!geneIsExpanded ? (
<HistogramBrush
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
isUserDefined
field={gene}
mini
@@ -188,6 +207,7 @@ class Gene extends React.Component {
/>
</div>
</div>
{/* @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call. */}
{geneIsExpanded && <HistogramBrush isUserDefined field={gene} />}
</div>
);
client/src/components/geneExpression/geneSet.js → client/src/components/geneExpression/geneSet.tsx
+11 -2
View File
@@ -9,8 +9,10 @@ import HistogramBrush from "../brushableHistogram";
import { diffexpPopNamePrefix1, diffexpPopNamePrefix2 } from "../../globals";
class GeneSet extends React.Component {
constructor(props) {
type State = any;
class GeneSet extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
isOpen: false,
@@ -23,6 +25,7 @@ class GeneSet extends React.Component {
};
renderGenes() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'setName' does not exist on type 'Readonl... Remove this comment to see the full error message
const { setName, setGenes } = this.props;
const setGenesNames = [...setGenes.keys()];
return (
@@ -32,6 +35,7 @@ class GeneSet extends React.Component {
return (
<Gene
key={gene}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ key: any; gene: any; geneDescription: any;... Remove this comment to see the full error message
gene={gene}
geneDescription={geneDescription}
geneset={setName}
@@ -43,6 +47,7 @@ class GeneSet extends React.Component {
}
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'setName' does not exist on type 'Readonl... Remove this comment to see the full error message
const { setName, genesetDescription, setGenes } = this.props;
const { isOpen } = this.state;
const genesetNameLengthVisible = 150; /* this magic number determines how much of a long geneset name we see */
@@ -65,6 +70,7 @@ class GeneSet extends React.Component {
>
<span
role="menuitem"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="0"
data-testclass={testClass}
data-testid={`${setName}:geneset-expand`}
@@ -104,6 +110,7 @@ class GeneSet extends React.Component {
)}
</span>
<div>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ isOpen: any; genesetsEditable: true; genes... Remove this comment to see the full error message */}
<GenesetMenus isOpen={isOpen} genesetsEditable geneset={setName} />
</div>
</div>
@@ -117,6 +124,7 @@ class GeneSet extends React.Component {
</div>
{isOpen && !genesetIsEmpty && (
<HistogramBrush
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
isGeneSetSummary
field={setName}
setGenes={setGenes}
@@ -124,6 +132,7 @@ class GeneSet extends React.Component {
)}
{isOpen && !genesetIsEmpty && this.renderGenes()}
<EditGenesetNameDialogue
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ parentGeneset: any; parentGenesetDescripti... Remove this comment to see the full error message
parentGeneset={setName}
parentGenesetDescription={genesetDescription}
/>
client/src/components/geneExpression/index.js → client/src/components/geneExpression/index.tsx
+12 -5
View File
@@ -7,25 +7,30 @@ import GeneSet from "./geneSet";
import QuickGene from "./quickGene";
import CreateGenesetDialogue from "./menus/createGenesetDialogue";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
return {
genesets: state.genesets.genesets,
genesets: (state as any).genesets.genesets,
};
})
class GeneExpression extends React.Component {
constructor(props) {
class GeneExpression extends React.Component<{}, State> {
constructor(props: {}) {
super(props);
this.state = { geneSetsExpanded: true };
}
renderGeneSets = () => {
const sets = [];
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesets' does not exist on type 'Readon... Remove this comment to see the full error message
const { genesets } = this.props;
for (const [name, geneset] of genesets) {
sets.push(
<GeneSet
key={name}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ key: any; setGenes: any; setName: any; gen... Remove this comment to see the full error message
setGenes={geneset.genes}
setName={name}
genesetDescription={geneset.genesetDescription}
@@ -36,18 +41,19 @@ class GeneExpression extends React.Component {
};
handleActivateCreateGenesetMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
const { geneSetsExpanded } = this.state;
dispatch({ type: "geneset: activate add new geneset mode" });
if (!geneSetsExpanded) {
this.setState((state) => {
this.setState((state: any) => {
return { ...state, geneSetsExpanded: true };
});
}
};
handleExpandGeneSets = () => {
this.setState((state) => {
this.setState((state: any) => {
return { ...state, geneSetsExpanded: !state.geneSetsExpanded };
});
};
@@ -67,6 +73,7 @@ class GeneExpression extends React.Component {
>
<H4
role="menuitem"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="0"
data-testclass="geneset-heading-expand"
onKeyPress={this.handleExpandGeneSets}
client/src/components/geneExpression/menus/addGeneToGenesetDialogue.js → client/src/components/geneExpression/menus/addGeneToGenesetDialogue.tsx
+14 -11
View File
@@ -5,11 +5,14 @@ import LabelInput from "../../labelInput";
import parseBulkGeneString from "../../../util/parseBulkGeneString";
import actions from "../../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
genesetsUI: state.genesetsUI,
genesetsUI: (state as any).genesetsUI,
}))
class AddGeneToGenesetDialogue extends React.PureComponent {
constructor(props) {
class AddGeneToGenesetDialogue extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
genesToAdd: "",
@@ -17,26 +20,24 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
}
disableAddGeneMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({
type: "geneset: disable add new genes mode",
});
};
handleAddGeneToGeneSet = (e) => {
handleAddGeneToGeneSet = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'geneset' does not exist on type 'Readonl... Remove this comment to see the full error message
const { geneset, dispatch } = this.props;
const { genesToAdd } = this.state;
const genesTmpHardcodedFormat = [];
const genesTmpHardcodedFormat: any = [];
const genesArrayFromString = parseBulkGeneString(genesToAdd);
genesArrayFromString.forEach((_gene) => {
genesTmpHardcodedFormat.push({
geneSymbol: _gene,
});
});
dispatch(actions.genesetAddGenes(geneset, genesTmpHardcodedFormat));
dispatch({
type: "geneset: disable add new genes mode",
@@ -44,17 +45,18 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
if (e) e.preventDefault();
};
handleChange = (e) => {
handleChange = (e: any) => {
this.setState({ genesToAdd: e });
};
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'geneset' does not exist on type 'Readonl... Remove this comment to see the full error message
const { geneset, genesetsUI } = this.props;
const { genesToAdd } = this.state;
return (
<>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: boolean; inputProps: { "data-tes... Remove this comment to see the full error message
isActive={genesetsUI.isAddingGenesToGeneset === geneset}
inputProps={{ "data-testid": `${geneset}:create-label-dialog` }}
primaryButtonProps={{
@@ -68,6 +70,7 @@ class AddGeneToGenesetDialogue extends React.PureComponent {
validationError={false}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ onChange: (e: any) => void; inputProps: { ... Remove this comment to see the full error message
onChange={this.handleChange}
inputProps={{
"data-testid": "add-genes",
client/src/components/geneExpression/menus/addGenes.js → client/src/components/geneExpression/menus/addGenes.tsx
+23 -14
View File
@@ -20,7 +20,7 @@ import {
import { memoize } from "../../../util/dataframe/util";
import parseBulkGeneString from "../../../util/parseBulkGeneString";
const renderGene = (fuzzySortResult, { handleClick, modifiers }) => {
const renderGene = (fuzzySortResult: any, { handleClick, modifiers }: any) => {
if (!modifiers.matchesPredicate) {
return null;
}
@@ -33,8 +33,7 @@ const renderGene = (fuzzySortResult, { handleClick, modifiers }) => {
disabled={modifiers.disabled}
data-testid={`suggest-menu-item-${geneName}`}
key={geneName}
onClick={(g) =>
/* this fires when user clicks a menu item */
onClick={(g: any /* this fires when user clicks a menu item */) =>
handleClick(g)
}
text={geneName}
@@ -42,22 +41,25 @@ const renderGene = (fuzzySortResult, { handleClick, modifiers }) => {
);
};
const filterGenes = (query, genes) =>
const filterGenes = (query: any, genes: any) =>
/* fires on load, once, and then for each character typed into the input */
fuzzysort.go(query, genes, {
limit: 5,
threshold: -10000, // don't return bad results
});
type AddGenesState = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
return {
annoMatrix: state.annoMatrix,
userDefinedGenes: state.controls.userDefinedGenes,
userDefinedGenesLoading: state.controls.userDefinedGenesLoading,
annoMatrix: (state as any).annoMatrix,
userDefinedGenes: (state as any).controls.userDefinedGenes,
userDefinedGenesLoading: (state as any).controls.userDefinedGenesLoading,
};
})
class AddGenes extends React.Component {
constructor(props) {
class AddGenes extends React.Component<{}, AddGenesState> {
constructor(props: {}) {
super(props);
this.state = {
bulkAdd: "",
@@ -69,14 +71,16 @@ class AddGenes extends React.Component {
}
componentDidMount() {
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
this.updateState();
}
componentDidUpdate(prevProps) {
componentDidUpdate(prevProps: {}) {
this.updateState(prevProps);
}
handleClick(g) {
handleClick(g: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, userDefinedGenes } = this.props;
const { geneNames } = this.state;
if (!g) return;
@@ -96,7 +100,7 @@ class AddGenes extends React.Component {
}
}
_genesToUpper = (listGenes) => {
_genesToUpper = (listGenes: any) => {
// Has to be a Map to preserve index
const upperGenes = new Map();
for (let i = 0, { length } = listGenes; i < length; i += 1) {
@@ -107,9 +111,10 @@ class AddGenes extends React.Component {
};
// eslint-disable-next-line react/sort-comp -- memo requires a defined _genesToUpper
_memoGenesToUpper = memoize(this._genesToUpper, (arr) => arr);
_memoGenesToUpper = memoize(this._genesToUpper, (arr: any) => arr);
handleBulkAddClick = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, userDefinedGenes } = this.props;
const { bulkAdd, geneNames } = this.state;
@@ -159,7 +164,8 @@ class AddGenes extends React.Component {
return undefined;
};
async updateState(prevProps) {
async updateState(prevProps: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
if (!annoMatrix) return;
if (annoMatrix !== prevProps?.annoMatrix) {
@@ -210,6 +216,7 @@ class AddGenes extends React.Component {
}
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'userDefinedGenesLoading' does not exist ... Remove this comment to see the full error message
const { userDefinedGenesLoading } = this.props;
const { tab, bulkAdd, activeItem, status, geneNames } = this.state;
@@ -265,10 +272,12 @@ class AddGenes extends React.Component {
this.handleClick(g);
}}
initialContent={<MenuItem disabled text="Enter a gene…" />}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ "data-testid": string; }' is not assignabl... Remove this comment to see the full error message
inputProps={{ "data-testid": "gene-search" }}
inputValueRenderer={() => {
return "";
}}
// @ts-expect-error ts-migrate(2322) FIXME: Type '(query: any, genes: any) => Fuzzysort.Result... Remove this comment to see the full error message
itemListPredicate={filterGenes}
onActiveItemChange={(item) => this.setState({ activeItem: item })}
itemRenderer={renderGene}
client/src/components/geneExpression/menus/createGenesetDialogue.js → client/src/components/geneExpression/menus/createGenesetDialogue.tsx
+25 -21
View File
@@ -7,15 +7,18 @@ import { Tooltip2 } from "@blueprintjs/popover2";
import LabelInput from "../../labelInput";
import actions from "../../../actions";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
schema: state.annoMatrix?.schema,
obsCrossfilter: state.obsCrossfilter,
genesets: state.genesets.genesets,
genesetsUI: state.genesetsUI,
annotations: (state as any).annotations,
schema: (state as any).annoMatrix?.schema,
obsCrossfilter: (state as any).obsCrossfilter,
genesets: (state as any).genesets.genesets,
genesetsUI: (state as any).genesetsUI,
}))
class CreateGenesetDialogue extends React.PureComponent {
constructor(props) {
class CreateGenesetDialogue extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
genesetName: "",
@@ -24,7 +27,8 @@ class CreateGenesetDialogue extends React.PureComponent {
};
}
disableCreateGenesetMode = (e) => {
disableCreateGenesetMode = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
this.setState({
genesetName: "",
@@ -38,33 +42,30 @@ class CreateGenesetDialogue extends React.PureComponent {
if (e) e.preventDefault();
};
createGeneset = (e) => {
createGeneset = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
const {
genesetName,
genesToPopulateGeneset,
genesetDescription,
} = this.state;
dispatch({
type: "geneset: create",
genesetName: genesetName.trim(),
genesetDescription,
});
if (genesToPopulateGeneset) {
const genesTmpHardcodedFormat = [];
const genesTmpHardcodedFormat: any = [];
const genesArrayFromString = pull(
uniq(genesToPopulateGeneset.split(/[ ,]+/)),
""
);
genesArrayFromString.forEach((_gene) => {
genesTmpHardcodedFormat.push({
geneSymbol: _gene,
});
});
dispatch(actions.genesetAddGenes(genesetName, genesTmpHardcodedFormat));
}
dispatch({
@@ -81,34 +82,34 @@ class CreateGenesetDialogue extends React.PureComponent {
return false;
};
handleChange = (e) => {
handleChange = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesets' does not exist on type 'Readon... Remove this comment to see the full error message
const { genesets } = this.props;
this.setState({ genesetName: e });
this.validate(e, genesets);
};
handleGenesetInputChange = (e) => {
handleGenesetInputChange = (e: any) => {
this.setState({ genesToPopulateGeneset: e });
};
handleDescriptionInputChange = (e) => {
handleDescriptionInputChange = (e: any) => {
this.setState({ genesetDescription: e });
};
instruction = (genesetName, genesets) => {
instruction = (genesetName: any, genesets: any) => {
return genesets.has(genesetName)
? "Gene set name must be unique."
: "New, unique gene set name";
};
validate = (genesetName, genesets) => {
validate = (genesetName: any, genesets: any) => {
if (genesets.has(genesetName)) {
this.setState({
nameErrorMessage: "There is already a geneset with that name",
});
return false;
}
if (
genesetName.length > 1 &&
// eslint-disable-next-line no-control-regex -- unicode 0-31 127-65535
@@ -128,8 +129,8 @@ class CreateGenesetDialogue extends React.PureComponent {
render() {
const { genesetName, nameErrorMessage } = this.state;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesetsUI' does not exist on type 'Read... Remove this comment to see the full error message
const { genesetsUI, genesets } = this.props;
return (
<>
<Dialog
@@ -147,6 +148,7 @@ class CreateGenesetDialogue extends React.PureComponent {
<div style={{ marginBottom: 20 }}>
<p>{this.instruction(genesetName, genesets)}</p>
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ onChange: (e: any) => void; inputProps: { ... Remove this comment to see the full error message
onChange={this.handleChange}
inputProps={{
"data-testid": "create-geneset-input",
@@ -171,6 +173,7 @@ class CreateGenesetDialogue extends React.PureComponent {
gene set
</p>
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ onChange: (e: any) => void; inputProps: { ... Remove this comment to see the full error message
onChange={this.handleDescriptionInputChange}
inputProps={{
"data-testid": "add-geneset-description",
@@ -186,6 +189,7 @@ class CreateGenesetDialogue extends React.PureComponent {
gene set
</p>
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ onChange: (e: any) => void; inputProps: { ... Remove this comment to see the full error message
onChange={this.handleGenesetInputChange}
inputProps={{
"data-testid": "add-genes",
client/src/components/geneExpression/menus/editGenesetNameDialogue.js → client/src/components/geneExpression/menus/editGenesetNameDialogue.tsx
+26 -14
View File
@@ -3,23 +3,29 @@ import { connect } from "react-redux";
import AnnoDialog from "../../annoDialog";
import LabelInput from "../../labelInput";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annotations: state.annotations,
schema: state.annoMatrix?.schema,
obsCrossfilter: state.obsCrossfilter,
genesetsUI: state.genesetsUI,
genesets: state.genesets.genesets,
annotations: (state as any).annotations,
schema: (state as any).annoMatrix?.schema,
obsCrossfilter: (state as any).obsCrossfilter,
genesetsUI: (state as any).genesetsUI,
genesets: (state as any).genesets.genesets,
}))
class RenameGeneset extends React.PureComponent {
constructor(props) {
class RenameGeneset extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'parentGeneset' does not exist on type '{... Remove this comment to see the full error message
newGenesetName: props.parentGeneset,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'parentGenesetDescription' does not exist... Remove this comment to see the full error message
newGenesetDescription: props.parentGenesetDescription,
};
}
disableEditGenesetNameMode = (e) => {
disableEditGenesetNameMode = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
this.setState({
newGenesetName: "",
@@ -31,10 +37,10 @@ class RenameGeneset extends React.PureComponent {
if (e) e.preventDefault();
};
renameGeneset = (e) => {
renameGeneset = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, genesetsUI } = this.props;
const { newGenesetName, newGenesetDescription } = this.state;
dispatch({
type: "geneset: update",
genesetName: genesetsUI.isEditingGenesetName,
@@ -53,15 +59,15 @@ class RenameGeneset extends React.PureComponent {
return false;
};
handleChange = (e) => {
handleChange = (e: any) => {
this.setState({ newGenesetName: e });
};
handleChangeDescription = (e) => {
handleChangeDescription = (e: any) => {
this.setState({ newGenesetDescription: e });
};
validate = (genesetName, genesets) => {
validate = (genesetName: any, genesets: any) => {
return (
!genesets.has(genesetName) &&
// eslint-disable-next-line no-control-regex -- unicode 0-31 127-65535
@@ -73,15 +79,19 @@ class RenameGeneset extends React.PureComponent {
render() {
const { newGenesetName, newGenesetDescription } = this.state;
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesetsUI' does not exist on type 'Read... Remove this comment to see the full error message
genesetsUI,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'parentGeneset' does not exist on type 'Read... Remove this comment to see the full error message
parentGeneset,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'parentGenesetDescription' does not exist on type 'Read... Remove this comment to see the full error message
parentGenesetDescription,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'genesets' does not exist on type 'Read... Remove this comment to see the full error message
genesets,
} = this.props;
return (
<>
<AnnoDialog
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ isActive: boolean; inputProps: { "data-tes... Remove this comment to see the full error message
isActive={genesetsUI.isEditingGenesetName === parentGeneset}
inputProps={{
"data-testid": `${genesetsUI.isEditingGenesetName}:rename-geneset-dialog`,
@@ -101,6 +111,7 @@ class RenameGeneset extends React.PureComponent {
}
annoInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ label: any; onChange: (e: any) => void; in... Remove this comment to see the full error message
label={newGenesetName}
onChange={this.handleChange}
inputProps={{
@@ -114,6 +125,7 @@ class RenameGeneset extends React.PureComponent {
secondaryInstructions="Edit description"
secondaryInput={
<LabelInput
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ label: any; onChange: (e: any) => void; in... Remove this comment to see the full error message
label={newGenesetDescription}
onChange={this.handleChangeDescription}
inputProps={{ "data-testid": "change geneset description" }}
client/src/components/geneExpression/menus/genesetMenus.js → client/src/components/geneExpression/menus/genesetMenus.tsx
+13 -4
View File
@@ -17,19 +17,23 @@ import * as globals from "../../../globals";
import actions from "../../../actions";
import AddGeneToGenesetDialogue from "./addGeneToGenesetDialogue";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
return {
genesetsUI: state.genesetsUI,
colorAccessor: state.colors.colorAccessor,
genesetsUI: (state as any).genesetsUI,
colorAccessor: (state as any).colors.colorAccessor,
};
})
class GenesetMenus extends React.PureComponent {
constructor(props) {
class GenesetMenus extends React.PureComponent<{}, State> {
constructor(props: {}) {
super(props);
this.state = {};
}
activateAddGeneToGenesetMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, geneset } = this.props;
dispatch({
type: "geneset: activate add new genes mode",
@@ -38,6 +42,7 @@ class GenesetMenus extends React.PureComponent {
};
activateEditGenesetNameMode = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, geneset } = this.props;
dispatch({
@@ -47,6 +52,7 @@ class GenesetMenus extends React.PureComponent {
};
handleColorByEntireGeneset = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, geneset } = this.props;
dispatch({
@@ -56,11 +62,13 @@ class GenesetMenus extends React.PureComponent {
};
handleDeleteGeneset = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, geneset } = this.props;
dispatch(actions.genesetDelete(geneset));
};
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'geneset' does not exist on type 'Readonl... Remove this comment to see the full error message
const { geneset, genesetsEditable, createText, colorAccessor } = this.props;
const isColorBy = geneset === colorAccessor;
@@ -84,6 +92,7 @@ class GenesetMenus extends React.PureComponent {
minimal
/>
</Tooltip2>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ geneset: any; }' is not assignable to type... Remove this comment to see the full error message */}
<AddGeneToGenesetDialogue geneset={geneset} />
<Popover
interactionKind={PopoverInteractionKind.HOVER}
client/src/components/geneExpression/quickGene.js → client/src/components/geneExpression/quickGene.tsx
+21 -12
View File
@@ -10,7 +10,7 @@ import Gene from "./gene";
import { postUserErrorToast } from "../framework/toasters";
import actions from "../../actions";
const usePrevious = (value) => {
const usePrevious = (value: any) => {
const ref = useRef();
useEffect(() => {
ref.current = value;
@@ -28,18 +28,20 @@ function QuickGene() {
const { annoMatrix, userDefinedGenes, userDefinedGenesLoading } = useSelector(
(state) => {
return {
annoMatrix: state.annoMatrix,
userDefinedGenes: state.controls.userDefinedGenes,
userDefinedGenesLoading: state.controls.userDefinedGenesLoading,
annoMatrix: (state as any).annoMatrix,
userDefinedGenes: (state as any).controls.userDefinedGenes,
userDefinedGenesLoading: (state as any).controls
.userDefinedGenesLoading,
};
}
);
const prevProps = usePrevious({ annoMatrix });
// @ts-expect-error ts-migrate(2345) FIXME: Argument of type '() => Promise<void>' is not assi... Remove this comment to see the full error message
useEffect(async () => {
if (!annoMatrix) return;
if (annoMatrix !== prevProps?.annoMatrix) {
if (annoMatrix !== (prevProps as any)?.annoMatrix) {
const { schema } = annoMatrix;
const varIndex = schema.annotations.var.index;
@@ -57,7 +59,10 @@ function QuickGene() {
const handleExpand = () => setIsExpanded(!isExpanded);
const renderGene = (fuzzySortResult, { handleClick, modifiers }) => {
const renderGene = (
fuzzySortResult: any,
{ handleClick, modifiers }: any
) => {
if (!modifiers.matchesPredicate) {
return null;
}
@@ -70,8 +75,7 @@ function QuickGene() {
disabled={modifiers.disabled}
data-testid={`suggest-menu-item-${geneName}`}
key={geneName}
onClick={(g) =>
/* this fires when user clicks a menu item */
onClick={(g: any /* this fires when user clicks a menu item */) =>
handleClick(g)
}
text={geneName}
@@ -79,11 +83,12 @@ function QuickGene() {
);
};
const handleClick = (g) => {
const handleClick = (g: any) => {
if (!g) return;
const gene = g.target;
if (userDefinedGenes.indexOf(gene) !== -1) {
postUserErrorToast("That gene already exists");
// @ts-expect-error ts-migrate(2345) FIXME: Argument of type 'any' is not assignable to parame... Remove this comment to see the full error message
} else if (geneNames.indexOf(gene) === undefined) {
postUserErrorToast("That doesn't appear to be a valid gene name.");
} else {
@@ -93,22 +98,23 @@ function QuickGene() {
}
};
const filterGenes = (query, genes) =>
const filterGenes = (query: any, genes: any) =>
/* fires on load, once, and then for each character typed into the input */
fuzzysort.go(query, genes, {
limit: 5,
threshold: -10000, // don't return bad results
});
const removeGene = (gene) => () => {
const removeGene = (gene: any) => () => {
dispatch({ type: "clear user defined gene", data: gene });
};
const QuickGenes = useMemo(() => {
return userDefinedGenes.map((gene) => {
return userDefinedGenes.map((gene: any) => {
return (
<Gene
key={`quick=${gene}`}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ key: string; gene: any; removeGene: (gene:... Remove this comment to see the full error message
gene={gene}
removeGene={removeGene}
quickGene
@@ -121,6 +127,7 @@ function QuickGene() {
<div style={{ width: "100%", marginBottom: "16px" }}>
<H4
role="menuitem"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
tabIndex="0"
data-testclass="quickgene-heading-expand"
onKeyPress={handleExpand}
@@ -151,6 +158,7 @@ function QuickGene() {
}}
initialContent={<MenuItem disabled text="Enter a gene…" />}
inputProps={{
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ "data-testid": string; placeholder: string... Remove this comment to see the full error message
"data-testid": "gene-search",
placeholder: "Quick Gene Search",
leftIcon: IconNames.SEARCH,
@@ -159,6 +167,7 @@ function QuickGene() {
inputValueRenderer={() => {
return "";
}}
// @ts-expect-error ts-migrate(2322) FIXME: Type '(query: any, genes: any) => Fuzzysort.Result... Remove this comment to see the full error message
itemListPredicate={filterGenes}
itemRenderer={renderGene}
items={geneNames || ["No genes"]}
client/src/components/graph/drawPointsRegl.js → client/src/components/graph/drawPointsRegl.ts
+1 -1
View File
@@ -1,6 +1,6 @@
import { glPointFlags, glPointSize } from "../../util/glHelpers";
export default function drawPointsRegl(regl) {
export default function drawPointsRegl(regl: any) {
return regl({
vert: `
precision mediump float;
client/src/components/graph/graph.js → client/src/components/graph/graph.tsx
+160 -139
View File
@@ -34,7 +34,7 @@ Simple 2D transforms control all point painting. There are three:
* camera - apply a 2D camera transformation (pan, zoom)
* projection - apply any transformation required for screen size and layout
*/
function createProjectionTF(viewportWidth, viewportHeight) {
function createProjectionTF(viewportWidth: any, viewportHeight: any) {
/*
the projection transform accounts for the screen size & other layout
*/
@@ -53,6 +53,7 @@ function createProjectionTF(viewportWidth, viewportHeight) {
0,
(bottomGutterSizePx - topGutterSizePx) / viewportHeight / aspectScale[1],
]);
// @ts-expect-error ts-migrate(2345) FIXME: Argument of type 'number[]' is not assignable to p... Remove this comment to see the full error message
mat3.scale(m, m, aspectScale);
return m;
}
@@ -67,32 +68,36 @@ function createModelTF() {
return m;
}
type GraphState = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annoMatrix: state.annoMatrix,
crossfilter: state.obsCrossfilter,
selectionTool: state.graphSelection.tool,
currentSelection: state.graphSelection.selection,
layoutChoice: state.layoutChoice,
graphInteractionMode: state.controls.graphInteractionMode,
colors: state.colors,
pointDilation: state.pointDilation,
genesets: state.genesets.genesets,
annoMatrix: (state as any).annoMatrix,
crossfilter: (state as any).obsCrossfilter,
selectionTool: (state as any).graphSelection.tool,
currentSelection: (state as any).graphSelection.selection,
layoutChoice: (state as any).layoutChoice,
graphInteractionMode: (state as any).controls.graphInteractionMode,
colors: (state as any).colors,
pointDilation: (state as any).pointDilation,
genesets: (state as any).genesets.genesets,
}))
class Graph extends React.Component {
static createReglState(canvas) {
class Graph extends React.Component<{}, GraphState> {
static createReglState(canvas: any) {
/*
Must be created for each canvas
*/
Must be created for each canvas
*/
// setup canvas, webgl draw function and camera
const camera = _camera(canvas);
const regl = _regl(canvas);
const drawPoints = _drawPoints(regl);
// preallocate webgl buffers
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const pointBuffer = regl.buffer();
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const colorBuffer = regl.buffer();
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const flagBuffer = regl.buffer();
return {
camera,
regl,
@@ -103,14 +108,18 @@ class Graph extends React.Component {
};
}
static watchAsync(props, prevProps) {
static watchAsync(props: any, prevProps: any) {
return !shallowEqual(props.watchProps, prevProps.watchProps);
}
cachedAsyncProps: any;
reglCanvas: any;
computePointPositions = memoize((X, Y, modelTF) => {
/*
compute the model coordinate for each point
*/
compute the model coordinate for each point
*/
const positions = new Float32Array(2 * X.length);
for (let i = 0, len = X.length; i < len; i += 1) {
const p = vec2.fromValues(X[i], Y[i]);
@@ -123,8 +132,8 @@ class Graph extends React.Component {
computePointColors = memoize((rgb) => {
/*
compute webgl colors for each point
*/
compute webgl colors for each point
*/
const colors = new Float32Array(3 * rgb.length);
for (let i = 0, len = rgb.length; i < len; i += 1) {
colors.set(rgb[i], 3 * i);
@@ -173,21 +182,20 @@ class Graph extends React.Component {
computePointFlags = memoize(
(crossfilter, colorByData, pointDilationData, pointDilationLabel) => {
/*
We communicate with the shader using three flags:
- isNaN -- the value is a NaN. Only makes sense when we have a colorAccessor
- isSelected -- the value is selected
- isHightlighted -- the value is highlighted in the UI (orthogonal from selection highlighting)
Due to constraints in webgl vertex shader attributes, these are encoded in a float, "kinda"
like bitmasks.
We also have separate code paths for generating flags for categorical and
continuous metadata, as they rely on different tests, and some of the flags
(eg, isNaN) are meaningless in the face of categorical metadata.
*/
We communicate with the shader using three flags:
- isNaN -- the value is a NaN. Only makes sense when we have a colorAccessor
- isSelected -- the value is selected
- isHightlighted -- the value is highlighted in the UI (orthogonal from selection highlighting)
Due to constraints in webgl vertex shader attributes, these are encoded in a float, "kinda"
like bitmasks.
We also have separate code paths for generating flags for categorical and
continuous metadata, as they rely on different tests, and some of the flags
(eg, isNaN) are meaningless in the face of categorical metadata.
*/
const nObs = crossfilter.size();
const flags = new Float32Array(nObs);
const selectedFlags = this.computeSelectedFlags(
crossfilter,
flagSelected,
@@ -199,16 +207,14 @@ class Graph extends React.Component {
pointDilationLabel
);
const colorByFlags = this.computeColorByFlags(nObs, colorByData);
for (let i = 0; i < nObs; i += 1) {
flags[i] = selectedFlags[i] + highlightFlags[i] + colorByFlags[i];
}
return flags;
}
);
constructor(props) {
constructor(props: {}) {
super(props);
const viewport = this.getViewportDimensions();
this.reglCanvas = null;
@@ -219,20 +225,18 @@ class Graph extends React.Component {
tool: null,
container: null,
viewport,
// projection
camera: null,
modelTF,
// @ts-expect-error ts-migrate(2345) FIXME: Argument of type '[]' is not assignable to paramet... Remove this comment to see the full error message
modelInvTF: mat3.invert([], modelTF),
projectionTF: createProjectionTF(viewport.width, viewport.height),
// regl state
regl: null,
drawPoints: null,
pointBuffer: null,
colorBuffer: null,
flagBuffer: null,
// component rendering derived state - these must stay synchronized
// with the reducer state they were generated from.
layoutState: {
@@ -255,10 +259,13 @@ class Graph extends React.Component {
window.addEventListener("resize", this.handleResize);
}
componentDidUpdate(prevProps, prevState) {
componentDidUpdate(prevProps: {}, prevState: GraphState) {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type 'R... Remove this comment to see the full error message
selectionTool,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'currentSelection' does not exist on type 'R... Remove this comment to see the full error message
currentSelection,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'graphInteractionMode' does not exist on type 'R... Remove this comment to see the full error message
graphInteractionMode,
} = this.props;
const { toolSVG, viewport } = this.state;
@@ -266,11 +273,12 @@ class Graph extends React.Component {
prevState.viewport.height !== viewport.height ||
prevState.viewport.width !== viewport.width;
let stateChanges = {};
if (
(viewport.height && viewport.width && !toolSVG) || // first time init
hasResized || // window size has changed we want to recreate all SVGs
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type '{... Remove this comment to see the full error message
selectionTool !== prevProps.selectionTool || // change of selection tool
// @ts-expect-error ts-migrate(2339) FIXME: Property 'graphInteractionMode' does not exist on ... Remove this comment to see the full error message
prevProps.graphInteractionMode !== graphInteractionMode // lasso/zoom mode is switched
) {
stateChanges = {
@@ -278,19 +286,23 @@ class Graph extends React.Component {
...this.createToolSVG(),
};
}
/*
if the selection tool or state has changed, ensure that the selection
tool correctly reflects the underlying selection.
*/
if the selection tool or state has changed, ensure that the selection
tool correctly reflects the underlying selection.
*/
if (
// @ts-expect-error ts-migrate(2339) FIXME: Property 'currentSelection' does not exist on type... Remove this comment to see the full error message
currentSelection !== prevProps.currentSelection ||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'graphInteractionMode' does not exist on ... Remove this comment to see the full error message
graphInteractionMode !== prevProps.graphInteractionMode ||
// @ts-expect-error ts-migrate(2339) FIXME: Property 'toolSVG' does not exist on type '{}'.
stateChanges.toolSVG
) {
const { tool, container } = this.state;
this.selectionToolUpdate(
// @ts-expect-error ts-migrate(2339) FIXME: Property 'tool' does not exist on type '{}'.
stateChanges.tool ? stateChanges.tool : tool,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'container' does not exist on type '{}'.
stateChanges.container ? stateChanges.container : container
);
}
@@ -315,12 +327,12 @@ class Graph extends React.Component {
});
};
handleCanvasEvent = (e) => {
handleCanvasEvent = (e: any) => {
const { camera, projectionTF } = this.state;
if (e.type !== "wheel") e.preventDefault();
if (camera.handleEvent(e, projectionTF)) {
this.renderCanvas();
this.setState((state) => {
this.setState((state: any) => {
return { ...state, updateOverlay: !state.updateOverlay };
});
}
@@ -328,16 +340,18 @@ class Graph extends React.Component {
handleBrushDragAction() {
/*
event describing brush position:
@-------|
| |
| |
|-------@
*/
event describing brush position:
@-------|
| |
| |
|-------@
*/
// ignore programatically generated events
// @ts-expect-error ts-migrate(2339) FIXME: Property 'event' does not exist on type 'typeof im... Remove this comment to see the full error message
if (d3.event.sourceEvent === null || !d3.event.selection) return;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'event' does not exist on type 'typeof im... Remove this comment to see the full error message
const s = d3.event.selection;
const northwest = this.mapScreenToPoint(s[0]);
const southeast = this.mapScreenToPoint(s[1]);
@@ -357,21 +371,24 @@ class Graph extends React.Component {
handleBrushStartAction() {
// Ignore programatically generated events.
// @ts-expect-error ts-migrate(2339) FIXME: Property 'event' does not exist on type 'typeof im... Remove this comment to see the full error message
if (!d3.event.sourceEvent) return;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch(actions.graphBrushStartAction());
}
handleBrushEndAction() {
// Ignore programatically generated events.
// @ts-expect-error ts-migrate(2339) FIXME: Property 'event' does not exist on type 'typeof im... Remove this comment to see the full error message
if (!d3.event.sourceEvent) return;
/*
coordinates will be included if selection made, null
if selection cleared.
*/
coordinates will be included if selection made, null
if selection cleared.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'event' does not exist on type 'typeof im... Remove this comment to see the full error message
const s = d3.event.selection;
if (s) {
const northwest = this.mapScreenToPoint(s[0]);
@@ -394,20 +411,23 @@ class Graph extends React.Component {
}
handleBrushDeselectAction() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
dispatch(actions.graphBrushDeselectAction(layoutChoice.current));
}
handleLassoStart() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
// @ts-expect-error ts-migrate(2554) FIXME: Expected 0 arguments, but got 1.
dispatch(actions.graphLassoStartAction(layoutChoice.current));
}
// when a lasso is completed, filter to the points within the lasso polygon
handleLassoEnd(polygon) {
handleLassoEnd(polygon: any) {
const minimumPolygonArea = 10;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
if (
polygon.length < 3 ||
Math.abs(d3.polygonArea(polygon)) < minimumPolygonArea
@@ -418,29 +438,33 @@ class Graph extends React.Component {
dispatch(
actions.graphLassoEndAction(
layoutChoice.current,
polygon.map((xy) => this.mapScreenToPoint(xy))
polygon.map((xy: any) => this.mapScreenToPoint(xy))
)
);
}
}
handleLassoCancel() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
dispatch(actions.graphLassoCancelAction(layoutChoice.current));
}
handleLassoDeselectAction() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, layoutChoice } = this.props;
dispatch(actions.graphLassoDeselectAction(layoutChoice.current));
}
handleDeselectAction() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type 'R... Remove this comment to see the full error message
const { selectionTool } = this.props;
if (selectionTool === "brush") this.handleBrushDeselectAction();
if (selectionTool === "lasso") this.handleLassoDeselectAction();
}
handleOpacityRangeChange(e) {
handleOpacityRangeChange(e: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({
type: "change opacity deselected cells in 2d graph background",
@@ -448,7 +472,7 @@ class Graph extends React.Component {
});
}
setReglCanvas = (canvas) => {
setReglCanvas = (canvas: any) => {
this.reglCanvas = canvas;
this.setState({
...Graph.createReglState(canvas),
@@ -456,6 +480,7 @@ class Graph extends React.Component {
};
getViewportDimensions = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'viewportRef' does not exist on type 'Rea... Remove this comment to see the full error message
const { viewportRef } = this.props;
return {
height: viewportRef.clientHeight,
@@ -465,17 +490,16 @@ class Graph extends React.Component {
createToolSVG = () => {
/*
Called from componentDidUpdate. Create the tool SVG, and return any
state changes that should be passed to setState().
*/
Called from componentDidUpdate. Create the tool SVG, and return any
state changes that should be passed to setState().
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type 'R... Remove this comment to see the full error message
const { selectionTool, graphInteractionMode } = this.props;
const { viewport } = this.state;
/* clear out whatever was on the div, even if nothing, but usually the brushes etc */
const lasso = d3.select("#lasso-layer");
if (lasso.empty()) return {}; // still initializing
lasso.selectAll(".lasso-group").remove();
// Don't render or recreate toolSVG if currently in zoom mode
if (graphInteractionMode !== "select") {
// don't return "change" of state unless we are really changing it!
@@ -483,7 +507,6 @@ class Graph extends React.Component {
if (toolSVG === undefined) return {};
return { toolSVG: undefined };
}
let handleStart;
let handleDrag;
let handleEnd;
@@ -497,7 +520,6 @@ class Graph extends React.Component {
handleEnd = this.handleLassoEnd.bind(this);
handleCancel = this.handleLassoCancel.bind(this);
}
const { svg: newToolSVG, tool, container } = setupSVGandBrushElements(
selectionTool,
handleStart,
@@ -506,11 +528,10 @@ class Graph extends React.Component {
handleCancel,
viewport
);
return { toolSVG: newToolSVG, tool, container };
};
fetchAsyncProps = async (props) => {
fetchAsyncProps = async (props: any) => {
const {
annoMatrix,
colors: colorsProp,
@@ -520,22 +541,18 @@ class Graph extends React.Component {
viewport,
} = props.watchProps;
const { modelTF } = this.state;
const [layoutDf, colorDf, pointDilationDf] = await this.fetchData(
annoMatrix,
layoutChoice,
colorsProp,
pointDilation
);
const { currentDimNames } = layoutChoice;
const X = layoutDf.col(currentDimNames[0]).asArray();
const Y = layoutDf.col(currentDimNames[1]).asArray();
const positions = this.computePointPositions(X, Y, modelTF);
const colorTable = this.updateColorTable(colorsProp, colorDf);
const colors = this.computePointColors(colorTable.rgb);
const { colorAccessor } = colorsProp;
const colorByData = colorDf?.col(colorAccessor)?.asArray();
const {
@@ -551,7 +568,6 @@ class Graph extends React.Component {
pointDilationData,
pointDilationLabel
);
const { width, height } = viewport;
return {
positions,
@@ -562,19 +578,22 @@ class Graph extends React.Component {
};
};
async fetchData(annoMatrix, layoutChoice, colors, pointDilation) {
async fetchData(
annoMatrix: any,
layoutChoice: any,
colors: any,
pointDilation: any
) {
/*
fetch all data needed. Includes:
- the color by dataframe
- the layout dataframe
- the point dilation dataframe
*/
fetch all data needed. Includes:
- the color by dataframe
- the layout dataframe
- the point dilation dataframe
*/
const { metadataField: pointDilationAccessor } = pointDilation;
const promises = [];
// layout
promises.push(annoMatrix.fetch("emb", layoutChoice.current));
// color
const query = this.createColorByQuery(colors);
if (query) {
@@ -582,30 +601,28 @@ class Graph extends React.Component {
} else {
promises.push(Promise.resolve(null));
}
// point highlighting
if (pointDilationAccessor) {
promises.push(annoMatrix.fetch("obs", pointDilationAccessor));
} else {
promises.push(Promise.resolve(null));
}
return Promise.all(promises);
}
brushToolUpdate(tool, container) {
brushToolUpdate(tool: any, container: any) {
/*
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'currentSelection' does not exist on type... Remove this comment to see the full error message
const { currentSelection } = this.props;
if (container) {
const toolCurrentSelection = d3.brushSelection(container.node());
if (currentSelection.mode === "within-rect") {
/*
if there is a selection, make sure the brush tool matches
*/
if there is a selection, make sure the brush tool matches
*/
const screenCoords = [
this.mapPointToScreen(currentSelection.brushCoords.northwest),
this.mapPointToScreen(currentSelection.brushCoords.southeast),
@@ -620,6 +637,7 @@ class Graph extends React.Component {
for (let x = 0; x < 2; x += 1) {
for (let y = 0; y < 2; y += 1) {
delta += Math.abs(
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
screenCoords[x][y] - toolCurrentSelection[x][y]
);
}
@@ -635,17 +653,18 @@ class Graph extends React.Component {
}
}
lassoToolUpdate(tool) {
lassoToolUpdate(tool: any) {
/*
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'currentSelection' does not exist on type... Remove this comment to see the full error message
const { currentSelection } = this.props;
if (currentSelection.mode === "within-polygon") {
/*
if there is a current selection, make sure the lasso tool matches
*/
const polygon = currentSelection.polygon.map((p) =>
if there is a current selection, make sure the lasso tool matches
*/
const polygon = currentSelection.polygon.map((p: any) =>
this.mapPointToScreen(p)
);
tool.move(polygon);
@@ -654,17 +673,19 @@ class Graph extends React.Component {
}
}
selectionToolUpdate(tool, container) {
selectionToolUpdate(tool: any, container: any) {
/*
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
this is called from componentDidUpdate(), so be very careful using
anything from this.state, which may be updated asynchronously.
*/
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type 'R... Remove this comment to see the full error message
const { selectionTool } = this.props;
switch (selectionTool) {
case "brush":
this.brushToolUpdate(tool, container);
break;
case "lasso":
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 2.
this.lassoToolUpdate(tool, container);
break;
default:
@@ -673,19 +694,16 @@ class Graph extends React.Component {
}
}
mapScreenToPoint(pin) {
mapScreenToPoint(pin: any) {
/*
Map an XY coordinates from screen domain to cell/point range,
accounting for current pan/zoom camera.
*/
Map an XY coordinates from screen domain to cell/point range,
accounting for current pan/zoom camera.
*/
const { camera, projectionTF, modelInvTF, viewport } = this.state;
const cameraInvTF = camera.invView();
/* screen -> gl */
const x = (2 * pin[0]) / viewport.width - 1;
const y = 2 * (1 - pin[1] / viewport.height) - 1;
const xy = vec2.fromValues(x, y);
const projectionInvTF = mat3.invert(mat3.create(), projectionTF);
vec2.transformMat3(xy, xy, projectionInvTF);
@@ -694,19 +712,16 @@ class Graph extends React.Component {
return xy;
}
mapPointToScreen(xyCell) {
mapPointToScreen(xyCell: any) {
/*
Map an XY coordinate from cell/point domain to screen range. Inverse
of mapScreenToPoint()
*/
Map an XY coordinate from cell/point domain to screen range. Inverse
of mapScreenToPoint()
*/
const { camera, projectionTF, modelTF, viewport } = this.state;
const cameraTF = camera.view();
const xy = vec2.transformMat3(vec2.create(), xyCell, modelTF);
vec2.transformMat3(xy, xy, cameraTF);
vec2.transformMat3(xy, xy, projectionTF);
return [
Math.round(((xy[0] + 1) * viewport.width) / 2),
Math.round(-((xy[1] + 1) / 2 - 1) * viewport.height),
@@ -734,12 +749,11 @@ class Graph extends React.Component {
);
});
updateReglAndRender(asyncProps, prevAsyncProps) {
updateReglAndRender(asyncProps: any, prevAsyncProps: any) {
const { positions, colors, flags, height, width } = asyncProps;
this.cachedAsyncProps = asyncProps;
const { pointBuffer, colorBuffer, flagBuffer } = this.state;
let needToRenderCanvas = false;
if (height !== prevAsyncProps?.height || width !== prevAsyncProps?.width) {
needToRenderCanvas = true;
}
@@ -758,10 +772,10 @@ class Graph extends React.Component {
if (needToRenderCanvas) this.renderCanvas();
}
updateColorTable(colors, colorDf) {
updateColorTable(colors: any, colorDf: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
const { schema } = annoMatrix;
/* update color table state */
if (!colors || !colorDf) {
return createColorTable(
@@ -772,7 +786,6 @@ class Graph extends React.Component {
null
);
}
const { colorAccessor, userColors, colorMode } = colors;
return createColorTable(
colorMode,
@@ -783,26 +796,26 @@ class Graph extends React.Component {
);
}
createColorByQuery(colors) {
createColorByQuery(colors: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, genesets } = this.props;
const { schema } = annoMatrix;
const { colorMode, colorAccessor } = colors;
return createColorQuery(colorMode, colorAccessor, schema, genesets);
}
renderPoints(
regl,
drawPoints,
colorBuffer,
pointBuffer,
flagBuffer,
camera,
projectionTF
regl: any,
drawPoints: any,
colorBuffer: any,
pointBuffer: any,
flagBuffer: any,
camera: any,
projectionTF: any
) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
if (!this.reglCanvas || !annoMatrix) return;
const { schema } = annoMatrix;
const cameraTF = camera.view();
const projView = mat3.multiply(mat3.create(), projectionTF, cameraTF);
@@ -827,16 +840,21 @@ class Graph extends React.Component {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'graphInteractionMode' does not exist on ... Remove this comment to see the full error message
graphInteractionMode,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on ... Remove this comment to see the full error message
annoMatrix,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colors' does not exist on ... Remove this comment to see the full error message
colors,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'layoutChoice' does not exist on ... Remove this comment to see the full error message
layoutChoice,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'pointDilation' does not exist on ... Remove this comment to see the full error message
pointDilation,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'crossfilter' does not exist on ... Remove this comment to see the full error message
crossfilter,
} = this.props;
const { modelTF, projectionTF, camera, viewport, regl } = this.state;
const cameraTF = camera?.view()?.slice();
return (
<div
id="graph-wrapper"
@@ -847,6 +865,7 @@ class Graph extends React.Component {
}}
>
<GraphOverlayLayer
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ children: Element; width: any; height: any... Remove this comment to see the full error message
width={viewport.width}
height={viewport.height}
cameraTF={cameraTF}
@@ -906,6 +925,7 @@ class Graph extends React.Component {
}}
>
<Async.Pending initial>
{/* eslint-disable-next-line @typescript-eslint/no-use-before-define --- StillLoading used before defined */}
<StillLoading
displayName={layoutChoice.current}
width={viewport.width}
@@ -914,6 +934,7 @@ class Graph extends React.Component {
</Async.Pending>
<Async.Rejected>
{(error) => (
// eslint-disable-next-line @typescript-eslint/no-use-before-define --- ErrorLoading used before defined
<ErrorLoading
displayName={layoutChoice.current}
error={error}
@@ -936,7 +957,7 @@ class Graph extends React.Component {
}
}
const ErrorLoading = ({ displayName, error, width, height }) => {
const ErrorLoading = ({ displayName, error, width, height }: any) => {
console.log(error); // log to console as this is an unepected error
return (
<div
@@ -952,7 +973,7 @@ const ErrorLoading = ({ displayName, error, width, height }) => {
);
};
const StillLoading = ({ displayName, width, height }) => {
const StillLoading = ({ displayName, width, height }: any) => {
/*
Render a busy/loading indicator
*/
client/src/components/graph/overlays/centroidLabels.js → client/src/components/graph/overlays/centroidLabels.tsx
+33 -26
View File
@@ -6,22 +6,22 @@ import { categoryLabelDisplayStringLongLength } from "../../../globals";
import calcCentroid from "../../../util/centroid";
import { createColorQuery } from "../../../util/stateManager/colorHelpers";
export default
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
annoMatrix: state.annoMatrix,
colors: state.colors,
layoutChoice: state.layoutChoice,
dilatedValue: state.pointDilation.categoryField,
categoricalSelection: state.categoricalSelection,
showLabels: state.centroidLabels?.showLabels,
genesets: state.genesets.genesets,
annoMatrix: (state as any).annoMatrix,
colors: (state as any).colors,
layoutChoice: (state as any).layoutChoice,
dilatedValue: (state as any).pointDilation.categoryField,
categoricalSelection: (state as any).categoricalSelection,
showLabels: (state as any).centroidLabels?.showLabels,
genesets: (state as any).genesets.genesets,
}))
class CentroidLabels extends PureComponent {
static watchAsync(props, prevProps) {
export default class CentroidLabels extends PureComponent {
static watchAsync(props: any, prevProps: any) {
return !shallowEqual(props.watchProps, prevProps.watchProps);
}
fetchAsyncProps = async (props) => {
fetchAsyncProps = async (props: any) => {
const {
annoMatrix,
colors,
@@ -31,7 +31,6 @@ class CentroidLabels extends PureComponent {
} = props.watchProps;
const { schema } = annoMatrix;
const { colorAccessor } = colors;
const [layoutDf, colorDf] = await this.fetchData();
let labels;
if (colorDf) {
@@ -45,10 +44,9 @@ class CentroidLabels extends PureComponent {
} else {
labels = new Map();
}
// @ts-expect-error ts-migrate(2339) FIXME: Property 'overlaySetShowing' does not exist on typ... Remove this comment to see the full error message
const { overlaySetShowing } = this.props;
overlaySetShowing("centroidLabels", showLabels && labels.size > 0);
return {
labels,
colorAccessor,
@@ -56,7 +54,9 @@ class CentroidLabels extends PureComponent {
};
};
handleMouseEnter = (e, colorAccessor, label) => {
// @ts-expect-error ts-migrate(6133) FIXME: 'e' is declared but its value is never read.
handleMouseEnter = (e: any, colorAccessor: any, label: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({
type: "category value mouse hover start",
@@ -65,7 +65,9 @@ class CentroidLabels extends PureComponent {
});
};
handleMouseOut = (e, colorAccessor, label) => {
// @ts-expect-error ts-migrate(6133) FIXME: 'e' is declared but its value is never read.
handleMouseOut = (e: any, colorAccessor: any, label: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({
type: "category value mouse hover end",
@@ -75,6 +77,7 @@ class CentroidLabels extends PureComponent {
};
colorByQuery() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, colors, genesets } = this.props;
const { schema } = annoMatrix;
const { colorMode, colorAccessor } = colors;
@@ -82,6 +85,7 @@ class CentroidLabels extends PureComponent {
}
async fetchData() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, layoutChoice } = this.props;
// fetch all data we need: layout, category
const promises = [];
@@ -94,21 +98,26 @@ class CentroidLabels extends PureComponent {
} else {
promises.push(Promise.resolve(null));
}
return Promise.all(promises);
}
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'inverseTransform' does not exist on type... Remove this comment to see the full error message
inverseTransform,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dilatedValue' does not exist on type 'Re... Remove this comment to see the full error message
dilatedValue,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoricalSelection' does not exist on ... Remove this comment to see the full error message
categoricalSelection,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'showLabels' does not exist on type 'Read... Remove this comment to see the full error message
showLabels,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colors' does not exist on type 'Readonly... Remove this comment to see the full error message
colors,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
annoMatrix,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'layoutChoice' does not exist on type 'Re... Remove this comment to see the full error message
layoutChoice,
} = this.props;
return (
<Async
watchFn={CentroidLabels.watchAsync}
@@ -125,14 +134,12 @@ class CentroidLabels extends PureComponent {
<Async.Fulfilled>
{(asyncProps) => {
if (!showLabels) return null;
const labelSVGS = [];
const labelSVGS: any = [];
const deselectOpacity = 0.375;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'category' does not exist on type 'unknow... Remove this comment to see the full error message
const { category, colorAccessor, labels } = asyncProps;
labels.forEach((coords, label) => {
labels.forEach((coords: any, label: any) => {
const selected = category.get(label) ?? true;
// Mirror LSB middle truncation
let displayLabel = label;
if (displayLabel.length > categoryLabelDisplayStringLongLength) {
@@ -141,7 +148,6 @@ class CentroidLabels extends PureComponent {
categoryLabelDisplayStringLongLength / 2
)}…${label.slice(-categoryLabelDisplayStringLongLength / 2)}`;
}
labelSVGS.push(
// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events -- the mouse actions for centroid labels do not have a screen reader alternative
<Label
@@ -158,7 +164,6 @@ class CentroidLabels extends PureComponent {
/>
);
});
return <>{labelSVGS}</>;
}}
</Async.Fulfilled>
@@ -177,7 +182,7 @@ const Label = ({
displayLabel,
onMouseEnter,
onMouseOut,
}) => {
}: any) => {
/*
Render a label at a given coordinate.
*/
@@ -202,9 +207,11 @@ const Label = ({
textAnchor="middle"
style={{
fontSize,
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string | null' is not assignable to type 'Fo... Remove this comment to see the full error message
fontWeight,
fill: "black",
userSelect: "none",
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ opacity: any; }' is not assignable to type... Remove this comment to see the full error message
opacity: { opacity },
}}
onMouseEnter={(e) => onMouseEnter(e, colorAccessor, label)}
client/src/components/graph/overlays/graphOverlayLayer.js → client/src/components/graph/overlays/graphOverlayLayer.tsx
+16 -6
View File
@@ -1,22 +1,25 @@
import React, { PureComponent, cloneElement } from "react";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module '../graph.css' or its correspon... Remove this comment to see the full error message
import styles from "../graph.css";
export default class GraphOverlayLayer extends PureComponent {
type State = any;
export default class GraphOverlayLayer extends PureComponent<{}, State> {
/*
This component takes its children (assumed in the data coordinate space ([0, 1] range, origin in bottom left corner))
and transforms itself multiple times resulting in screen space ([0, screenWidth/Height] range, origin in top left corner)
Children are assigned in the graph component and must implement onDisplayChange()
*/
constructor(props) {
constructor(props: {}) {
super(props);
this.state = {
display: {},
};
}
matrixToTransformString = (m) => {
matrixToTransformString = (m: any) => {
/*
Translates the gl-matrix mat3 to SVG matrix transform style
@@ -28,25 +31,31 @@ export default class GraphOverlayLayer extends PureComponent {
return `matrix(${m[0]} ${m[1]} ${m[3]} ${m[4]} ${m[6]} ${m[7]})`;
};
reverseMatrixScaleTransformString = (m) => {
reverseMatrixScaleTransformString = (m: any) => {
return `matrix(${1 / m[0]} 0 0 ${1 / m[4]} 0 0)`;
};
// This is passed to all children, should be called when an overlay's display state is toggled along with the overlay name and its new display state in boolean form
overlaySetShowing = (overlay, displaying) => {
this.setState((state) => {
overlaySetShowing = (overlay: any, displaying: any) => {
this.setState((state: any) => {
return { ...state, display: { ...state.display, [overlay]: displaying } };
});
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'cameraTF' does not exist on type 'Readon... Remove this comment to see the full error message
cameraTF,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'modelTF' does not exist on type 'Readonl... Remove this comment to see the full error message
modelTF,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'projectionTF' does not exist on type 'Re... Remove this comment to see the full error message
projectionTF,
children,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleCanvasEvent' does not exist on typ... Remove this comment to see the full error message
handleCanvasEvent,
// @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;
const { display } = this.state;
@@ -65,6 +74,7 @@ export default class GraphOverlayLayer extends PureComponent {
// Copy the children passed with the overlay and add the inverse transform and onDisplayChange props
const newChildren = React.Children.map(children, (child) =>
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
cloneElement(child, {
inverseTransform,
overlaySetShowing: this.overlaySetShowing,
client/src/components/graph/setupLasso.js → client/src/components/graph/setupLasso.ts
+17 -16
View File
@@ -4,16 +4,16 @@ import { Colors } from "@blueprintjs/core";
const Lasso = () => {
const dispatch = d3.dispatch("start", "end", "cancel");
const lasso = (svg) => {
let lassoPolygon;
let lassoPath;
let closePath;
let lassoInProgress;
const lasso = (svg: any) => {
let lassoPolygon: any;
let lassoPath: any;
let closePath: any;
let lassoInProgress: any;
const polygonToPath = (polygon) =>
`M${polygon.map((d) => d.join(",")).join("L")}`;
const polygonToPath = (polygon: any) =>
`M${polygon.map((d: any) => d.join(",")).join("L")}`;
const distance = (pt1, pt2) =>
const distance = (pt1: any, pt2: any) =>
Math.sqrt((pt2[0] - pt1[0]) ** 2 + (pt2[1] - pt1[1]) ** 2);
// distance last point has to be to first point before it auto closes when mouse is released
@@ -21,12 +21,13 @@ const Lasso = () => {
const lassoPathColor = Colors.BLUE5;
const handleDragStart = () => {
lassoPolygon = [d3.mouse(svg.node())]; // current x y of mouse within element
lassoPolygon = [(d3 as any).mouse(svg.node())]; // current x y of mouse within element
if (lassoPath) {
// If the existing path is in progress
if (lassoInProgress) {
// cancel the existing lasso
// eslint-disable-next-line @typescript-eslint/no-use-before-define --- handleCancel used before defined
handleCancel();
// Don't continue with current drag start
return;
@@ -37,12 +38,14 @@ const Lasso = () => {
// We're starting a new drag
lassoInProgress = true;
// eslint-disable-next-line @typescript-eslint/no-use-before-define --- g used before defined
lassoPath = g
.append("path")
.attr("data-testid", "lasso-element")
.attr("fill-opacity", 0.1)
.attr("stroke-dasharray", "3, 3");
// eslint-disable-next-line @typescript-eslint/no-use-before-define --- g used before defined
closePath = g
.append("line")
.attr("x2", lassoPolygon[0][0])
@@ -53,7 +56,7 @@ const Lasso = () => {
};
const handleDrag = () => {
const point = d3.mouse(svg.node());
const point = (d3 as any).mouse(svg.node());
lassoPolygon.push(point);
lassoPath.attr("d", polygonToPath(lassoPolygon));
@@ -123,12 +126,11 @@ const Lasso = () => {
area.call(drag);
lasso.reset = () => {
(lasso as any).reset = () => {
if (lassoPath) {
lassoPath.remove();
lassoPath = null;
}
lassoPolygon = null;
if (closePath) {
closePath.remove();
@@ -136,10 +138,10 @@ const Lasso = () => {
}
};
lasso.move = (polygon) => {
(lasso as any).move = (polygon: any) => {
if (polygon !== lassoPolygon || polygon.length !== lassoPolygon.length) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'reset' does not exist on type '(svg: any... Remove this comment to see the full error message
lasso.reset();
lassoPolygon = polygon;
lassoPath = g
.append("path")
@@ -148,13 +150,12 @@ const Lasso = () => {
.attr("fill-opacity", 0.1)
.attr("stroke", lassoPathColor)
.attr("stroke-dasharray", "3, 3");
lassoPath.attr("d", `${polygonToPath(lassoPolygon)}Z`);
}
};
};
lasso.on = (type, callback) => {
lasso.on = (type: any, callback: any) => {
dispatch.on(type, callback);
return lasso;
};
client/src/components/graph/setupSVGandBrush.js → client/src/components/graph/setupSVGandBrush.ts
+7 -7
View File
@@ -8,12 +8,12 @@ import Lasso from "./setupLasso";
******************************************/
export default (
selectionToolType,
handleStartAction,
handleDragAction,
handleEndAction,
handleCancelAction,
viewport
selectionToolType: any,
handleStartAction: any,
handleDragAction: any,
handleEndAction: any,
handleCancelAction: any,
viewport: any
) => {
const svg = d3.select("#graph-wrapper").select("#lasso-layer");
if (svg.empty()) return {};
@@ -39,7 +39,7 @@ export default (
}
if (selectionToolType === "lasso") {
const lasso = Lasso()
const lasso = (Lasso() as any)
.on("end", handleEndAction)
// FYI, Lasso doesn't generate drag
.on("start", handleStartAction)
client/src/components/infoDrawer/infoDrawer.js
-63
View File
@@ -1,63 +0,0 @@
import React, { PureComponent } from "react";
import { connect } from "react-redux";
import { Drawer } from "@blueprintjs/core";
import InfoFormat from "./infoFormat";
import { selectableCategoryNames } from "../../util/stateManager/controlsHelpers";
@connect((state) => {
return {
schema: state.annoMatrix.schema,
datasetTitle: state.config?.displayNames?.dataset ?? "",
aboutURL: state.config?.links?.["about-dataset"],
isOpen: state.controls.datasetDrawer,
dataPortalProps: state.config?.corpora_props,
};
})
class InfoDrawer extends PureComponent {
handleClose = () => {
const { dispatch } = this.props;
dispatch({ type: "toggle dataset drawer" });
};
render() {
const {
position,
aboutURL,
datasetTitle,
schema,
isOpen,
dataPortalProps,
} = this.props;
const allCategoryNames = selectableCategoryNames(schema).sort();
const singleValueCategories = new Map();
allCategoryNames.forEach((catName) => {
const isUserAnno = schema?.annotations?.obsByName[catName]?.writable;
const colSchema = schema.annotations.obsByName[catName];
if (!isUserAnno && colSchema.categories?.length === 1) {
singleValueCategories.set(catName, colSchema.categories[0]);
}
});
return (
<Drawer
title="Dataset Overview"
onClose={this.handleClose}
{...{ isOpen, position }}
>
<InfoFormat
{...{
datasetTitle,
aboutURL,
singleValueCategories,
dataPortalProps: dataPortalProps ?? {},
}}
/>
</Drawer>
);
}
}
export default InfoDrawer;
client/src/components/infoDrawer/infoDrawer.tsx
+72
View File
@@ -0,0 +1,72 @@
import React, { PureComponent } from "react";
import { connect } from "react-redux";
import { Drawer } from "@blueprintjs/core";
import InfoFormat from "./infoFormat";
import { selectableCategoryNames } from "../../util/stateManager/controlsHelpers";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
return {
schema: (state as any).annoMatrix.schema,
datasetTitle: (state as any).config?.displayNames?.dataset ?? "",
aboutURL: (state as any).config?.links?.["about-dataset"],
isOpen: (state as any).controls.datasetDrawer,
dataPortalProps: (state as any).config?.corpora_props,
};
})
class InfoDrawer extends PureComponent {
handleClose = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({ type: "toggle dataset drawer" });
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'position' does not exist on type 'Readon... Remove this comment to see the full error message
position,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'aboutURL' does not exist on type 'Readon... Remove this comment to see the full error message
aboutURL,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'datasetTitle' does not exist on type 'Re... Remove this comment to see the full error message
datasetTitle,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'schema' does not exist on type 'Readonly... Remove this comment to see the full error message
schema,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isOpen' does not exist on type 'Readonly... Remove this comment to see the full error message
isOpen,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dataPortalProps' does not exist on type ... Remove this comment to see the full error message
dataPortalProps,
} = this.props;
// @ts-expect-error ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
const allCategoryNames = selectableCategoryNames(schema).sort();
const singleValueCategories = new Map();
allCategoryNames.forEach((catName: any) => {
const isUserAnno = schema?.annotations?.obsByName[catName]?.writable;
const colSchema = schema.annotations.obsByName[catName];
if (!isUserAnno && colSchema.categories?.length === 1) {
singleValueCategories.set(catName, colSchema.categories[0]);
}
});
return (
<Drawer
title="Dataset Overview"
onClose={this.handleClose}
{...{ isOpen, position }}
>
<InfoFormat
{...{
datasetTitle,
aboutURL,
singleValueCategories,
dataPortalProps: dataPortalProps ?? {},
}}
/>
</Drawer>
);
}
}
export default InfoDrawer;
client/src/components/infoDrawer/infoFormat.js → client/src/components/infoDrawer/infoFormat.tsx
+18 -12
View File
@@ -1,14 +1,14 @@
import { H3, H1, UL, HTMLTable, Classes } from "@blueprintjs/core";
import React from "react";
const renderContributors = (contributors, affiliations) => {
const renderContributors = (contributors: any, affiliations: any) => {
// eslint-disable-next-line no-constant-condition -- Temp removed contributor section to avoid publishing PII
if (!contributors || contributors.length === 0 || true) return null;
return (
<>
<H3>Contributors</H3>
<p>
{contributors.map((contributor) => {
{contributors.map((contributor: any) => {
const { email, name, institution } = contributor;
return (
@@ -27,7 +27,7 @@ const renderContributors = (contributors, affiliations) => {
// generates a list of unique institutions by order of appearance in contributors
const buildAffiliations = (contributors = []) => {
const affiliations = [];
const affiliations: any = [];
contributors.forEach((contributor) => {
const { institution } = contributor;
if (affiliations.indexOf(institution) === -1) {
@@ -37,13 +37,13 @@ const buildAffiliations = (contributors = []) => {
return affiliations;
};
const renderAffiliations = (affiliations) => {
const renderAffiliations = (affiliations: any) => {
if (affiliations.length === 0) return null;
return (
<>
<H3>Affiliations</H3>
<UL>
{affiliations.map((item, index) => (
{affiliations.map((item: any, index: any) => (
<div key={item}>
<sup>{index + 1}</sup>
{" "}
@@ -55,7 +55,7 @@ const renderAffiliations = (affiliations) => {
);
};
const renderDOILink = (type, doi) => {
const renderDOILink = (type: any, doi: any) => {
if (!doi) return null;
return (
<>
@@ -71,7 +71,10 @@ const renderDOILink = (type, doi) => {
const ONTOLOGY_KEY = "ontology_term_id";
// Render list of metadata attributes found in categorical field
const renderDatasetMetadata = (singleValueCategories, corporaMetadata) => {
const renderDatasetMetadata = (
singleValueCategories: any,
corporaMetadata: any
) => {
if (singleValueCategories.size === 0) return null;
return (
<>
@@ -93,28 +96,30 @@ const renderDatasetMetadata = (singleValueCategories, corporaMetadata) => {
return (
<tr {...{ key }}>
<td>{`${key}:`}</td>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type 'unknown' is not assignable to type 'ReactNod... Remove this comment to see the full error message */}
<td>{value}</td>
<td />
</tr>
);
})}
{Array.from(singleValueCategories).reduce((elems, pair) => {
// @ts-expect-error ts-migrate(2488) FIXME: Type 'unknown' must have a '[Symbol.iterator]()' m... Remove this comment to see the full error message
const [category, value] = pair;
// If the value is empty skip it
if (!value) return elems;
// If this category is a ontology term, let's add its value to the previous node
if (String(category).includes(ONTOLOGY_KEY)) {
const prevElem = elems.pop();
const prevElem = (elems as any).pop();
const newChildren = [...prevElem.props.children];
newChildren.splice(2, 1, [<td key="ontology">{value}</td>]);
// Props aren't extensible so we must clone and alter the component to append the new child
elems.push(
(elems as any).push(
React.cloneElement(prevElem, prevElem.props, newChildren)
);
} else {
// Create the list item
elems.push(
(elems as any).push(
<tr key={category}>
<td>{`${category}:`}</td>
<td>{value}</td>
@@ -132,14 +137,14 @@ const renderDatasetMetadata = (singleValueCategories, corporaMetadata) => {
// Renders any links found in the config where link_type is not "SUMMARY"
// If there are no links in the config, render the aboutURL
const renderLinks = (projectLinks, aboutURL) => {
const renderLinks = (projectLinks: any, aboutURL: any) => {
if (!projectLinks && !aboutURL) return null;
if (projectLinks)
return (
<>
<H3>Project Links</H3>
<UL>
{projectLinks.map((link) => {
{projectLinks.map((link: any) => {
if (link.link_type === "SUMMARY") return null;
return (
<li key={link.link_name}>
@@ -166,6 +171,7 @@ const renderLinks = (projectLinks, aboutURL) => {
};
const InfoFormat = React.memo(
// @ts-expect-error ts-migrate(2339) FIXME: Property 'datasetTitle' does not exist on type '{ ... Remove this comment to see the full error message
({ datasetTitle, singleValueCategories, aboutURL, dataPortalProps = {} }) => {
if (
["1.0.0", "1.1.0"].indexOf(
client/src/components/labelInput.js → client/src/components/labelInput.tsx
+26 -12
View File
@@ -3,7 +3,9 @@ import { InputGroup, MenuItem, Keys } from "@blueprintjs/core";
import { Suggest } from "@blueprintjs/select";
import fuzzysort from "fuzzysort";
export default class LabelInput extends React.PureComponent {
type State = any;
export default class LabelInput extends React.PureComponent<{}, State> {
/*
Input widget for text labels, which acts like an InputGroup, but will also
accept a suggestion list (of labels), with sublime-like suggest search.
@@ -26,9 +28,10 @@ export default class LabelInput extends React.PureComponent {
/* maxinum number of suggestions */
static QueryResultLimit = 100;
constructor(props) {
constructor(props: {}) {
super(props);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'label' does not exist on type '{}'.
const { label } = props;
const query = label || "";
const queryResults = this.filterLabels(query);
@@ -38,7 +41,7 @@ export default class LabelInput extends React.PureComponent {
};
}
handleQueryChange = (query, event) => {
handleQueryChange = (query: any, event: any) => {
// https://github.com/palantir/blueprint/issues/2983
if (!event) return;
@@ -48,19 +51,21 @@ export default class LabelInput extends React.PureComponent {
queryResults,
});
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onChange' does not exist on type 'Readon... Remove this comment to see the full error message
const { onChange } = this.props;
if (onChange) onChange(query, event);
};
handleItemSelect = (item, event) => {
handleItemSelect = (item: any, event: any) => {
/* only report the select if not already reported via onChange() */
const { target } = item;
const { query } = this.state;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onSelect' does not exist on type 'Readon... Remove this comment to see the full error message
const { onSelect } = this.props;
if (target !== query && onSelect) onSelect(target, event);
};
handleKeyDown = (e) => {
handleKeyDown = (e: any) => {
/*
prevent these events from propagating to containing form/dialog
and causing further side effects (eg, closing dialog, submitting
@@ -75,13 +80,18 @@ export default class LabelInput extends React.PureComponent {
}
};
handleChange = (e) => {
handleChange = (e: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'onChange' does not exist on type 'Readon... Remove this comment to see the full error message
const { onChange } = this.props;
if (onChange) onChange(e.target.value);
};
renderLabelSuggestion = (queryResult, { handleClick, modifiers }) => {
renderLabelSuggestion = (
queryResult: any,
{ handleClick, modifiers }: any
) => {
if (queryResult.newLabel) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'newLabelMessage' does not exist on type ... Remove this comment to see the full error message
const { newLabelMessage } = this.props;
return (
<MenuItem
@@ -106,7 +116,8 @@ export default class LabelInput extends React.PureComponent {
);
};
filterLabels(query) {
filterLabels(query: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'labelSuggestions' does not exist on type... Remove this comment to see the full error message
const { labelSuggestions } = this.props;
if (!labelSuggestions) return [];
@@ -114,7 +125,7 @@ export default class LabelInput extends React.PureComponent {
if (query === "") {
return labelSuggestions
.slice(0, LabelInput.QueryResultLimit)
.map((l) => ({
.map((l: any) => ({
target: l,
score: -10000,
}));
@@ -128,6 +139,7 @@ export default class LabelInput extends React.PureComponent {
let queryResults = fuzzysort.go(query, labelSuggestions, options);
/* exact match will always be first in list */
if (query !== "" && queryResults[0]?.target !== query)
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ target: any; newLabel: true; }' is not ass... Remove this comment to see the full error message
queryResults = [{ target: query, newLabel: true }, ...queryResults];
return queryResults;
@@ -135,6 +147,7 @@ export default class LabelInput extends React.PureComponent {
render() {
const { props } = this;
// @ts-expect-error ts-migrate(2339) FIXME: Property 'labelSuggestions' does not exist on type... Remove this comment to see the full error message
const { labelSuggestions, label, autoFocus = true } = props;
const suggestEnabled = !!labelSuggestions && labelSuggestions.length > 0;
@@ -142,7 +155,7 @@ export default class LabelInput extends React.PureComponent {
return (
<InputGroup
autoFocus={autoFocus}
{...props.inputProps} // eslint-disable-line react/jsx-props-no-spreading --- Allows for modularity
{...(props as any).inputProps} // eslint-disable-line react/jsx-props-no-spreading --- Allows for modularity
value={label}
onChange={this.handleChange}
/>
@@ -151,10 +164,10 @@ export default class LabelInput extends React.PureComponent {
const popoverProps = {
minimal: true,
...props.popoverProps,
...(props as any).popoverProps,
};
const inputProps = {
...props.inputProps,
...(props as any).inputProps,
autoFocus: false,
};
const { queryResults } = this.state;
@@ -170,6 +183,7 @@ export default class LabelInput extends React.PureComponent {
onQueryChange={this.handleQueryChange}
popoverProps={popoverProps}
inputProps={inputProps}
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ fill: true; inputValueRenderer: (i: any) =... Remove this comment to see the full error message
onKeyDown={this.handleKeyDown}
/>
</>
client/src/components/leftSidebar/index.js → client/src/components/leftSidebar/index.tsx
+4 -2
View File
@@ -6,12 +6,14 @@ import DynamicScatterplot from "../scatterplot/scatterplot";
import TopLeftLogoAndTitle from "./topLeftLogoAndTitle";
import Continuous from "../continuous/continuous";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
scatterplotXXaccessor: state.controls.scatterplotXXaccessor,
scatterplotYYaccessor: state.controls.scatterplotYYaccessor,
scatterplotXXaccessor: (state as any).controls.scatterplotXXaccessor,
scatterplotYYaccessor: (state as any).controls.scatterplotYYaccessor,
}))
class LeftSideBar extends React.Component {
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scatterplotXXaccessor' does not exist on... Remove this comment to see the full error message
const { scatterplotXXaccessor, scatterplotYYaccessor } = this.props;
return (
<div
client/src/components/leftSidebar/infoMenu.js → client/src/components/leftSidebar/infoMenu.tsx
+1
View File
@@ -3,6 +3,7 @@ import { Button, Menu, MenuItem, Popover, Position } from "@blueprintjs/core";
import { IconNames } from "@blueprintjs/icons";
const InformationMenu = React.memo((props) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'libraryVersions' does not exist on type ... Remove this comment to see the full error message
const { libraryVersions, tosURL, privacyURL } = props;
return (
<Popover
client/src/components/leftSidebar/topLeftLogoAndTitle.js → client/src/components/leftSidebar/topLeftLogoAndTitle.tsx
+15 -6
View File
@@ -10,34 +10,43 @@ import InformationMenu from "./infoMenu";
const DATASET_TITLE_FONT_SIZE = 14;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
const { corpora_props: corporaProps } = state.config;
const { corpora_props: corporaProps } = (state as any).config;
const correctVersion =
["1.0.0", "1.1.0"].indexOf(corporaProps?.version?.corpora_schema_version) >
-1;
return {
datasetTitle: state.config?.displayNames?.dataset ?? "",
libraryVersions: state.config?.library_versions,
aboutLink: state.config?.links?.["about-dataset"],
tosURL: state.config?.parameters?.about_legal_tos,
privacyURL: state.config?.parameters?.about_legal_privacy,
datasetTitle: (state as any).config?.displayNames?.dataset ?? "",
libraryVersions: (state as any).config?.library_versions,
aboutLink: (state as any).config?.links?.["about-dataset"],
tosURL: (state as any).config?.parameters?.about_legal_tos,
privacyURL: (state as any).config?.parameters?.about_legal_privacy,
title: correctVersion ? corporaProps?.title : undefined,
};
})
class LeftSideBar extends React.Component {
handleClick = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch({ type: "toggle dataset drawer" });
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'datasetTitle' does not exist on type 'Re... Remove this comment to see the full error message
datasetTitle,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'libraryVersions' does not exist on type ... Remove this comment to see the full error message
libraryVersions,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'aboutLink' does not exist on type 'Reado... Remove this comment to see the full error message
aboutLink,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'privacyURL' does not exist on type 'Read... Remove this comment to see the full error message
privacyURL,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'tosURL' does not exist on type 'Readonly... Remove this comment to see the full error message
tosURL,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'title' does not exist on type 'Readonly<... Remove this comment to see the full error message
title,
} = this.props;
client/src/components/menubar/authButtons.js → client/src/components/menubar/authButtons.tsx
+6 -2
View File
@@ -17,6 +17,7 @@ import { IconNames } from "@blueprintjs/icons";
import * as globals from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
import { storageGet, storageSet, KEYS } from "../util/localStorage";
@@ -31,11 +32,12 @@ const LOGIN_PROMPT_OFF = "off";
const Auth = React.memo((props) => {
const [isPromptOpen, setIsPromptOpen] = useState(shouldShowPrompt());
// @ts-expect-error ts-migrate(2339) FIXME: Property 'auth' does not exist on type '{ children... Remove this comment to see the full error message
const { auth, userInfo } = props;
const isAuthenticated = userInfo && userInfo.is_authenticated;
window.userInfo = userInfo;
(window as any).userInfo = userInfo;
const randomInt = Math.random() * 15;
const sexIndex = Math.floor(randomInt / 5);
@@ -75,6 +77,7 @@ const Auth = React.memo((props) => {
>
{/* eslint-disable-next-line no-constant-condition -- disable profile picture until CSP is tweaked */}
{userInfo?.picture && false ? (
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ alt: string; size: string; src: any; }' is... Remove this comment to see the full error message
<img alt="profile" size="21px" src={userInfo?.picture} />
) : (
<span style={{ fontSize: "18px" }}>{scientist}</span>
@@ -123,11 +126,12 @@ const Auth = React.memo((props) => {
function shouldShowPrompt() {
if (storageGet(KEYS.LOGIN_PROMPT) === LOGIN_PROMPT_OFF) return false;
// @ts-expect-error ts-migrate(2774) FIXME: This condition will always return true since the f... Remove this comment to see the full error message
return shouldShowAuth && !isAuthenticated;
}
});
function PromptContent({ setIsPromptOpen }) {
function PromptContent({ setIsPromptOpen }: any) {
const [isChecked, setIsChecked] = useState(false);
function handleOKClick() {
client/src/components/menubar/cellSetButtons.js → client/src/components/menubar/cellSetButtons.tsx
+4 -2
View File
@@ -4,17 +4,19 @@ import { connect } from "react-redux";
import { tooltipHoverOpenDelay } from "../../globals";
import actions from "../../actions";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
differential: state.differential,
differential: (state as any).differential,
}))
class CellSetButton extends React.PureComponent {
set() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, eitherCellSetOneOrTwo } = this.props;
dispatch(actions.setCellSetFromSelection(eitherCellSetOneOrTwo));
}
render() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'differential' does not exist on type 'Re... Remove this comment to see the full error message
const { differential, eitherCellSetOneOrTwo } = this.props;
const cellListName = `celllist${eitherCellSetOneOrTwo}`;
const cellsSelected = differential[cellListName]
client/src/components/menubar/clip.js → client/src/components/menubar/clip.tsx
+12 -1
View File
@@ -12,19 +12,30 @@ import {
import { IconNames } from "@blueprintjs/icons";
import { tooltipHoverOpenDelay } from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
const Clip = React.memo((props) => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'pendingClipPercentiles' does not exist o... Remove this comment to see the full error message
pendingClipPercentiles,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMin' does not exist on typ... Remove this comment to see the full error message
clipPercentileMin,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMax' does not exist on typ... Remove this comment to see the full error message
clipPercentileMax,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipOpening' does not exist on typ... Remove this comment to see the full error message
handleClipOpening,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipClosing' does not exist on typ... Remove this comment to see the full error message
handleClipClosing,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipCommit' does not exist on type... Remove this comment to see the full error message
handleClipCommit,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'isClipDisabled' does not exist on type '... Remove this comment to see the full error message
isClipDisabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipOnKeyPress' does not exist on ... Remove this comment to see the full error message
handleClipOnKeyPress,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipPercentileMaxValueChange' does... Remove this comment to see the full error message
handleClipPercentileMaxValueChange,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleClipPercentileMinValueChange' does... Remove this comment to see the full error message
handleClipPercentileMinValueChange,
} = props;
@@ -34,7 +45,7 @@ const Clip = React.memo((props) => {
pendingClipPercentiles?.clipPercentileMax ?? clipPercentileMax;
const intent =
clipPercentileMin > 0 || clipPercentileMax < 100
? Intent.INTENT_WARNING
? (Intent as any).INTENT_WARNING
: Intent.NONE;
return (
client/src/components/menubar/diffexpButtons.js → client/src/components/menubar/diffexpButtons.tsx
+10 -8
View File
@@ -2,17 +2,21 @@ import React from "react";
import { connect } from "react-redux";
import { ButtonGroup, AnchorButton, Tooltip } from "@blueprintjs/core";
import * as globals from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
import actions from "../../actions";
import CellSetButton from "./cellSetButtons";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
differential: state.differential,
diffexpMayBeSlow: state.config?.parameters?.["diffexp-may-be-slow"] ?? false,
diffexpCellcountMax: state.config?.limits?.diffexp_cellcount_max,
differential: (state as any).differential,
diffexpMayBeSlow:
(state as any).config?.parameters?.["diffexp-may-be-slow"] ?? false,
diffexpCellcountMax: (state as any).config?.limits?.diffexp_cellcount_max,
}))
class DiffexpButtons extends React.PureComponent {
computeDiffExp = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, differential } = this.props;
if (differential.celllist1 && differential.celllist2) {
dispatch(
@@ -26,31 +30,29 @@ class DiffexpButtons extends React.PureComponent {
render() {
/* diffexp-related buttons may be disabled */
// @ts-expect-error ts-migrate(2339) FIXME: Property 'differential' does not exist on type 'Re... Remove this comment to see the full error message
const { differential, diffexpMayBeSlow, diffexpCellcountMax } = this.props;
const haveBothCellSets =
!!differential.celllist1 && !!differential.celllist2;
const haveEitherCellSet =
!!differential.celllist1 || !!differential.celllist2;
const slowMsg = diffexpMayBeSlow
? " (CAUTION: large dataset - may take longer or fail)"
: "";
const tipMessage = `See top 10 differentially expressed genes${slowMsg}`;
const tipMessageWarn = `The total number of cells for differential expression computation
may not exceed ${diffexpCellcountMax}. Try reselecting new cell sets.`;
const warnMaxSizeExceeded =
haveEitherCellSet &&
!!diffexpCellcountMax &&
(differential.celllist1?.length ?? 0) +
(differential.celllist2?.length ?? 0) >
diffexpCellcountMax;
return (
<ButtonGroup className={styles.menubarButton}>
{/* @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call. */}
<CellSetButton eitherCellSetOneOrTwo={1} />
{/* @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call. */}
<CellSetButton eitherCellSetOneOrTwo={2} />
<Tooltip
content={warnMaxSizeExceeded ? tipMessageWarn : tipMessage}
client/src/components/menubar/index.js → client/src/components/menubar/index.tsx
+56 -22
View File
@@ -3,6 +3,7 @@ import { connect } from "react-redux";
import { ButtonGroup, AnchorButton, Tooltip } from "@blueprintjs/core";
import * as globals from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
import actions from "../../actions";
import Clip from "./clip";
@@ -13,9 +14,13 @@ import UndoRedoReset from "./undoRedo";
import DiffexpButtons from "./diffexpButtons";
import { getEmbSubsetView } from "../../util/stateManager/viewStackHelpers";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Defa... Remove this comment to see the full error message
const { annoMatrix } = state;
const crossfilter = state.obsCrossfilter;
const crossfilter = (state as any).obsCrossfilter;
const selectedCount = crossfilter.countSelected();
const subsetPossible =
@@ -28,30 +33,33 @@ import { getEmbSubsetView } from "../../util/stateManager/viewStackHelpers";
return {
subsetPossible,
subsetResetPossible,
graphInteractionMode: state.controls.graphInteractionMode,
graphInteractionMode: (state as any).controls.graphInteractionMode,
clipPercentileMin: Math.round(100 * (annoMatrix?.clipRange?.[0] ?? 0)),
clipPercentileMax: Math.round(100 * (annoMatrix?.clipRange?.[1] ?? 1)),
userDefinedGenes: state.controls.userDefinedGenes,
colorAccessor: state.colors.colorAccessor,
scatterplotXXaccessor: state.controls.scatterplotXXaccessor,
scatterplotYYaccessor: state.controls.scatterplotYYaccessor,
libraryVersions: state.config?.library_versions,
auth: state.config?.authentication,
userInfo: state.userInfo,
userDefinedGenes: (state as any).controls.userDefinedGenes,
colorAccessor: (state as any).colors.colorAccessor,
scatterplotXXaccessor: (state as any).controls.scatterplotXXaccessor,
scatterplotYYaccessor: (state as any).controls.scatterplotYYaccessor,
libraryVersions: (state as any).config?.library_versions,
auth: (state as any).config?.authentication,
userInfo: (state as any).userInfo,
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
undoDisabled: state["@@undoable/past"].length === 0,
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
redoDisabled: state["@@undoable/future"].length === 0,
aboutLink: state.config?.links?.["about-dataset"],
disableDiffexp: state.config?.parameters?.["disable-diffexp"] ?? false,
aboutLink: (state as any).config?.links?.["about-dataset"],
disableDiffexp:
(state as any).config?.parameters?.["disable-diffexp"] ?? false,
diffexpMayBeSlow:
state.config?.parameters?.["diffexp-may-be-slow"] ?? false,
showCentroidLabels: state.centroidLabels.showLabels,
tosURL: state.config?.parameters?.about_legal_tos,
privacyURL: state.config?.parameters?.about_legal_privacy,
categoricalSelection: state.categoricalSelection,
(state as any).config?.parameters?.["diffexp-may-be-slow"] ?? false,
showCentroidLabels: (state as any).centroidLabels.showLabels,
tosURL: (state as any).config?.parameters?.about_legal_tos,
privacyURL: (state as any).config?.parameters?.about_legal_privacy,
categoricalSelection: (state as any).categoricalSelection,
};
})
class MenuBar extends React.PureComponent {
static isValidDigitKeyEvent(e) {
class MenuBar extends React.PureComponent<{}, State> {
static isValidDigitKeyEvent(e: any) {
/*
Return true if this event is necessary to enter a percent number input.
Return false if not.
@@ -75,7 +83,7 @@ class MenuBar extends React.PureComponent {
return key >= 0 && key <= 9;
}
constructor(props) {
constructor(props: {}) {
super(props);
this.state = {
pendingClipPercentiles: null,
@@ -90,7 +98,9 @@ class MenuBar extends React.PureComponent {
const clipPercentileMin = pendingClipPercentiles?.clipPercentileMin;
const clipPercentileMax = pendingClipPercentiles?.clipPercentileMax;
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMin' does not exist on typ... Remove this comment to see the full error message
clipPercentileMin: currentClipMin,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMax' does not exist on typ... Remove this comment to see the full error message
clipPercentileMax: currentClipMax,
} = this.props;
@@ -104,7 +114,7 @@ class MenuBar extends React.PureComponent {
return isDisabled;
};
handleClipOnKeyPress = (e) => {
handleClipOnKeyPress = (e: any) => {
/*
allow only numbers, plus other critical keys which
may be required to make a number
@@ -114,7 +124,7 @@ class MenuBar extends React.PureComponent {
}
};
handleClipPercentileMinValueChange = (v) => {
handleClipPercentileMinValueChange = (v: any) => {
/*
Ignore anything that isn't a legit number
*/
@@ -134,7 +144,7 @@ class MenuBar extends React.PureComponent {
});
};
handleClipPercentileMaxValueChange = (v) => {
handleClipPercentileMaxValueChange = (v: any) => {
/*
Ignore anything that isn't a legit number
*/
@@ -156,6 +166,7 @@ class MenuBar extends React.PureComponent {
};
handleClipCommit = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
const { pendingClipPercentiles } = this.state;
const { clipPercentileMin, clipPercentileMax } = pendingClipPercentiles;
@@ -165,6 +176,7 @@ class MenuBar extends React.PureComponent {
};
handleClipOpening = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMin' does not exist on typ... Remove this comment to see the full error message
const { clipPercentileMin, clipPercentileMax } = this.props;
this.setState({
pendingClipPercentiles: { clipPercentileMin, clipPercentileMax },
@@ -176,6 +188,7 @@ class MenuBar extends React.PureComponent {
};
handleCentroidChange = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch, showCentroidLabels } = this.props;
dispatch({
@@ -185,31 +198,48 @@ class MenuBar extends React.PureComponent {
};
handleSubset = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch(actions.subsetAction());
};
handleSubsetReset = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
const { dispatch } = this.props;
dispatch(actions.resetSubsetAction());
};
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'disableDiffexp' does not exist on type '... Remove this comment to see the full error message
disableDiffexp,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'undoDisabled' does not exist on type 'Re... Remove this comment to see the full error message
undoDisabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'redoDisabled' does not exist on type 'Re... Remove this comment to see the full error message
redoDisabled,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'selectionTool' does not exist on type 'R... Remove this comment to see the full error message
selectionTool,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMin' does not exist on typ... Remove this comment to see the full error message
clipPercentileMin,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'clipPercentileMax' does not exist on typ... Remove this comment to see the full error message
clipPercentileMax,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'graphInteractionMode' does not exist on ... Remove this comment to see the full error message
graphInteractionMode,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'showCentroidLabels' does not exist on ty... Remove this comment to see the full error message
showCentroidLabels,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'categoricalSelection' does not exist on ... Remove this comment to see the full error message
categoricalSelection,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colorAccessor' does not exist on type 'R... Remove this comment to see the full error message
colorAccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'subsetPossible' does not exist on type '... Remove this comment to see the full error message
subsetPossible,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'subsetResetPossible' does not exist on t... Remove this comment to see the full error message
subsetResetPossible,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'userInfo' does not exist on type 'Readon... Remove this comment to see the full error message
userInfo,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'auth' does not exist on type 'Readonly<{... Remove this comment to see the full error message
auth,
} = this.props;
const { pendingClipPercentiles } = this.state;
@@ -238,11 +268,13 @@ class MenuBar extends React.PureComponent {
>
<AuthButtons {...{ auth, userInfo }} />
<UndoRedoReset
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ dispatch: any; undoDisabled: any; redoDisa... Remove this comment to see the full error message
dispatch={dispatch}
undoDisabled={undoDisabled}
redoDisabled={redoDisabled}
/>
<Clip
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ pendingClipPercentiles: any; clipPercentil... Remove this comment to see the full error message
pendingClipPercentiles={pendingClipPercentiles}
clipPercentileMin={clipPercentileMin}
clipPercentileMax={clipPercentileMax}
@@ -283,6 +315,7 @@ class MenuBar extends React.PureComponent {
<AnchorButton
type="button"
data-testid="mode-lasso"
// @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'IconName ... Remove this comment to see the full error message
icon={selectionButtonIcon}
active={graphInteractionMode === "select"}
onClick={() => {
@@ -313,6 +346,7 @@ class MenuBar extends React.PureComponent {
</Tooltip>
</ButtonGroup>
<Subset
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ subsetPossible: any; subsetResetPossible: ... Remove this comment to see the full error message
subsetPossible={subsetPossible}
subsetResetPossible={subsetResetPossible}
handleSubset={this.handleSubset}
client/src/components/menubar/subset.js → client/src/components/menubar/subset.tsx
+5
View File
@@ -1,13 +1,18 @@
import React from "react";
import { AnchorButton, ButtonGroup, Tooltip } from "@blueprintjs/core";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
import * as globals from "../../globals";
const Subset = React.memo((props) => {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'subsetPossible' does not exist on type '... Remove this comment to see the full error message
subsetPossible,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'subsetResetPossible' does not exist on t... Remove this comment to see the full error message
subsetResetPossible,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleSubset' does not exist on type '{ ... Remove this comment to see the full error message
handleSubset,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'handleSubsetReset' does not exist on typ... Remove this comment to see the full error message
handleSubsetReset,
} = props;
client/src/components/menubar/undoRedo.js → client/src/components/menubar/undoRedo.tsx
+2
View File
@@ -2,9 +2,11 @@ import React from "react";
import { AnchorButton, ButtonGroup, Tooltip } from "@blueprintjs/core";
import { IconNames } from "@blueprintjs/icons";
import { tooltipHoverOpenDelay } from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './menubar.css' or its correspo... Remove this comment to see the full error message
import styles from "./menubar.css";
const UndoRedo = React.memo((props) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'undoDisabled' does not exist on type '{ ... Remove this comment to see the full error message
const { undoDisabled, redoDisabled, dispatch } = props;
return (
<ButtonGroup className={`${styles.menubarButton}`}>
client/src/components/miniHistogram/index.js → client/src/components/miniHistogram/index.tsx
+10 -2
View File
@@ -7,12 +7,15 @@ import {
} from "@blueprintjs/core";
export default class MiniHistogram extends React.PureComponent {
constructor(props) {
canvasRef: any;
constructor(props: any) {
super(props);
this.canvasRef = React.createRef();
}
drawHistogram = () => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'xScale' does not exist on type 'Readonly... Remove this comment to see the full error message
const { xScale, yScale, bins, width, height } = this.props;
if (!bins) return;
@@ -39,7 +42,8 @@ export default class MiniHistogram extends React.PureComponent {
this.drawHistogram();
};
componentDidUpdate = (prevProps) => {
componentDidUpdate = (prevProps: any) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsOrVarContinuousFieldDisplayName' does... Remove this comment to see the full error message
const { obsOrVarContinuousFieldDisplayName, bins } = this.props;
if (
prevProps.obsOrVarContinuousFieldDisplayName !==
@@ -51,9 +55,13 @@ export default class MiniHistogram extends React.PureComponent {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'domainLabel' does not exist on type 'Rea... Remove this comment to see the full error message
domainLabel,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsOrVarContinuousFieldDisplayName' does... Remove this comment to see the full error message
obsOrVarContinuousFieldDisplayName,
// @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;
client/src/components/miniStackedBar/index.js
-72
View File
@@ -1,72 +0,0 @@
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}
/>
);
}
}
client/src/components/miniStackedBar/index.tsx
+84
View File
@@ -0,0 +1,84 @@
import React from "react";
export default class MiniStackedBar extends React.PureComponent {
canvasRef: any;
constructor(props: any) {
super(props);
this.canvasRef = React.createRef();
}
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;
}
};
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();
};
componentDidMount = () => {
this.drawStacks();
};
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}
/>
);
}
}
client/src/components/rightSidebar/index.js → client/src/components/rightSidebar/index.tsx
+3 -2
View File
@@ -3,9 +3,10 @@ import { connect } from "react-redux";
import GeneExpression from "../geneExpression";
import * as globals from "../../globals";
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
scatterplotXXaccessor: state.controls.scatterplotXXaccessor,
scatterplotYYaccessor: state.controls.scatterplotYYaccessor,
scatterplotXXaccessor: (state as any).controls.scatterplotXXaccessor,
scatterplotYYaccessor: (state as any).controls.scatterplotYYaccessor,
}))
class RightSidebar extends React.Component {
render() {
client/src/components/scatterplot/drawPointsRegl.js → client/src/components/scatterplot/drawPointsRegl.ts
+1 -1
View File
@@ -1,6 +1,6 @@
import { glPointFlags, glPointSize } from "../../util/glHelpers";
export default function drawPointsRegl(regl) {
export default function drawPointsRegl(regl: any) {
return regl({
vert: `
precision mediump float;
client/src/components/scatterplot/scatterplot.js → client/src/components/scatterplot/scatterplot.tsx
+69 -31
View File
@@ -8,6 +8,7 @@ import memoize from "memoize-one";
import Async from "react-async";
import * as globals from "../../globals";
// @ts-expect-error ts-migrate(2307) FIXME: Cannot find module './scatterplot.css' or its corr... Remove this comment to see the full error message
import styles from "./scatterplot.css";
import _drawPoints from "./drawPointsRegl";
import { margin, width, height } from "./util";
@@ -22,7 +23,7 @@ import {
flagHighlight,
} from "../../util/glHelpers";
function createProjectionTF(viewportWidth, viewportHeight) {
function createProjectionTF(viewportWidth: any, viewportHeight: any) {
/*
the projection transform accounts for the screen size & other layout
*/
@@ -30,7 +31,7 @@ function createProjectionTF(viewportWidth, viewportHeight) {
return mat3.projection(m, viewportWidth, viewportHeight);
}
function getScale(col, rangeMin, rangeMax) {
function getScale(col: any, rangeMin: any, rangeMax: any) {
if (!col) return null;
const { min, max } = col.summarize();
return d3.scaleLinear().domain([min, max]).range([rangeMin, rangeMax]);
@@ -38,25 +39,30 @@ function getScale(col, rangeMin, rangeMax) {
const getXScale = memoize(getScale);
const getYScale = memoize(getScale);
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'obsCrossfilter' does not exist on type '... Remove this comment to see the full error message
const { obsCrossfilter: crossfilter } = state;
const { scatterplotXXaccessor, scatterplotYYaccessor } = state.controls;
const {
scatterplotXXaccessor,
scatterplotYYaccessor,
} = (state as any).controls;
return {
annoMatrix: state.annoMatrix,
colors: state.colors,
pointDilation: state.pointDilation,
annoMatrix: (state as any).annoMatrix,
colors: (state as any).colors,
pointDilation: (state as any).pointDilation,
// Accessors are var/gene names (strings)
scatterplotXXaccessor,
scatterplotYYaccessor,
crossfilter,
genesets: state.genesets.genesets,
genesets: (state as any).genesets.genesets,
};
})
class Scatterplot extends React.PureComponent {
static createReglState(canvas) {
class Scatterplot extends React.PureComponent<{}, State> {
static createReglState(canvas: any) {
/*
Must be created for each canvas
*/
@@ -70,8 +76,11 @@ class Scatterplot extends React.PureComponent {
const drawPoints = _drawPoints(regl);
// preallocate webgl buffers
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const pointBuffer = regl.buffer();
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const colorBuffer = regl.buffer();
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const flagBuffer = regl.buffer();
return {
@@ -83,10 +92,16 @@ class Scatterplot extends React.PureComponent {
};
}
static watchAsync(props, prevProps) {
static watchAsync(props: any, prevProps: any) {
return !shallowEqual(props.watchProps, prevProps.watchProps);
}
axes: any;
reglCanvas: any;
renderCache: any;
computePointPositions = memoize((X, Y, xScale, yScale) => {
const positions = new Float32Array(2 * X.length);
for (let i = 0, len = X.length; i < len; i += 1) {
@@ -183,7 +198,7 @@ class Scatterplot extends React.PureComponent {
}
);
constructor(props) {
constructor(props: {}) {
super(props);
const viewport = this.getViewportDimensions();
this.axes = false;
@@ -207,7 +222,7 @@ class Scatterplot extends React.PureComponent {
window.removeEventListener("resize", this.handleResize);
}
setReglCanvas = (canvas) => {
setReglCanvas = (canvas: any) => {
this.reglCanvas = canvas;
if (canvas) {
// no need to update this state if we are detaching.
@@ -233,7 +248,7 @@ class Scatterplot extends React.PureComponent {
});
};
fetchAsyncProps = async (props) => {
fetchAsyncProps = async (props: any) => {
const {
scatterplotXXaccessor,
scatterplotYYaccessor,
@@ -295,7 +310,8 @@ class Scatterplot extends React.PureComponent {
};
};
createXQuery(geneName) {
createXQuery(geneName: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
const { schema } = annoMatrix;
const varIndex = schema?.annotations?.var?.index;
@@ -312,15 +328,17 @@ class Scatterplot extends React.PureComponent {
];
}
createColorByQuery(colors) {
createColorByQuery(colors: any) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix, genesets } = this.props;
const { schema } = annoMatrix;
const { colorMode, colorAccessor } = colors;
return createColorQuery(colorMode, colorAccessor, schema, genesets);
}
updateColorTable(colors, colorDf) {
updateColorTable(colors: any, colorDf: any) {
/* update color table state */
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
const { schema } = annoMatrix;
const { colorAccessor, userColors, colorMode } = colors;
@@ -334,17 +352,19 @@ class Scatterplot extends React.PureComponent {
}
async fetchData(
scatterplotXXaccessor,
scatterplotYYaccessor,
colors,
pointDilation
scatterplotXXaccessor: any,
scatterplotYYaccessor: any,
colors: any,
pointDilation: any
) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
const { metadataField: pointDilationAccessor } = pointDilation;
const promises = [];
// X and Y dimensions
promises.push(
// @ts-expect-error ts-migrate(2488) FIXME: Type '(string | { where: { field: string; column: ... Remove this comment to see the full error message
annoMatrix.fetch(...this.createXQuery(scatterplotXXaccessor))
);
promises.push(
@@ -388,7 +408,7 @@ class Scatterplot extends React.PureComponent {
);
});
updateReglAndRender(newRenderCache) {
updateReglAndRender(newRenderCache: any) {
const { positions, colors, flags } = newRenderCache;
this.renderCache = newRenderCache;
const { pointBuffer, colorBuffer, flagBuffer } = this.state;
@@ -399,13 +419,14 @@ class Scatterplot extends React.PureComponent {
}
renderPoints(
regl,
drawPoints,
flagBuffer,
colorBuffer,
pointBuffer,
projectionTF
regl: any,
drawPoints: any,
flagBuffer: any,
colorBuffer: any,
pointBuffer: any,
projectionTF: any
) {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
const { annoMatrix } = this.props;
if (!this.reglCanvas || !annoMatrix) return;
@@ -433,12 +454,19 @@ class Scatterplot extends React.PureComponent {
render() {
const {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
dispatch,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'annoMatrix' does not exist on type 'Read... Remove this comment to see the full error message
annoMatrix,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scatterplotXXaccessor' does not exist on... Remove this comment to see the full error message
scatterplotXXaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scatterplotYYaccessor' does not exist on... Remove this comment to see the full error message
scatterplotYYaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'colors' does not exist on type 'Readonly... Remove this comment to see the full error message
colors,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'crossfilter' does not exist on type 'Rea... Remove this comment to see the full error message
crossfilter,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'pointDilation' does not exist on type 'R... Remove this comment to see the full error message
pointDilation,
} = this.props;
const { minimized, regl, viewport } = this.state;
@@ -505,6 +533,7 @@ class Scatterplot extends React.PureComponent {
style={{
marginLeft: margin.left,
marginTop: margin.top,
// @ts-expect-error ts-migrate(2322) FIXME: Type '"none" | null' is not assignable to type 'Di... Remove this comment to see the full error message
display: minimized ? "none" : null,
}}
ref={this.setReglCanvas}
@@ -531,11 +560,12 @@ class Scatterplot extends React.PureComponent {
}
return (
<ScatterplotAxis
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ minimized: any; scatterplotYYaccessor: any... Remove this comment to see the full error message
minimized={minimized}
scatterplotYYaccessor={scatterplotYYaccessor}
scatterplotXXaccessor={scatterplotXXaccessor}
xScale={asyncProps.xScale}
yScale={asyncProps.yScale}
xScale={(asyncProps as any).xScale}
yScale={(asyncProps as any).yScale}
/>
);
}}
@@ -551,10 +581,15 @@ export default Scatterplot;
const ScatterplotAxis = React.memo(
({
// @ts-expect-error ts-migrate(2339) FIXME: Property 'minimized' does not exist on type '{ chi... Remove this comment to see the full error message
minimized,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scatterplotYYaccessor' does not exist on... Remove this comment to see the full error message
scatterplotYYaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'scatterplotXXaccessor' does not exist on... Remove this comment to see the full error message
scatterplotXXaccessor,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'xScale' does not exist on type '{ childr... Remove this comment to see the full error message
xScale,
// @ts-expect-error ts-migrate(2339) FIXME: Property 'yScale' does not exist on type '{ childr... Remove this comment to see the full error message
yScale,
}) => {
/*
@@ -578,7 +613,9 @@ const ScatterplotAxis = React.memo(
// the axes are much cleaner and easier now. No need to rotate and orient
// the axis, just call axisBottom, axisLeft etc.
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const xAxis = d3.axisBottom().ticks(7).scale(xScale);
// @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
const yAxis = d3.axisLeft().ticks(7).scale(yScale);
// adding axes is also simpler now, just translate x-axis to (0,height)
@@ -621,6 +658,7 @@ const ScatterplotAxis = React.memo(
height={height + margin.top + margin.bottom}
data-testid="scatterplot-svg"
style={{
// @ts-expect-error ts-migrate(2322) FIXME: Type '"none" | null' is not assignable to type 'Di... Remove this comment to see the full error message
display: minimized ? "none" : null,
}}
>
client/src/components/scatterplot/util.js → client/src/components/scatterplot/util.ts
View File
client/src/components/termsPrompt/index.js → client/src/components/termsPrompt/index.tsx
+19 -7
View File
@@ -10,13 +10,19 @@ import {
} from "@blueprintjs/core";
import { storageGet, storageSet, KEYS } from "../util/localStorage";
type State = any;
// @ts-expect-error ts-migrate(1238) FIXME: Unable to resolve signature of class decorator whe... Remove this comment to see the full error message
@connect((state) => ({
tosURL: state.config?.parameters?.about_legal_tos,
privacyURL: state.config?.parameters?.about_legal_privacy,
tosURL: (state as any).config?.parameters?.about_legal_tos,
privacyURL: (state as any).config?.parameters?.about_legal_privacy,
}))
class TermsPrompt extends React.PureComponent {
constructor(props) {
class TermsPrompt extends React.PureComponent<{}, State> {
drawerClose: any;
constructor(props: {}) {
super(props);
// @ts-expect-error ts-migrate(2339) FIXME: Property 'tosURL' does not exist on type 'Readonly... Remove this comment to see the full error message
const { tosURL, privacyURL } = this.props;
const cookieDecision = storageGet(KEYS.COOKIE_DECISION, null);
const hasDecided = cookieDecision !== null;
@@ -37,8 +43,10 @@ class TermsPrompt extends React.PureComponent {
handleOK = () => {
this.setState({ isOpen: false });
storageSet(KEYS.COOKIE_DECISION, "yes");
// @ts-expect-error ts-migrate(2339) FIXME: Property 'cookieDecisionCallback' does not exist o... Remove this comment to see the full error message
if (window.cookieDecisionCallback instanceof Function) {
try {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'cookieDecisionCallback' does not exist o... Remove this comment to see the full error message
window.cookieDecisionCallback();
} catch (e) {
// continue
@@ -52,6 +60,7 @@ class TermsPrompt extends React.PureComponent {
};
renderTos() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'tosURL' does not exist on type 'Readonly... Remove this comment to see the full error message
const { tosURL } = this.props;
if (!tosURL) return null;
return (
@@ -75,6 +84,7 @@ class TermsPrompt extends React.PureComponent {
}
renderPrivacy() {
// @ts-expect-error ts-migrate(2339) FIXME: Property 'privacyURL' does not exist on type 'Read... Remove this comment to see the full error message
const { privacyURL } = this.props;
if (!privacyURL) return null;
return (
@@ -101,13 +111,16 @@ class TermsPrompt extends React.PureComponent {
if (!isEnabled || !isOpen) return null;
return (
<Drawer
// @ts-expect-error ts-migrate(2322) FIXME: Type '{ children: Element; onclose: any; isOpen: a... Remove this comment to see the full error message
onclose={this.drawerClose}
isOpen={isOpen}
size="120px"
position={Position.BOTTOM}
canOutsideClickClose={false}
hasBackdrop /* if the user can't use the app or click outside to dismiss, that should be visually represented with a backdrop */
enforceFocus={false}
hasBackdrop
/* if the user can't use the app or click outside to dismiss, that should be visually represented with a backdrop */ enforceFocus={
false
}
autoFocus={false}
portal={false}
>
@@ -143,5 +156,4 @@ class TermsPrompt extends React.PureComponent {
);
}
}
export default TermsPrompt;
client/src/components/util/localStorage.js → client/src/components/util/localStorage.ts
+2 -2
View File
@@ -3,7 +3,7 @@ export const KEYS = {
LOGIN_PROMPT: "cxg.LOGIN_PROMPT",
};
export function storageGet(key, defaultValue = null) {
export function storageGet(key: any, defaultValue = null) {
try {
const val = window.localStorage.getItem(key);
if (val === null) return defaultValue;
@@ -13,7 +13,7 @@ export function storageGet(key, defaultValue = null) {
}
}
export function storageSet(key, value) {
export function storageSet(key: any, value: any) {
try {
window.localStorage.setItem(key, value);
} catch {
client/src/components/util/truncate.js → client/src/components/util/truncate.tsx
+5 -1
View File
@@ -32,7 +32,7 @@ const SECOND_HALF_INNER_STYLE = {
right: 0,
};
export default (props) => {
export default (props: any) => {
const { children, tooltipAddendum = "" } = props;
// Truncate only support a single child with a text child
@@ -70,9 +70,12 @@ export default (props) => {
const truncatedJSX = (
<span style={splitStyle}>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ overflow: string; textOverflow: string; wh... Remove this comment to see the full error message */}
<span style={FIRST_HALF_STYLE}>{firstString}</span>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ position: string; overflow: string; whiteS... Remove this comment to see the full error message */}
<span style={SECOND_HALF_STYLE}>
<span style={SECOND_HALF_SPACING_STYLE}>{secondString}</span>
{/* @ts-expect-error ts-migrate(2322) FIXME: Type '{ color: any; position: string; right: numbe... Remove this comment to see the full error message */}
<span style={secondHalfContentStyle}>{secondString}</span>
</span>
</span>
@@ -89,6 +92,7 @@ export default (props) => {
<Tooltip2
content={`${originalString}${tooltipAddendum}`}
hoverOpenDelay={tooltipHoverOpenDelayQuick}
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
targetProps={{ style: children.props.style }}
>
{newChildren}
client/src/globals.js → client/src/globals.ts
+2 -2
View File
@@ -91,8 +91,8 @@ const CXG_SERVER_PORT =
let _API;
if (window.CELLXGENE && window.CELLXGENE.API) {
_API = window.CELLXGENE.API;
if ((window as any).CELLXGENE && (window as any).CELLXGENE.API) {
_API = (window as any).CELLXGENE.API;
} else {
if (CXG_SERVER_PORT === undefined) {
const errorMessage = "Please set the CXG_SERVER_PORT environment variable.";
client/src/index.js → client/src/index.tsx
View File
client/src/reducers/annoMatrix.js → client/src/reducers/annoMatrix.ts
+1 -1
View File
@@ -2,7 +2,7 @@
Reducer for the annoMatrix
*/
const AnnoMatrix = (state = null, action) => {
const AnnoMatrix = (state = null, action: any) => {
if (action.annoMatrix) {
return action.annoMatrix;
}
client/src/reducers/annotations.js → client/src/reducers/annotations.ts
+1 -1
View File
@@ -28,7 +28,7 @@ const Annotations = (
labelEditable: { category: null, label: null },
promptForFilename: true,
},
action
action: any
) => {
switch (action.type) {
case "configuration load complete": {
client/src/reducers/autosave.js → client/src/reducers/autosave.ts
+2 -2
View File
@@ -11,8 +11,8 @@ const Autosave = (
// error state
error: false,
},
action,
nextSharedState
action: any,
nextSharedState: any
) => {
switch (action.type) {
case "annoMatrix: init complete": {
client/src/reducers/cascade.js → client/src/reducers/cascade.ts
+3 -2
View File
@@ -1,4 +1,4 @@
export default function cascadeReducers(arg) {
export default function cascadeReducers(arg: any) {
/*
Combine a set of cascading reducers into a single reducer. Cascading
reducers are reducers which may rely on state computed by another reducer.
@@ -23,7 +23,7 @@ export default function cascadeReducers(arg) {
*/
const reducers = arg instanceof Map ? arg : new Map(arg);
const reducerKeys = [...reducers.keys()];
return (prevState, action) => {
return (prevState: any, action: any) => {
const nextState = {};
let stateChange = false;
for (let i = 0, l = reducerKeys.length; i < l; i += 1) {
@@ -36,6 +36,7 @@ export default function cascadeReducers(arg) {
nextState,
prevState
);
// @ts-expect-error ts-migrate(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
nextState[key] = nextStateForKey;
stateChange = stateChange || nextStateForKey !== prevStateForKey;
}
client/src/reducers/categoricalSelection.js → client/src/reducers/categoricalSelection.ts
+6 -1
View File
@@ -11,7 +11,11 @@ Label state default (if missing) is up to the component, but typically true.
...
}
*/
const CategoricalSelection = (state, action, nextSharedState) => {
const CategoricalSelection = (
state: any,
action: any,
nextSharedState: any
) => {
switch (action.type) {
case "initial data load complete":
case "subset to selection":
@@ -19,6 +23,7 @@ const CategoricalSelection = (state, action, nextSharedState) => {
case "set clip quantiles": {
const { annoMatrix } = nextSharedState;
const newState = CH.createCategoricalSelection(
// @ts-expect-error ts-migrate(2554) FIXME: Expected 2 arguments, but got 1.
CH.selectableCategoryNames(annoMatrix.schema)
);
return newState;
client/src/reducers/centroidLabels.js → client/src/reducers/centroidLabels.ts
+5 -1
View File
@@ -2,7 +2,11 @@ const initialState = {
showLabels: false,
};
const centroidLabels = (state = initialState, action, sharedNextState) => {
const centroidLabels = (
state = initialState,
action: any,
sharedNextState: any
) => {
const {
colors: { colorAccessor },
} = sharedNextState;
client/src/reducers/colors.js → client/src/reducers/colors.ts
+1 -1
View File
@@ -7,7 +7,7 @@ const ColorsReducer = (
colorMode: null /* by continuous, by expression */,
colorAccessor: null /* tissue, Apod */,
},
action
action: any
) => {
switch (action.type) {
case "universe: user color load success": {
client/src/reducers/config.js → client/src/reducers/config.ts
+1 -1
View File
@@ -4,7 +4,7 @@ const Config = (
features: null,
parameters: null,
},
action
action: any
) => {
switch (action.type) {
case "initial data load start":
client/src/reducers/continuousSelection.js → client/src/reducers/continuousSelection.ts
+2 -1
View File
@@ -1,6 +1,6 @@
import { makeContinuousDimensionName } from "../util/nameCreators";
const ContinuousSelection = (state = {}, action) => {
const ContinuousSelection = (state = {}, action: any) => {
switch (action.type) {
case "reset subset":
case "subset to selection":
@@ -24,6 +24,7 @@ const ContinuousSelection = (state = {}, action) => {
action.continuousNamespace,
action.selection
);
// @ts-expect-error ts-migrate(2537) FIXME: Type '{}' has no matching index signature for type... Remove this comment to see the full error message
const { [name]: deletedField, ...newState } = state;
return newState;
}
client/src/reducers/controls.js → client/src/reducers/controls.ts
+1 -1
View File
@@ -20,7 +20,7 @@ const Controls = (
datasetDrawer: false,
},
action
action: any
) => {
/*
For now, log anything looking like an error to the console.
client/src/reducers/differential.js → client/src/reducers/differential.ts
+1 -1
View File
@@ -5,7 +5,7 @@ const Differential = (
celllist1: null,
celllist2: null,
},
action
action: any
) => {
switch (action.type) {
case "request differential expression started":

Some files were not shown because too many files have changed in this diff Show More