Skip to content

Commit ef5f127

Browse files
Typechecking, linting and cleanup
* Revert removal of compressed cell colour features * Dependency updates * Use ts-loader instead of babel for typescript (ts-loader does type checking) * Use pako for zlib compression * Replace some uses of Lodash with Ramda * Upgrade from Webpack 4 to Webpack 5
1 parent b8599dc commit ef5f127

File tree

12 files changed

+909
-898
lines changed

12 files changed

+909
-898
lines changed

babel.config.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ module.exports = {
66
}
77
}
88
],
9-
'@babel/preset-react',
10-
'@babel/preset-typescript'
9+
'@babel/preset-react'
1110
]
1211
};

opt/scopeserver/dataserver/modules/gserver/GServer.py

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -215,8 +215,8 @@ def getCellColorByFeatures(self, request, context):
215215
logger.debug("{0:.5f} seconds elapsed getting colours ---".format(time.time() - start_time))
216216
return s_pb2.CellColorByFeaturesReply(
217217
color=None,
218-
compressedColor=cell_color_by_features.get_hex_vec(),
219-
hasAddCompressionLayer=False,
218+
compressedColor=cell_color_by_features.get_compressed_hex_vec(),
219+
hasAddCompressionLayer=True,
220220
vmax=cell_color_by_features.get_v_max(),
221221
maxVmax=cell_color_by_features.get_max_v_max(),
222222
cellIndices=cell_color_by_features.get_cell_indices(),

package-lock.json

Lines changed: 758 additions & 835 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 26 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -41,21 +41,21 @@
4141
"grpc-bus-websocket-client": "^0.3.1",
4242
"grpc-bus-websocket-server": "file:opt/scopeserver/bindserver",
4343
"grpc-caller": "^0.13.0",
44-
"grpc-tools": "^1.9.0",
45-
"immer": "^7.0.14",
44+
"grpc-tools": "^1.10.0",
45+
"immer": "^8.0.0",
4646
"js-file-download": "^0.4.12",
4747
"json-schema": "^0.2.3",
4848
"json2csv": "^4.0.1",
49-
"pako": "^1.0.6",
49+
"pako": "^2.0.2",
5050
"pixi.js": "^5.3.3",
51-
"protobufjs": "^6.9.0",
51+
"protobufjs": "^6.10.2",
5252
"public-ip": "^2.4.0",
5353
"ramda": "^0.27.0",
5454
"rc-slider": "^8.6.0",
5555
"react": "^16.14.0",
5656
"react-addons-css-transition-group": "^15.6.2",
5757
"react-cookie": "^4.0.3",
58-
"react-cookie-consent": "^6.1.0",
58+
"react-cookie-consent": "^6.2.0",
5959
"react-csv-reader": "^3.1.1",
6060
"react-dnd": "^2.5.4",
6161
"react-dnd-html5-backend": "^2.5.4",
@@ -81,48 +81,46 @@
8181
"url-loader": "^4.1.1"
8282
},
8383
"devDependencies": {
84-
"@babel/cli": "^7.12.1",
85-
"@babel/core": "^7.12.3",
84+
"@babel/cli": "^7.12.8",
85+
"@babel/core": "^7.12.9",
8686
"@babel/plugin-proposal-class-properties": "^7.12.1",
8787
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
8888
"@babel/plugin-transform-runtime": "^7.12.1",
89-
"@babel/preset-env": "^7.12.1",
90-
"@babel/preset-react": "^7.12.5",
91-
"@babel/preset-typescript": "^7.12.1",
89+
"@babel/preset-env": "^7.12.7",
90+
"@babel/preset-react": "^7.12.7",
9291
"@babel/runtime": "^7.12.5",
9392
"@redux-saga/testing-utils": "^1.1.3",
9493
"@testing-library/jest-dom": "^5.11.6",
95-
"@testing-library/react": "^11.1.2",
96-
"@types/jest": "^26.0.15",
97-
"@types/react": "^16.9.56",
98-
"@types/react-dom": "^16.9.9",
94+
"@testing-library/react": "^11.2.2",
95+
"@types/jest": "^26.0.16",
96+
"@types/react": "^16.14.2",
97+
"@types/react-dom": "^16.9.10",
9998
"@types/react-router-dom": "^5.1.6",
100-
"@typescript-eslint/eslint-plugin": "^4.7.0",
101-
"@typescript-eslint/parser": "^4.7.0",
99+
"@typescript-eslint/eslint-plugin": "^4.9.0",
100+
"@typescript-eslint/parser": "^4.9.0",
102101
"babel-jest": "^26.6.3",
103-
"babel-loader": "^8.2.1",
104-
"babel-plugin-redux-saga": "^1.1.2",
105-
"cross-env": "^7.0.2",
102+
"babel-loader": "^8.2.2",
103+
"cross-env": "^7.0.3",
106104
"css-loader": "^5.0.1",
107-
"eslint": "^7.13.0",
108-
"eslint-config-prettier": "^6.15.0",
109-
"eslint-plugin-prettier": "^3.1.3",
105+
"eslint": "^7.15.0",
106+
"eslint-config-prettier": "^7.0.0",
107+
"eslint-plugin-prettier": "^3.2.0",
110108
"eslint-plugin-react": "^7.21.5",
111-
"fork-ts-checker-webpack-plugin": "^6.0.1",
112-
"google-protobuf": "^3.13.0",
109+
"google-protobuf": "^3.14.0",
113110
"grpc": "^1.24.4",
114111
"grpc-loader": "^2.0.1",
115112
"jest": "^26.6.3",
116113
"jest-css-modules-transform": "4.0.1",
117-
"prettier": "^2.1.2",
114+
"prettier": "^2.2.1",
118115
"redux-devtools-extension": "^2.13.8",
119116
"script-loader": "^0.7.2",
120117
"style-loader": "^2.0.0",
121118
"terser-webpack-plugin": "^5.0.3",
122119
"ts-jest": "^26.4.4",
123-
"typescript": "^4.0.5",
124-
"webpack": "^5.4.0",
125-
"webpack-bundle-analyzer": "^4.1.0",
120+
"ts-loader": "^8.0.11",
121+
"typescript": "^4.1.2",
122+
"webpack": "^5.10.0",
123+
"webpack-bundle-analyzer": "^4.2.0",
126124
"webpack-cli": "^4.2.0",
127125
"webpack-dev-server": "^3.11.0"
128126
},

