Skip to content

Commit 4ce00ec

Browse files
committed
Merge branch 'dev' into stephany/jest-2
2 parents 920b3aa + 42f30c7 commit 4ce00ec

File tree

14 files changed

+125
-83
lines changed

14 files changed

+125
-83
lines changed

mlflow-site/package.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,18 +9,18 @@
99
"lint": "next lint"
1010
},
1111
"dependencies": {
12+
"next": "14.2.15",
1213
"react": "^18",
13-
"react-dom": "^18",
14-
"next": "14.2.15"
14+
"react-dom": "^18"
1515
},
1616
"devDependencies": {
17-
"typescript": "^5",
1817
"@types/node": "^20",
1918
"@types/react": "^18",
2019
"@types/react-dom": "^18",
20+
"eslint": "^8",
21+
"eslint-config-next": "14.2.15",
2122
"postcss": "^8",
2223
"tailwindcss": "^3.4.1",
23-
"eslint": "^8",
24-
"eslint-config-next": "14.2.15"
24+
"typescript": "^5"
2525
}
2626
}

mlflow-site/src/app/components/Button.tsx

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,8 @@
33
const Button = () => {
44
return (
55
<div className='button'>
6-
<button
7-
onClick={() => {
8-
window.location.assign('https://github.com/oslabs-beta/mlflow-js');
9-
}}
10-
className='homeButton homeButtonDownload text-white'
11-
>
12-
Download
13-
</button>
14-
<button
15-
onClick={() => {
16-
window.location.assign('https://github.com/oslabs-beta/mlflow-js/tree/dev/mlflow/docs');
17-
}}
18-
className='homeButton homeButtonRead'
19-
>
20-
Read the Docs
21-
</button>
6+
<a href='https://github.com/oslabs-beta/mlflow-js' className='homeButton homeButtonDownload text-white'>Download</a>
7+
<a href='https://github.com/oslabs-beta/mlflow-js/tree/dev/mlflow/docs' className='homeButton homeButtonRead'>Read the Docs</a>
228
</div>
239
);
2410
};

mlflow-site/src/app/components/Demo.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,17 @@ const Demo = () => {
1212
'Description for what\'s happening in Demo 2. This block of text will contain all the info needed to understand the demo.',
1313
'Description for what\'s happening in Demo 3. This block of text will contain all the info needed to understand the demo.'
1414
];
15+
const demoCardVideos = [
16+
"https://player.vimeo.com/video/1022732764",
17+
"https://player.vimeo.com/video/1022732772",
18+
];
1519
for (let i = 0; i < 3; i++) {
1620
demos.push(
1721
<DemoCard
1822
key={`demoCard${i}`}
1923
header={demoCardHeaders[i]}
2024
blurb={demoCardBlurbs[i]}
25+
video={demoCardVideos[i]}
2126
/>
2227
);
2328
}

