@genspectrum/dashboard-components 1.8.1 → 1.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/assets/{mutationOverTimeWorker-BRPqAM5Z.js.map → mutationOverTimeWorker-dhufsWQ2.js.map} +1 -1
  2. package/dist/components.d.ts +8 -8
  3. package/dist/components.js +4 -3
  4. package/dist/components.js.map +1 -1
  5. package/dist/util.d.ts +8 -8
  6. package/package.json +1 -1
  7. package/src/preact/mutationsOverTime/__mockData__/withGaps.ts +0 -54
  8. package/src/preact/mutationsOverTime/mutations-over-time-grid.tsx +6 -2
  9. package/src/query/queryMutationsOverTime.ts +28 -11
  10. package/src/query/queryMutationsOverTimeNewEndpoint.spec.ts +6 -6
  11. package/standalone-bundle/assets/{mutationOverTimeWorker-DtFX4Ihx.js.map → mutationOverTimeWorker-CGqPKySO.js.map} +1 -1
  12. package/standalone-bundle/dashboard-components.js +1164 -1164
  13. package/standalone-bundle/dashboard-components.js.map +1 -1
package/dist/util.d.ts CHANGED
@@ -1037,7 +1037,7 @@ declare global {
1037
1037
 
1038
1038
  declare global {
1039
1039
  interface HTMLElementTagNameMap {
1040
- 'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
1040
+ 'gs-mutations-over-time': MutationsOverTimeComponent;
1041
1041
  }
1042
1042
  }
1043
1043
 
@@ -1045,7 +1045,7 @@ declare global {
1045
1045
  declare global {
1046
1046
  namespace JSX {
1047
1047
  interface IntrinsicElements {
1048
- 'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1048
+ 'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1049
1049
  }
1050
1050
  }
1051
1051
  }
@@ -1053,7 +1053,7 @@ declare global {
1053
1053
 
1054
1054
  declare global {
1055
1055
  interface HTMLElementTagNameMap {
1056
- 'gs-mutations-over-time': MutationsOverTimeComponent;
1056
+ 'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
1057
1057
  }
1058
1058
  }
1059
1059
 
@@ -1061,7 +1061,7 @@ declare global {
1061
1061
  declare global {
1062
1062
  namespace JSX {
1063
1063
  interface IntrinsicElements {
1064
- 'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1064
+ 'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1065
1065
  }
1066
1066
  }
1067
1067
  }
@@ -1069,7 +1069,7 @@ declare global {
1069
1069
 
1070
1070
  declare global {
1071
1071
  interface HTMLElementTagNameMap {
1072
- 'gs-statistics': StatisticsComponent;
1072
+ 'gs-sequences-by-location': SequencesByLocationComponent;
1073
1073
  }
1074
1074
  }
1075
1075
 
@@ -1077,7 +1077,7 @@ declare global {
1077
1077
  declare global {
1078
1078
  namespace JSX {
1079
1079
  interface IntrinsicElements {
1080
- 'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1080
+ 'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1081
1081
  }
1082
1082
  }
1083
1083
  }
@@ -1085,7 +1085,7 @@ declare global {
1085
1085
 
1086
1086
  declare global {
1087
1087
  interface HTMLElementTagNameMap {
1088
- 'gs-sequences-by-location': SequencesByLocationComponent;
1088
+ 'gs-statistics': StatisticsComponent;
1089
1089
  }
1090
1090
  }
1091
1091
 
@@ -1093,7 +1093,7 @@ declare global {
1093
1093
  declare global {
1094
1094
  namespace JSX {
1095
1095
  interface IntrinsicElements {
1096
- 'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1096
+ 'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1097
1097
  }
1098
1098
  }
1099
1099
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@genspectrum/dashboard-components",
3
- "version": "1.8.1",
3
+ "version": "1.8.2",
4
4
  "description": "GenSpectrum web components for building dashboards",
5
5
  "type": "module",
6
6
  "license": "AGPL-3.0-only",
package/src/preact/mutationsOverTime/__mockData__/withGaps.ts CHANGED
@@ -80,15 +80,6 @@ export const withGaps: MutationOverTimeMockData = {
80
80
  totalCount: 8236,
81
81
  },
82
82
  ],
83
- [
84
- '2024-04',
85
- {
86
- type: 'value',
87
- count: 0,
88
- proportion: NaN,
89
- totalCount: 0,
90
- },
91
- ],
92
83
  [
93
84
  '2024-05',
94
85
  {
@@ -98,15 +89,6 @@ export const withGaps: MutationOverTimeMockData = {
98
89
  totalCount: 8799,
99
90
  },
100
91
  ],
101
- [
102
- '2024-06',
103
- {
104
- type: 'value',
105
- count: 0,
106
- proportion: NaN,
107
- totalCount: 0,
108
- },
109
- ],
110
92
  [
111
93
  '2024-07',
112
94
  {
@@ -148,15 +130,6 @@ export const withGaps: MutationOverTimeMockData = {
148
130
  totalCount: 8236,
149
131
  },
150
132
  ],
151
- [
152
- '2024-04',
153
- {
154
- type: 'value',
155
- count: 0,
156
- proportion: NaN,
157
- totalCount: 0,
158
- },
159
- ],
160
133
  [
161
134
  '2024-05',
162
135
  {
@@ -166,15 +139,6 @@ export const withGaps: MutationOverTimeMockData = {
166
139
  totalCount: 8799,
167
140
  },
168
141
  ],
169
- [
170
- '2024-06',
171
- {
172
- type: 'value',
173
- count: 0,
174
- proportion: NaN,
175
- totalCount: 0,
176
- },
177
- ],
178
142
  [
179
143
  '2024-07',
180
144
  {
@@ -212,15 +176,6 @@ export const withGaps: MutationOverTimeMockData = {
212
176
  totalCount: 8236,
213
177
  },
214
178
  ],
215
- [
216
- '2024-04',
217
- {
218
- type: 'value',
219
- count: 0,
220
- proportion: NaN,
221
- totalCount: 0,
222
- },
223
- ],
224
179
  [
225
180
  '2024-05',
226
181
  {
@@ -230,15 +185,6 @@ export const withGaps: MutationOverTimeMockData = {
230
185
  totalCount: 8799,
231
186
  },
232
187
  ],
233
- [
234
- '2024-06',
235
- {
236
- type: 'value',
237
- count: 0,
238
- proportion: NaN,
239
- totalCount: 0,
240
- },
241
- ],
242
188
  [
243
189
  '2024-07',
244
190
  {
package/src/preact/mutationsOverTime/mutations-over-time-grid.tsx CHANGED
@@ -21,6 +21,8 @@ import {
21
21
  usePreactTable,
22
22
  } from '../shared/tanstackTable/tanstackTable';
23
23
 
24
+ const NON_BREAKING_SPACE = '\u00A0';
25
+
24
26
  export interface MutationsOverTimeGridProps {
25
27
  data: MutationOverTimeDataMap;
26
28
  colorScale: ColorScale;
@@ -176,7 +178,7 @@ const ProportionCell: FunctionComponent<{
176
178
  tooltipPosition: TooltipPosition;
177
179
  colorScale: ColorScale;
178
180
  }> = ({ value, mutation, date, tooltipPosition, colorScale }) => {
179
- const proportion = value?.type === 'belowThreshold' ? 0 : value?.proportion;
181
+ const proportion = value?.type === 'belowThreshold' ? undefined : value?.proportion;
180
182
 
181
183
  return (
182
184
  <div className={'py-1 w-full h-full'}>
@@ -194,7 +196,9 @@ const ProportionCell: FunctionComponent<{
194
196
  {value === null ? (
195
197
  <span className='invisible'>No data</span>
196
198
  ) : (
197
- <span className='invisible @[2rem]:visible'>{formatProportion(proportion ?? 0, 0)}</span>
199
+ <span className='invisible @[2rem]:visible'>
200
+ {proportion !== undefined ? formatProportion(proportion, 0) : NON_BREAKING_SPACE}
201
+ </span>
198
202
  )}
199
203
  </div>
200
204
  </Tooltip>
package/src/query/queryMutationsOverTime.ts CHANGED
@@ -295,17 +295,34 @@ async function queryMutationsOverTimeDataDirectEndpoint(
295
295
  responseMutations.map((mutation, i) => [
296
296
  mutation.code,
297
297
  new Map(
298
- allDates.map((date, j): [string, MutationOverTimeMutationValue] => [
299
- date.dateString,
300
- {
301
- type: 'value',
302
- // 'coverage' in the API resp. is the number of seqs. that have a non-ambiguous symbol at position
303
- // 'count' in the API resp. is the number of seqs with the mutation
304
- proportion: apiResult.data.data[i][j].count / apiResult.data.data[i][j].coverage,
305
- count: apiResult.data.data[i][j].count,
306
- totalCount: totalCounts[j],
307
- },
308
- ]),
298
+ allDates.map((date, j): [string, MutationOverTimeMutationValue] => {
299
+ if (totalCounts[j] === 0) {
300
+ return [date.dateString, null];
301
+ }
302
+ // 'count' in the API resp. is the number of seqs with the mutation
303
+ const count = apiResult.data.data[i][j].count;
304
+ // 'coverage' in the API resp. is the number of seqs. that have a non-ambiguous symbol at position
305
+ const coverage = apiResult.data.data[i][j].coverage;
306
+ const totalCount = totalCounts[j];
307
+ if (coverage === 0) {
308
+ return [
309
+ date.dateString,
310
+ {
311
+ type: 'belowThreshold',
312
+ totalCount,
313
+ },
314
+ ];
315
+ }
316
+ return [
317
+ date.dateString,
318
+ {
319
+ type: 'value',
320
+ proportion: count / coverage,
321
+ count,
322
+ totalCount,
323
+ },
324
+ ];
325
+ }),
309
326
  ),
310
327
  ]),
311
328
  ),
package/src/query/queryMutationsOverTimeNewEndpoint.spec.ts CHANGED
@@ -290,12 +290,12 @@ describe('queryMutationsOverTimeNewEndpoint', () => {
290
290
  expect(mutationOverTimeData.getAsArray()).to.deep.equal([
291
291
  [
292
292
  { type: 'value', proportion: 0.4, count: 4, totalCount: 11 },
293
- { type: 'value', proportion: 0, count: 0, totalCount: 0 },
293
+ null,
294
294
  { type: 'value', proportion: 0, count: 0, totalCount: 13 },
295
295
  ],
296
296
  [
297
297
  { type: 'value', proportion: 0.1, count: 1, totalCount: 11 },
298
- { type: 'value', proportion: 0, count: 0, totalCount: 0 },
298
+ null,
299
299
  { type: 'value', proportion: 0.3, count: 3, totalCount: 13 },
300
300
  ],
301
301
  ]);
@@ -1013,8 +1013,8 @@ describe('queryMutationsOverTimeNewEndpoint', () => {
1013
1013
 
1014
1014
  expect(mutationOverTimeData.getAsArray()).to.deep.equal([
1015
1015
  [
1016
- { type: 'value', proportion: NaN, count: 0, totalCount: 11 },
1017
- { type: 'value', proportion: NaN, count: 0, totalCount: 12 },
1016
+ { type: 'belowThreshold', totalCount: 11 },
1017
+ { type: 'belowThreshold', totalCount: 12 },
1018
1018
  ],
1019
1019
  [
1020
1020
  { type: 'value', proportion: 0.2, count: 2, totalCount: 11 },
@@ -1135,8 +1135,8 @@ describe('queryMutationsOverTimeNewEndpoint', () => {
1135
1135
 
1136
1136
  expect(mutationOverTimeData.getAsArray()).to.deep.equal([
1137
1137
  [
1138
- { type: 'value', proportion: NaN, count: 0, totalCount: 11 },
1139
- { type: 'value', proportion: NaN, count: 0, totalCount: 12 },
1138
+ { type: 'belowThreshold', totalCount: 11 },
1139
+ { type: 'belowThreshold', totalCount: 12 },
1140
1140
  ],
1141
1141
  [
1142
1142
  { type: 'value', proportion: 0.2, count: 2, totalCount: 11 },