public renderTable()

in expanded_checklist/visual_interface/src/components/suite_summarizer/SuiteSummarizer.tsx [147:207]
57 lines of code
7 McCabe index (conditional complexity)

	public renderTable(): JSX.Element {
		const tests = suiteStore.overviewTests;
		// first, get the types
		const types: TestType[] = ["mft", "inv", "dir"];
		let capabilities: string[] = tests.map(t => t.capability).filter(utils.uniques);
		const order = ['Vocabulary', 'Taxonomy', 'Robustness', 'NER',  'Fairness', 'Temporal', 'Negation', 'Coref', 'SRL', 'Logic'];
		const testsByCaps = utils.groupBy(tests, "capability");
		const sources = [];
		const capOrder = (a: string) => order.indexOf(a) === -1 ? 200 : order.indexOf(a);
		capabilities = capabilities.sort((a, b) => capOrder(a) - capOrder(b));
		capabilities.forEach((cap: string) => {
			const localTests = cap in testsByCaps ? testsByCaps[cap] : [];
			const testsByType = utils.groupBy(localTests, "type");
			const curSource = { key: cap, capability: cap };
			types.forEach((ttype: TestType) => {
				const cellTests = ttype in testsByType ? testsByType[ttype] : [];
				curSource[ttype] = {
					key: `${ttype}-${cap}`,
					tests: cellTests,
				}
			});
			sources.push(curSource as CellType);
		})

		const columns: any[] = [{ 
			title: 'Capabilities', dataIndex: 'capability', key: 'capability',
		}]
		types.forEach(ttype => {
		columns.push({
			title: <div>
				<div>{headerMapper[ttype]}</div>
				<small><i>failure rate % (over N tests)</i></small>
			</div>, 
			dataIndex: ttype, key: ttype,
			render: (cell, row, _) => {
				const tests = cell.tests;
				const nTests = tests.length;
				const avgRate = nTests === 0 ? 0 : Math.max(...tests.map(t => t.testStats.rate("fail")));
				const rateStr = (avgRate * 100).toFixed(1) + "%";
				return {
						props: {
						  style: { 
							  background: nTests === 0 ? "white" : this.colorScale(Math.cbrt(avgRate)),
							  //boxShadow: "inset 0px 0px 0px 5px white" ,
							  //boxSizing: "border-box",
							  color: this.colorFontScale(Math.cbrt(avgRate))
							}
						},
						children: <div key={ttype}>{nTests > 0 ? `${rateStr} (${nTests})` : null}</div>
					};
				}
			})
		})
		return <Table 
			className="full-width"
			key={tests.map(t => t.key()).join("-")}
			pagination={false}
			rowKey={(row: CellType) => row.capability}
			expandedRowRender={this.renderPerCapability}
			dataSource={sources} columns={columns} />;
	}