mlflow-site/src/app/components/DemoCard.tsx

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,33 @@
1-
import Image from 'next/image';
2-
31
const DemoCard = ({
42
header,
53
blurb,
4+
video
65
}: {
76
key: string;
87
blurb: string;
98
header: string;
9+
video: string;
1010
}) => {
1111
return (
12-
<div className='demoCard'>
13-
<Image
14-
src='https://i.giphy.com/media/v1.Y2lkPTc5MGI3NjExaW9tcWttZ3R0YTVpNWxwcGJ4M2YyZ2ExcmxlazN5N3JyenF0ajl4dCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/FqdGGgugkC4Xm/giphy.gif'
15-
alt=''
16-
width={700}
17-
height={475}
18-
sizes='100vw'
19-
style={{
20-
width: '100%',
21-
height: 'auto',
22-
}}
23-
/>
24-
<div className='demoCardText'>
25-
<div className='demoCardHeader'>{header}</div>
26-
<div className='demoCardInfo'>{blurb}</div>
12+
<div className="demoCard">
13+
<div style={{ padding: '56.25% 0 0 0', position: 'relative' }}>
14+
<iframe
15+
src={video}
16+
style={{
17+
position: 'absolute',
18+
top: 0,
19+
left: 0,
20+
width: '100%',
21+
height: '100%',
22+
}}
23+
allow="autoplay; fullscreen; picture-in-picture"
24+
allowFullScreen
25+
title="Vimeo Video Player"
26+
/>
27+
</div>
28+
<div className="demoCardText">
29+
<div className="demoCardHeader">{header}</div>
30+
<div className="demoCardInfo">{blurb}</div>
2731
</div>
2832
</div>
2933
);

mlflow-site/src/app/globals.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -175,10 +175,14 @@ body {
175175

176176
.homeButtonDownload {
177177
background-color: rgb(66, 107, 31);
178+
padding-top: 0.6rem;
179+
padding-bottom: 0.6rem;
178180
}
179181

180182
.homeButtonRead {
181183
background-color: rgb(204, 204, 204);
184+
padding-top: 0.6rem;
185+
padding-bottom: 0.6rem;
182186
}
183187

184188
.button {

mlflow/docs/tech-design-doc.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
## 1. Overview
55

66

7-
The MLflow-JS library aims to provide a comprehensive and intuitive interface for interacting with MLflow services in a JavaScript/Typescript environment. It simplifies the integration with MLflow REST APIs by offering high-level methods for tracking, model management, and advanced workflows.
7+
The MLflow-JS library aims to provide a comprehensive and intuitive interface for interacting with MLflow services in a JavaScript/TypeScript environment. It simplifies the integration with MLflow REST APIs by offering high-level methods for tracking, model management, and advanced workflows.
88

99

1010
## 2. Architecture

mlflow/src/workflows/ExperimentManager.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ import ExperimentClient from '@tracking/ExperimentClient';
22
import RunClient from '@tracking/RunClient';
33
import { ApiError } from '@utils/apiError';
44

5+
interface keyable {
6+
[key: string]: any
7+
}
8+
59
class ExperimentManager {
610
private experimentClient: ExperimentClient;
711
private runClient: RunClient;
@@ -46,7 +50,7 @@ class ExperimentManager {
4650
): Promise<object> {
4751
try {
4852
// create run
49-
const run = await this.runClient.createRun(experiment_id, run_name);
53+
const run:keyable = await this.runClient.createRun(experiment_id, run_name);
5054
const run_id = run.info.run_id;
5155

5256
// log metric, params, and tags via logBatch
@@ -114,7 +118,7 @@ class ExperimentManager {
114118
);
115119

116120
// create run
117-
const run = await this.runClient.createRun(experiment_id, run_name);
121+
const run:keyable = await this.runClient.createRun(experiment_id, run_name);
118122
const run_id = run.info.run_id;
119123

120124
// log metric, params, and tags via logBatch
@@ -203,7 +207,7 @@ class ExperimentManager {
203207
if (order === 1 || order === 'DESC') orderString = 'DESC';
204208
else if (order === -1 || order === 'ASC') orderString = 'ASC';
205209
const arg = `metrics.${primaryMetric} ${orderString}`;
206-
const data = await this.runClient.searchRuns(
210+
const data:keyable = await this.runClient.searchRuns(
207211
[experiment_id],
208212
'',
209213
undefined,

mlflow/src/workflows/ModelManager.ts

Lines changed: 28 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ import ModelRegistryClient from '@model-registry/ModelRegistryClient';
33
import ModelVersionClient from '@model-registry/ModelVersionClient';
44
import { ApiError } from '@utils/apiError';
55

6+
interface keyable {
7+
[key: string]: any;
8+
}
9+
610
class ModelManager {
711
private modelRegistry: ModelRegistryClient;
812
private modelVersion: ModelVersionClient;
@@ -103,11 +107,13 @@ class ModelManager {
103107
value: string
104108
): Promise<object> {
105109
try {
106-
const data = await this.modelRegistry.getLatestModelVersions(name);
110+
const data: keyable = await this.modelRegistry.getLatestModelVersions(
111+
name
112+
);
107113
if (!data) {
108114
throw new Error('Model has no version to update.');
109115
} else {
110-
const [{ version }] = data;
116+
const version = data[0].version;
111117
await this.modelRegistry.setRegisteredModelAlias(name, alias, version);
112118
await this.modelVersion.setModelVersionTag(name, version, key, value);
113119
const response = await this.modelVersion.updateModelVersion(
@@ -143,11 +149,13 @@ class ModelManager {
143149
value: string
144150
): Promise<void> {
145151
try {
146-
const data = await this.modelRegistry.getLatestModelVersions(name);
152+
const data: keyable = await this.modelRegistry.getLatestModelVersions(
153+
name
154+
);
147155
if (!data) {
148156
throw new Error('Model has no version to set tag for.');
149157
} else {
150-
const [{ version }] = data;
158+
const version = data[0].version;
151159
this.modelVersion.setModelVersionTag(name, version, key, value);
152160
return;
153161
}
@@ -172,11 +180,13 @@ class ModelManager {
172180
*/
173181
async setLatestModelVersionAlias(name: string, alias: string): Promise<void> {
174182
try {
175-
const data = await this.modelRegistry.getLatestModelVersions(name);
183+
const data: keyable = await this.modelRegistry.getLatestModelVersions(
184+
name
185+
);
176186
if (!data) {
177187
throw new Error('Model has no version to set alias for.');
178188
} else {
179-
const [{ version }] = data;
189+
const version = data[0].version;
180190
this.modelRegistry.setRegisteredModelAlias(name, alias, version);
181191
return;
182192
}
@@ -204,11 +214,13 @@ class ModelManager {
204214
description: string
205215
): Promise<object> {
206216
try {
207-
const data = await this.modelRegistry.getLatestModelVersions(name);
217+
const data: keyable = await this.modelRegistry.getLatestModelVersions(
218+
name
219+
);
208220
if (!data) {
209221
throw new Error('Model has no version to set description for.');
210222
} else {
211-
const [{ version }] = data;
223+
const version = data[0].version;
212224
const response = await this.modelVersion.updateModelVersion(
213225
name,
214226
version,
@@ -277,11 +289,13 @@ class ModelManager {
277289
*/
278290
async deleteLatestModelVersion(name: string): Promise<void> {
279291
try {
280-
const data = await this.modelRegistry.getLatestModelVersions(name);
292+
const data: keyable = await this.modelRegistry.getLatestModelVersions(
293+
name
294+
);
281295
if (!data) {
282296
throw new Error('Model has no version to delete.');
283297
} else {
284-
const [{ version }] = data;
298+
const version = data[0].version;
285299
this.modelVersion.deleteModelVersion(name, version);
286300
return;
287301
}
@@ -305,7 +319,7 @@ class ModelManager {
305319
* @param {string[]} experiment_ids - An array containing an experiment id. (Required)
306320
* @param {string} filterMetric - The name of the metric that we're filtering by. (Required)
307321
* @param {string} metricMinOrMax - A string specifying if we want the minimum or maximum
308-
* value of the specified metric. Can be either 'min' or
322+
* value of the specified metric. Can be either 'min' or
309323
* 'max'(Required)
310324
* @param {string} modelName - The name of the new model that will be created. (Required)
311325
* @returns {Promise<void>}
@@ -318,10 +332,11 @@ class ModelManager {
318332
modelName: string
319333
): Promise<void> {
320334
try {
321-
const { runs } = await this.runClient.searchRuns(
335+
const data: keyable = await this.runClient.searchRuns(
322336
experiment_ids,
323337
`metrics.${filterMetric} != -99999`
324338
);
339+
const runs = data.runs;
325340
let num;
326341
if (metricMinOrMax === 'min') {
327342
num = Infinity;
@@ -354,7 +369,7 @@ class ModelManager {
354369
bestRun.info.artifact_uri,
355370
bestRun.info.run_id
356371
);
357-
return
372+
return;
358373
} catch (error) {
359374
if (error instanceof ApiError) {
360375
console.error(`API Error (${error.statusCode}): ${error.message}`);

mlflow/src/workflows/RunManager.ts

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ import RunClient from '@tracking/RunClient';
22
import ModelVersionClient from '@model-registry/ModelVersionClient';
33
import { ApiError } from '@utils/apiError';
44

5+
interface keyable {
6+
[key: string]: any
7+
}
8+
59
interface Run {
610
info: {
711
run_id: string;
@@ -64,7 +68,7 @@ class RunManager {
6468
try {
6569
do {
6670
// get all runs
67-
const searchResult = await this.runClient.searchRuns(
71+
const searchResult:keyable = await this.runClient.searchRuns(
6872
experimentIds,
6973
'',
7074
undefined, // run_view_type
@@ -74,7 +78,7 @@ class RunManager {
7478
);
7579

7680
// get runs that match the keep crteria
77-
const keepRunsResult = await this.runClient.searchRuns(
81+
const keepRunsResult:keyable = await this.runClient.searchRuns(
7882
experimentIds,
7983
query_string,
8084
undefined, // run_view_type
@@ -143,10 +147,10 @@ class RunManager {
143147
): Promise<object> {
144148
try {
145149
// get original run
146-
const originalRun = await this.runClient.getRun(runId);
150+
const originalRun:keyable = await this.runClient.getRun(runId);
147151

148152
// create a new run in the target experiment
149-
const newRun = await this.runClient.createRun(
153+
const newRun:keyable = await this.runClient.createRun(
150154
targetExperimentId,
151155
undefined,
152156
originalRun.info.start_time

mlflow/tests/ModelManagerTest.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import ModelManager from '../src/workflows/ModelManager';
22
import RunClient from '../src/tracking/RunClient';
33

4+
interface keyable {
5+
[key: string]: any
6+
}
7+
48
async function testModelManager() {
59
const modelManager = new ModelManager('http://localhost:5001');
610
const runClient = new RunClient('http://localhost:5001');
@@ -20,7 +24,7 @@ async function testModelManager() {
2024
const runMetricValueLow = 1;
2125

2226
console.log('\n5. Creating a run...');
23-
const run = await runClient.createRun('0'); // Using '0' as the default experiment ID
27+
const run:keyable = await runClient.createRun('0'); // Using '0' as the default experiment ID
2428
console.log('Created run:', run);
2529

2630
console.log('1. Creating a new registered model with a version...');
@@ -96,7 +100,7 @@ async function testModelManager() {
96100
console.log(`Deleted Latest version of ${modelName}`);
97101

98102
console.log('9. Creating model from run with best metric...');
99-
const run2 = await runClient.createRun('0'); // Using '0' as the default experiment ID
103+
const run2:keyable = await runClient.createRun('0'); // Using '0' as the default experiment ID
100104
console.log('Created run:', run2);
101105

102106
await runClient.logMetric(
@@ -111,7 +115,7 @@ async function testModelManager() {
111115
runMetricValueLow
112116
);
113117

114-
const runData = await runClient.getRun(
118+
const runData:keyable = await runClient.getRun(
115119
run.info.run_id
116120
);
117121

0 commit comments

Comments
 (0)