Skip to content

Commit 906fed0

Browse files
authored
Adjust plot ribbon tooltips (#4135)
* remove Created column * add table description * adds info icon to ribbon blocks
1 parent 74d8f9a commit 906fed0

File tree

11 files changed

+179
-163
lines changed

11 files changed

+179
-163
lines changed

extension/src/experiments/columns/model.test.ts

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -258,13 +258,14 @@ describe('ColumnsModel', () => {
258258
expect(model.getColumnOrder()).toStrictEqual(persistedState)
259259
})
260260

261-
it('should return the first three none hidden columns from the persisted state', async () => {
261+
it('should return the first three none hidden columns (minus created) from the persisted state', async () => {
262262
const persistedState = [
263263
'id',
264264
'Created',
265265
'params:params.yaml:dvc_logs_dir',
266266
'params:params.yaml:process.threshold',
267267
'params:params.yaml:process.test_arg',
268+
'params:params.yaml:dropout',
268269
'deps:src/prepare.py',
269270
'deps:src/featurization.py'
270271
]
@@ -280,17 +281,17 @@ describe('ColumnsModel', () => {
280281
await model.transformAndSet(outputFixture)
281282

282283
expect(model.getFirstThreeColumnOrder()).toStrictEqual(
283-
persistedState.slice(1, 4)
284+
persistedState.slice(2, 5)
284285
)
285286

286-
model.toggleStatus('Created')
287+
model.toggleStatus('params:params.yaml:dvc_logs_dir')
287288

288289
expect(model.getFirstThreeColumnOrder()).toStrictEqual(
289-
persistedState.slice(2, 5)
290+
persistedState.slice(3, 6)
290291
)
291292
})
292293

293-
it('should return the first three none hidden columns collected from data if state is empty', async () => {
294+
it('should return the first three none hidden columns (minus created) collected from data if state is empty', async () => {
294295
const model = new ColumnsModel(
295296
exampleDvcRoot,
296297
buildMockMemento(),
@@ -299,9 +300,9 @@ describe('ColumnsModel', () => {
299300
await model.transformAndSet(outputFixture)
300301

301302
expect(model.getFirstThreeColumnOrder()).toStrictEqual([
302-
'Created',
303303
'metrics:summary.json:loss',
304-
'metrics:summary.json:accuracy'
304+
'metrics:summary.json:accuracy',
305+
'metrics:summary.json:val_loss'
305306
])
306307

307308
model.toggleStatus('Created')

extension/src/experiments/columns/model.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,10 @@ export class ColumnsModel extends PathSelectionModel<Column> {
4646

4747
public getFirstThreeColumnOrder(): string[] {
4848
return this.columnOrderState
49-
.filter(path => this.status[path] && this.status[path] === 2)
49+
.filter(
50+
path =>
51+
this.status[path] && this.status[path] === 2 && path !== 'Created'
52+
)
5053
.slice(0, 3)
5154
}
5255

extension/src/experiments/model/quickPick.test.ts

Lines changed: 74 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,8 @@ import {
1111
} from '../../vscode/quickPick'
1212
import { Experiment } from '../webview/contract'
1313
import { Title } from '../../vscode/title'
14-
import { formatDate } from '../../util/date'
15-
1614
import { Toast } from '../../vscode/toast'
15+
import { formatDate } from '../../util/date'
1716

1817
jest.mock('../../vscode/quickPick')
1918
jest.mock('../../vscode/toast')
@@ -99,6 +98,13 @@ describe('pickExperimentsToPlot', () => {
9998
description: '[exp-123]',
10099
id: 'exp-123',
101100
label: '123fsf4',
101+
metrics: {
102+
'dvclive/metrics.json': {
103+
data: {
104+
accuracy: 0.78
105+
}
106+
}
107+
},
102108
params: {
103109
'params.yaml': {
104110
prepare: { split: 0 }
@@ -116,6 +122,13 @@ describe('pickExperimentsToPlot', () => {
116122
description: '[exp-456]',
117123
id: 'exp-456',
118124
label: '456fsf4',
125+
metrics: {
126+
'dvclive/metrics.json': {
127+
data: {
128+
accuracy: 0.15
129+
}
130+
}
131+
},
119132
params: {
120133
'params.yaml': {
121134
prepare: { split: 22000435560000 }
@@ -131,6 +144,13 @@ describe('pickExperimentsToPlot', () => {
131144
description: '[exp-789]',
132145
id: 'exp-789',
133146
label: '789fsf4',
147+
metrics: {
148+
'dvclive/metrics.json': {
149+
data: {
150+
accuracy: 0.35
151+
}
152+
}
153+
},
134154
params: {
135155
'params.yaml': {
136156
prepare: { split: 0.000311111 }
@@ -142,7 +162,7 @@ describe('pickExperimentsToPlot', () => {
142162

143163
mockedQuickPickLimitedValues.mockResolvedValueOnce([selectedExperiment])
144164
const picked = await pickExperimentsToPlot(mockedExperiments, [
145-
'Created',
165+
'metrics:dvclive/metrics.json:data.accuracy',
146166
'params:params.yaml:prepare.split',
147167
'deps:data/data.xml'
148168
])
@@ -153,25 +173,19 @@ describe('pickExperimentsToPlot', () => {
153173
[
154174
{
155175
description: '[exp-123]',
156-
detail: `Created:${formatDate(
157-
mockedExperiments[0].Created as string
158-
)}, split:0, data/data.xml:22a1a29`,
176+
detail: 'accuracy:0.78, split:0, data/data.xml:22a1a29',
159177
label: '123fsf4',
160178
value: mockedExperiments[0]
161179
},
162180
{
163181
description: '[exp-456]',
164-
detail: `Created:${formatDate(
165-
mockedExperiments[1].Created as string
166-
)}, split:2.2000436e+13, data/data.xml:22a1a29`,
182+
detail: 'accuracy:0.15, split:2.2000436e+13, data/data.xml:22a1a29',
167183
label: '456fsf4',
168184
value: mockedExperiments[1]
169185
},
170186
{
171187
description: '[exp-789]',
172-
detail: `Created:${formatDate(
173-
mockedExperiments[2].Created as string
174-
)}, split:0.00031111100, data/data.xml:22a1a29`,
188+
detail: 'accuracy:0.35, split:0.00031111100, data/data.xml:22a1a29',
175189
label: '789fsf4',
176190
value: mockedExperiments[2]
177191
}
@@ -284,38 +298,50 @@ describe('pickExperiment', () => {
284298
const mockedExpListWithColumnData = [
285299
{
286300
...mockedExpList[0],
287-
Created: '2022-12-02T10:48:24',
288301
metrics: {
289302
'summary.json': {
290303
accuracy: 0.3723166584968567,
291304
val_loss: 1.9979370832443237
292305
}
306+
},
307+
params: {
308+
'params.yaml': {
309+
epochs: 7
310+
}
293311
}
294312
},
295313
{
296314
...mockedExpList[1],
297-
Created: '2022-08-19T08:17:22',
298315
metrics: {
299316
'summary.json': {
300317
accuracy: 0.4668000042438507,
301318
val_loss: 1.8770883083343506
302319
}
320+
},
321+
params: {
322+
'params.yaml': {
323+
epochs: 8
324+
}
303325
}
304326
},
305327
{
306328
...mockedExpList[2],
307-
Created: '2020-12-29T15:27:01',
308329
metrics: {
309330
'summary.json': {
310331
accuracy: 0.557449996471405,
311332
val_loss: 1.7749212980270386
312333
}
334+
},
335+
params: {
336+
'params.yaml': {
337+
epochs: 5
338+
}
313339
}
314340
}
315341
]
316342
mockedQuickPickValue.mockResolvedValueOnce(expectedDetails)
317343
const experiment = await pickExperiment(mockedExpListWithColumnData, [
318-
'Created',
344+
'params:params.yaml:epochs',
319345
'metrics:summary.json:accuracy',
320346
'metrics:summary.json:val_loss'
321347
])
@@ -324,25 +350,19 @@ describe('pickExperiment', () => {
324350
[
325351
{
326352
description: '[exp-0580a]',
327-
detail: `Created:${formatDate(
328-
mockedExpListWithColumnData[0].Created
329-
)}, accuracy:0.37231666, val_loss:1.9979371`,
353+
detail: 'epochs:7, accuracy:0.37231666, val_loss:1.9979371',
330354
label: 'abcdefb',
331355
value: 'abcdefb'
332356
},
333357
{
334358
description: '[exp-c54c4]',
335-
detail: `Created:${formatDate(
336-
mockedExpListWithColumnData[1].Created
337-
)}, accuracy:0.46680000, val_loss:1.8770883`,
359+
detail: 'epochs:8, accuracy:0.46680000, val_loss:1.8770883',
338360
label: 'abcdefa',
339361
value: 'abcdefa'
340362
},
341363
{
342364
description: '[exp-054f1]',
343-
detail: `Created:${formatDate(
344-
mockedExpListWithColumnData[2].Created
345-
)}, accuracy:0.55745000, val_loss:1.7749213`,
365+
detail: 'epochs:5, accuracy:0.55745000, val_loss:1.7749213',
346366
label: 'abcdef1',
347367
value: 'abcdef1'
348368
}
@@ -390,7 +410,12 @@ describe('pickExperiments', () => {
390410
metrics: {
391411
'summary.json': {
392412
accuracy: 0.3723166584968567,
393-
val_loss: 1.9979370832443237
413+
date: '2022-12-02T10:48:24'
414+
}
415+
},
416+
params: {
417+
'params.yaml': {
418+
epochs: 8
394419
}
395420
}
396421
},
@@ -400,7 +425,12 @@ describe('pickExperiments', () => {
400425
metrics: {
401426
'summary.json': {
402427
accuracy: 0.4668000042438507,
403-
val_loss: 1.8770883083343506
428+
date: '2022-08-19T08:17:22'
429+
}
430+
},
431+
params: {
432+
'params.yaml': {
433+
epochs: 15
404434
}
405435
}
406436
},
@@ -410,41 +440,46 @@ describe('pickExperiments', () => {
410440
metrics: {
411441
'summary.json': {
412442
accuracy: 0.557449996471405,
413-
val_loss: 1.7749212980270386
443+
date: '2020-12-29T15:27:01'
444+
}
445+
},
446+
params: {
447+
'params.yaml': {
448+
epochs: 20
414449
}
415450
}
416451
}
417452
]
418453
mockedQuickPickManyValues.mockResolvedValueOnce(expectedDetails)
419454
const experiment = await pickExperiments(mockedExpListWithColumnData, [
420-
'Created',
455+
'params:params.yaml:epochs',
421456
'metrics:summary.json:accuracy',
422-
'metrics:summary.json:val_loss'
457+
'metrics:summary.json:date'
423458
])
424459

425460
expect(mockedQuickPickManyValues).toHaveBeenCalledWith(
426461
[
427462
{
428463
description: '[exp-0580a]',
429-
detail: `Created:${formatDate(
430-
mockedExpListWithColumnData[0].Created
431-
)}, accuracy:0.37231666, val_loss:1.9979371`,
464+
detail: `epochs:8, accuracy:0.37231666, date:${formatDate(
465+
mockedExpListWithColumnData[0].metrics['summary.json'].date
466+
)}`,
432467
label: 'abcdefb',
433468
value: 'abcdefb'
434469
},
435470
{
436471
description: '[exp-c54c4]',
437-
detail: `Created:${formatDate(
438-
mockedExpListWithColumnData[1].Created
439-
)}, accuracy:0.46680000, val_loss:1.8770883`,
472+
detail: `epochs:15, accuracy:0.46680000, date:${formatDate(
473+
mockedExpListWithColumnData[1].metrics['summary.json'].date
474+
)}`,
440475
label: 'abcdefa',
441476
value: 'abcdefa'
442477
},
443478
{
444479
description: '[exp-054f1]',
445-
detail: `Created:${formatDate(
446-
mockedExpListWithColumnData[2].Created
447-
)}, accuracy:0.55745000, val_loss:1.7749213`,
480+
detail: `epochs:20, accuracy:0.55745000, date:${formatDate(
481+
mockedExpListWithColumnData[2].metrics['summary.json'].date
482+
)}`,
448483
label: 'abcdef1',
449484
value: 'abcdef1'
450485
}

0 commit comments

Comments
 (0)