diff --git a/tslib/storybook/package-lock.json b/tslib/storybook/package-lock.json index ae10b27d..a04bfc69 100644 --- a/tslib/storybook/package-lock.json +++ b/tslib/storybook/package-lock.json @@ -23,6 +23,7 @@ }, "devDependencies": { "@biomejs/biome": "1.5.3", + "@optuna/types": "../types/", "@storybook/addon-essentials": "^7.6.15", "@storybook/addon-interactions": "^7.6.15", "@storybook/addon-links": "^7.6.15", @@ -40,6 +41,11 @@ "vite": "^5.1.0" } }, + "../types": { + "version": "0.0.1", + "dev": true, + "license": "MIT" + }, "node_modules/@adobe/css-tools": { "version": "4.3.3", "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.3.3.tgz", @@ -3393,6 +3399,10 @@ "node": ">= 8" } }, + "node_modules/@optuna/types": { + "resolved": "../types", + "link": true + }, "node_modules/@pkgjs/parseargs": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz", diff --git a/tslib/storybook/package.json b/tslib/storybook/package.json index 7c846ec3..c7159f9e 100644 --- a/tslib/storybook/package.json +++ b/tslib/storybook/package.json @@ -42,6 +42,7 @@ }, "devDependencies": { "@biomejs/biome": "1.5.3", + "@optuna/types": "../types/", "@storybook/addon-essentials": "^7.6.15", "@storybook/addon-interactions": "^7.6.15", "@storybook/addon-links": "^7.6.15", diff --git a/tslib/storybook/src/components/PlotHistory.tsx b/tslib/storybook/src/components/PlotHistory.tsx index 11e678b7..c7030cff 100644 --- a/tslib/storybook/src/components/PlotHistory.tsx +++ b/tslib/storybook/src/components/PlotHistory.tsx @@ -13,6 +13,7 @@ import { Typography, useTheme, } from "@mui/material"; +import * as Optuna from "@optuna/types"; import * as plotly from "plotly.js-dist-min"; import { ChangeEvent, FC, useEffect, useState } from "react"; import { plotlyDarkTemplate } from "./PlotlyDarkMode"; @@ -20,7 +21,7 @@ import { plotlyDarkTemplate } from "./PlotlyDarkMode"; const plotDomId = "plot-history"; export const PlotHistory: FC<{ - study: Study | null; + study: Optuna.Study | null; }> = ({ study = null }) => { const theme = useTheme(); const [xAxis, setXAxis] = useState("number"); @@ -171,7 +172,7 @@ export const PlotHistory: FC<{ ); }; -const filterFunc = (trial: Trial, objectiveId: number): boolean => { +const filterFunc = (trial: Optuna.Trial, objectiveId: number): boolean => { if (trial.state !== "Complete" && trial.state !== "Pruned") { return false; } @@ -186,7 +187,7 @@ const filterFunc = (trial: Trial, objectiveId: number): boolean => { }; const plotHistory = ( - study: Study, + study: Optuna.Study, objectiveId: number, xAxis: string, logScale: boolean, @@ -229,7 +230,7 @@ const plotHistory = ( return; } - const getAxisX = (trial: Trial): number | Date => { + const getAxisX = (trial: Optuna.Trial): number | Date => { return xAxis === "number" ? trial.number : xAxis === "datetime_start" @@ -237,7 +238,10 @@ const plotHistory = ( : trial.datetime_complete ?? new Date(); }; - const getValue = (trial: Trial, objectiveId: number): number | null => { + const getValue = ( + trial: Optuna.Trial, + objectiveId: number, + ): number | null => { if ( objectiveId === null || trial.values === undefined || @@ -295,7 +299,7 @@ const plotHistory = ( { x: filteredTrials.map(getAxisX), y: filteredTrials.map( - (t: Trial): number => getValue(t, objectiveId) as number, + (t: Optuna.Trial): number => getValue(t, objectiveId) as number, ), name: "Objective Value", mode: "markers", diff --git a/tslib/storybook/src/components/TrialTable.tsx b/tslib/storybook/src/components/TrialTable.tsx index 02efed2c..c9cca652 100644 --- a/tslib/storybook/src/components/TrialTable.tsx +++ b/tslib/storybook/src/components/TrialTable.tsx @@ -1,14 +1,15 @@ import { FC } from "react"; +import * as Optuna from "@optuna/types"; import { DataGrid, DataGridColumn } from "./DataGrid"; export const TrialTable: FC<{ - study: Study; + study: Optuna.Study; initialRowsPerPage?: number; }> = ({ study, initialRowsPerPage }) => { - const trials: Trial[] = study.trials; + const trials: Optuna.Trial[] = study.trials; - const columns: DataGridColumn[] = [ + const columns: DataGridColumn[] = [ { field: "number", label: "Number", sortable: true, padding: "none" }, { field: "state", @@ -48,8 +49,8 @@ export const TrialTable: FC<{ }, }); } else { - const objectiveColumns: DataGridColumn[] = study.directions.map( - (_s, objectiveId) => ({ + const objectiveColumns: DataGridColumn[] = + study.directions.map((_s, objectiveId) => ({ field: "values", label: `Objective ${objectiveId}`, sortable: true, @@ -74,8 +75,7 @@ export const TrialTable: FC<{ } return trials[i].values?.[objectiveId]; }, - }), - ); + })); columns.push(...objectiveColumns); } @@ -142,7 +142,7 @@ export const TrialTable: FC<{ }); return ( - + columns={columns} rows={trials} keyField={"trial_id"} diff --git a/tslib/storybook/src/types/index.d.ts b/tslib/storybook/src/types/index.d.ts deleted file mode 100644 index aeb4c6fc..00000000 --- a/tslib/storybook/src/types/index.d.ts +++ /dev/null @@ -1,99 +0,0 @@ -declare const IS_VSCODE: boolean; - -type TrialState = "Running" | "Complete" | "Pruned" | "Fail" | "Waiting"; -type TrialStateFinished = "Complete" | "Fail" | "Pruned"; -type StudyDirection = "maximize" | "minimize" | "not_set"; - -type OptunaStorage = { - getStudies: () => Promise; - getStudy: (idx: number) => Promise; -}; - -type FloatDistribution = { - type: "FloatDistribution"; - low: number; - high: number; - step: number | null; - log: boolean; -}; - -type IntDistribution = { - type: "IntDistribution"; - low: number; - high: number; - step: number | null; - log: boolean; -}; - -type CategoricalChoiceType = null | boolean | number | string; -type CategoricalDistribution = { - type: "CategoricalDistribution"; - choices: CategoricalChoiceType[]; -}; - -type TrialIntermediateValue = { - step: number; - value: number; -}; - -type Distribution = - | FloatDistribution - | IntDistribution - | CategoricalDistribution; - -type Attribute = { - key: string; - value: string; -}; - -type AttributeSpec = { - key: string; - sortable: boolean; -}; - -type StudySummary = { - study_id: number; - study_name: string; - directions: StudyDirection[]; -}; - -type Study = { - study_id: number; - study_name: string; - directions: StudyDirection[]; - union_search_space: SearchSpaceItem[]; - intersection_search_space: SearchSpaceItem[]; - union_user_attrs: AttributeSpec[]; - datetime_start?: Date; - trials: Trial[]; -}; - -type Trial = { - trial_id: number; - number: number; - study_id: number; - state: TrialState; - values?: number[]; - params: TrialParam[]; - intermediate_values: TrialIntermediateValue[]; - user_attrs: Attribute[]; - datetime_start?: Date; - datetime_complete?: Date; -}; - -type TrialParam = { - name: string; - param_internal_value: number; - param_external_value: CategoricalChoiceType; - param_external_type: string; - distribution: Distribution; -}; - -type SearchSpaceItem = { - name: string; -}; - -type ParamImportance = { - name: string; - importance: number; -};