src/components/App.jsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { connect } from 'react-redux';
44
import { withRouter, Route, Link } from 'react-router-dom';
55
import { withCookies, Cookies } from 'react-cookie';
66
import CookieConsent from 'react-cookie-consent';
7-
7+
import pako from 'pako';
88
import Favicon from 'react-favicon';
99

1010
import { SCOPE_COOKIE, ONE_MINUTE } from './constants';
@@ -24,7 +24,6 @@ import {
2424
import { FullPageNotify } from './pages';
2525
import { millisecondsToDays } from './utils';
2626

27-
const pako = require('pako');
2827
const publicIp = require('public-ip');
2928
const timer = 60 * 1000;
3029

src/components/AppHeader.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ import { BackendAPI } from './common/API';
1515
import PropTypes from 'prop-types';
1616
import { withCookies, Cookies } from 'react-cookie';
1717
import Bitly from 'bitly4api';
18+
import pako from 'pako';
1819

19-
const pako = require('pako');
2020
let bitly = new Bitly(BITLY.token);
2121

2222
import { toggleSidebar, consentToCookies } from '../redux/actions';

src/components/common/Viewer.jsx

Lines changed: 28 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,12 @@ import * as d3 from 'd3';
55
import * as R from 'ramda';
66
import { BackendAPI } from './API';
77
import { Dimmer, Loader } from 'semantic-ui-react';
8+
import pako from 'pako';
89
import Alert from 'react-popup';
910
import { debounce } from 'lodash';
1011

12+
import { zipLists } from '../../util';
13+
1114
const MIN_SCALING_FACTOR = 1;
1215
const DEFAULT_POINT_COLOR = 'A6A6A6';
1316

@@ -434,7 +437,7 @@ export default class Viewer extends Component {
434437

435438
translatePointsInLasso(indices) {
436439
let ptsInLasso = [];
437-
let idxInLasso = _.intersection(indices, this.state.coord.idx);
440+
let idxInLasso = R.intersection(indices, this.state.coord.idx);
438441
ptsInLasso = idxInLasso.map((idx) => {
439442
return this.state.coord.idx.indexOf(idx);
440443
});
@@ -1067,9 +1070,29 @@ export default class Viewer extends Component {
10671070
response
10681071
);
10691072
}
1073+
// Convert object to ArrayBuffer
1074+
let responseBuffered =
1075+
response.compressedColor.toArrayBuffer();
1076+
1077+
// Uncompress
10701078
if (response.hasAddCompressionLayer) {
1071-
// Uncompress
1072-
console.error('Zlib compression is not supported');
1079+
pako.inflate(
1080+
responseBuffered,
1081+
(err, uncompressedMessage) => {
1082+
if (err) {
1083+
console.log(err);
1084+
} else {
1085+
this.endBenchmark(
1086+
'getFeatureColors'
1087+
);
1088+
let colors = this.chunkString(
1089+
uncompressedMessage.toString(),
1090+
6
1091+
);
1092+
this.updateColors(response, colors);
1093+
}
1094+
}
1095+
);
10731096
} else {
10741097
this.endBenchmark('getFeatureColors');
10751098
this.updateColors(response, response.color);
@@ -1156,7 +1179,7 @@ export default class Viewer extends Component {
11561179
});
11571180
let settings = BackendAPI.getSettings();
11581181
if (settings.sortCells) {
1159-
let pts = _.zip(
1182+
let pts = zipLists(
11601183
this.state.coord.idx,
11611184
this.state.coord.x,
11621185
this.state.coord.y,
@@ -1173,7 +1196,7 @@ export default class Viewer extends Component {
11731196
});
11741197
this.endBenchmark('sort');
11751198
this.startBenchmark('map');
1176-
pts.map((p, i) => {
1199+
pts.forEach((p, i) => {
11771200
let point = this.getTexturedColorPoint(p[1], p[2], p[3]);
11781201
point._originalData.idx = p[0];
11791202
this.mainLayer.addChildAt(point, i);

src/components/common/ViewerSidebar.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ class ViewerSidebar extends Component {
115115
getButtonText = (text) => {
116116
switch (this.state.status) {
117117
case 'ready':
118-
switch (button) {
118+
switch (text) {
119119
case 'submit':
120120
return (
121121
<React.Fragment>
@@ -1374,7 +1374,7 @@ const viewerSidebar = withCookies(withRouter(ViewerSidebar));
13741374

13751375
const mapStateToProps = (rootState) => {
13761376
return {
1377-
sessionIsRW: rootState.main.sessionMode === 'rw'
1377+
sessionIsRW: rootState.main.sessionMode === 'rw',
13781378
};
13791379
};
13801380

src/components/pages/Compare.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -573,7 +573,7 @@ class Compare extends Component {
573573
}
574574
this.setState({ crossAnnotations: cross });
575575
} else {
576-
console.log('Annotation cannot be found', viewer, name, remove);
576+
console.log('Annotation cannot be found', viewer, name);
577577
}
578578
this.getCellMetadata();
579579
}

src/util.test.ts

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import 'jest';
2+
3+
import { zipLists } from './util';
4+
5+
describe('zip arbitrary lists', () => {
6+
it('zips the empty list', () => {
7+
expect(zipLists([])).toEqual([]);
8+
});
9+
10+
it('zips singleton lists', () => {
11+
expect(zipLists([[1], [2], [3]])).toEqual([[1, 2, 3]]);
12+
13+
expect(zipLists([[1]])).toEqual([[1]]);
14+
15+
expect(zipLists([[1, 2, 3]])).toEqual([[1, 2, 3]]);
16+
});
17+
18+
it('zips a pair of lists', () => {
19+
expect(
20+
zipLists([
21+
[1, 2],
22+
[3, 4],
23+
])
24+
).toEqual([
25+
[1, 3],
26+
[2, 4],
27+
]);
28+
});
29+
30+
it('zips 3 lists', () => {
31+
expect(
32+
zipLists([
33+
[1, 2],
34+
[3, 4],
35+
[5, 6],
36+
])
37+
).toEqual([
38+
[1, 3, 5],
39+
[2, 4, 6],
40+
]);
41+
});
42+
});

src/util.ts

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/* Utility functions */
2+
3+
import * as R from 'ramda';
4+
5+
/**
6+
* zip() but for an arbitrary number of lists.
7+
* Normally you should use R.zip, but sometimes you may want to "zip"
8+
* more than 2 arrays.
9+
*
10+
* Examples:
11+
* zipLists([]) => []
12+
* zipLists([[1], [2], [3]]) => [[1, 2, 3]]
13+
* zipLists([[1, 2], ['a', 'b']]) => [[1, 'a'], [2, 'b']]
14+
*/
15+
export const zipLists = <T>(l: Array<Array<T>>): Array<Array<T>> => {
16+
const acc: Array<T> | undefined = R.head(l);
17+
const data: Array<Array<T>> | undefined = R.tail(l);
18+
19+
if (acc !== undefined && data !== undefined) {
20+
const zipped: Readonly<any[]> = R.isEmpty(data)
21+
? l
22+
: R.reduce(R.zip, acc, data);
23+
return R.map(R.flatten, zipped);
24+
}
25+
return [];
26+
};

0 commit comments

Comments
 (0)