Commit Graph

255 Commits

Author SHA1 Message Date
James Liu c6acac9bf6
fix(frontend): Add disableParsingRawHTML option for markdown-to-jsx component (#10315) 2023-12-19 20:02:38 +00:00
David van der Spek c32cdc70d3
chore(frontend): update all references to python 3.9 (#10020)
Signed-off-by: David van der Spek <vanderspek.david@gmail.com>
2023-10-20 05:19:03 +00:00
Joe Li ba322abb01
chore(frontend): Refactor resource selector for sharable usage in both v1 and v2 (#9693)
* Change the logic of ResourceSelector to make it is able to be used in
both v1 and v2.
Remove ResourceSelectorV2.

* Remove snapshot.
2023-07-08 00:17:53 +00:00
axel7083 536d93a1bf
fix(frontend): Splitting logsDetails into lines based on CR and LF. Fixes #9593 (#9594) 2023-06-22 23:48:08 +00:00
Joe Li 5c15ee51b3
feature(frontend): Support pipeline root in clone run (#9582)
* fill the pipeline root field if it is existing clonedRuntimConfig.

* Add unit test.
Update the logic of setting pipelineRoot.

* Change the example pipeline root to another dummy root ('gs://dummy_pipeline_root')

* Change the clone root in NewRunParameterV2.test
2023-06-07 17:55:57 +00:00
Joe Li 23739e9be3
fix(frontend): Pipeline Root is not used when provided during New Run creation (#9561) 2023-06-02 22:59:20 +00:00
Joe Li 10e639ed4f
fix(frontend): Unexpected page crash when clicking artifact node. (#9519)
* Catch the error thrown by parseStoragePath().
Directly render unsupported URI rather than showing banner error.

* Change back to render banner but not error mode. Use info mode instead.
2023-05-26 22:00:59 +00:00
Joe Li ef9781b35a
fix(frontend): Make pipeline definition in YAML tab more readable (#9511)
* Make the text in YAML tab preview in v1 pipeline details more readable.

* Add documentation.

* Fix the logic in PipelineSpecTabContent rather than convert the v1
template to yaml in the parent component <PipelineDetailsV1>

* Remove the v2 template check in PipelineSpecTabContent.

* Remove unused import
2023-05-26 17:26:21 +00:00
Joe Li 2623574cd8
feature(frontent): Support both "Flat" and "Grouped" view for Artifact list (#9470)
render.
Change the router for artifact list to artifact list router component.
Add group artifact list logic back to artifact list implementation.
2023-05-23 19:00:37 +00:00
Joe Li f915195446
feature(frontent): Support both "Flat" and "Group" view for Execution list (#9440)
* Create ExecutionListRouter.tsx to determine which type of view to
render.
Change the router for execution list to execution list router component.
Add group execution list logic back to execution list implementation.

* Change name to ExecutionListSwitcher.
Add unit tests for execution list switcher.

* Change props name to isGroupView

* Rename tabs to "Default" and "Grouped".
Fix typos.
Add isGroupView in ExecutionList props (ExecutionList.test.tsx).
2023-05-17 20:59:06 +00:00
Joe Li 66ff81e5f2
fix(frontend) Format container information in pipeline details side panel (#9387)
* Use PipelineDeploymentConfig and PipelineDeploymentConfig_ExecutorSpec
in WorkflowUtils.
Format the "command" in pipeline details side panel.

* Fix unit tests

* Remove unnecessary export

* Fix logic in WorkflowUtils to avoid unexpected errors.
Add comment to explain why 2 'sh' are found.
Add pre-wrap style for arg as well.

* Rename ts_pipelinespec to pipelineSpec.

* Fix comment in unit test.
Remove unnecessary checking item in if condition.
2023-05-12 19:36:39 +00:00
Joe Li 62e58953a3
fix(frontend): Filter of pipeline selector in create new run page is broken. (#9401)
is new run v1.
2023-05-12 18:31:45 +00:00
Joe Li 501589fea3
fix(frontend): Change the empty message of archived experiment list. (#9381) 2023-05-12 01:32:45 +00:00
Joe Li e2129da0a5
fix(frontend): Rename button in pipeline/run details side panel (#9383) 2023-05-11 23:57:37 +00:00
Joe Li abe356383b
feature(frontend): Support volume mounts in KFP v2 (#9318)
* Add volumes tab in side panel.

* Add volume information in details tab.

* Abstract the logic of converting template string to PipelineSpec and use
the helper in getNodeVolumeMounts().

* Add tests for volume mount feature.
Rename const in WorkflowUtils.test.ts

* Change to absolute path
Remove unused spy

* Rename constant in all captical case

* Add unit tests to validate the functionality of getPipelineDefFromYaml()
and getPlatformDefFromYaml().

* Rename templateString in RuntimeNodeDetailsV2 to pipelineJobString
Extract 'kubernetes' as a constant.
Put getComponentSpec in a new file called NodeUtils

* Rename template string to pipelineJobString

* Check if platformSpec is {} before return it.

* Change getPipelineDefFromYaml() and getPlatformDefFromYaml() to non-export.
2023-05-08 05:26:54 +00:00
Joe Li 1f8fdbcaef
fix(frontend): Buttons dislocated in narrow toolbar (#9344) 2023-05-06 01:52:52 +00:00
Joe Li f68e7802e8
fix(frontend): Logs details is not changed when selected other execution node. (#9334) 2023-05-05 18:55:23 +00:00
Joe Li 430bd5406f
feature(frontend) Support Logs tab in KFP v2 (#9265)
* Add logs tab in run details node.

* Test if getLogs() is successful.

* Passing runId into runtime details node to get the logs info.

* Change the return value of helper function getLogsDetails() from string
to map which contains logsDetails, banner message, and banner additional
info.
Embed logsInfo into LOGS tab.

* Render logs details in 'Logs' tab

* Handle cached case.

* Use global variable

* Add unit test for RuntimeNodeDetailsV2 (Logs)

* Change cached-execution-id in the unit test to avoid confusion.

* Fix the unit test by using test-id
Extract logsInfoKey as global constant.

* Remove repeated TODO

* Move comment

* Fix unit tests.
Change the definition of global constant (not use enum).
2023-05-01 18:28:43 +00:00
Joe Li 353750465e
fix(frontend): Replace obsoleted hyperlinks in new pipeline page. (#9181) 2023-04-20 00:33:46 +00:00
Joe Li 0634943432
chore(frontend): Integrate experiment and run (cross-functionality call) with v2 API (#9124)
* Integrate getExperiment() in run list with v2 API.

* Integrate getExperiment() in recurring run list with v2 API.

* Integrate getExperiment() in pipeline details with v2 API.

* Integrate getExperiment() in run details(v2) with v2 API.

* Integrate getExperiment() in recurring run details(v2) with v2 API.

* Integrate getExperiment(), listExperiments() in NewRunSwitcher and
NewRunv2 with v2 API.

* Fix incorrect listExperiment() field.
Change ApiFilter to V2beta1Filter in component/ExperimentList

* Integrate listRuns() in experiment list with V2 API.

* Fix incorrect field name in PipelineDetailsV2 tests.

* Remove unused import. Change relative path to absolute path.
2023-04-09 17:34:53 +00:00
Joe Li ab2499dd27
chore(frontend): Integrate pipeline / pipeline version functions with KFP v2 API (#9123)
* Separate pipelineServiceApiV1 and pipelineServiceApiV2.
Add uploadPipelineVersionV2 helper.

* Ingegrate new pipeline functionality with v2 API.
Create a new pipeline dialog for v2 pipeline because the error is
not string type.

* Integrate getPipelineVersion() in run/recurring run details router
with v2 API.

* Integrate listPipelines() / listPipelineVersions() in PipelineList and
PipelineVersionList with v2 API.

* Update private and shared pipelines unit tests.

* Separate v1 and v2 logics (based on API return value) in pipeline
details (router).
Noted: add additional listPipelines() to get latest version because v2
don't default version field.

* Change pipeline props in PipelineDetailsV2 and PipelineVersionCard
Remove default version in PipelineVersionCard test.
Append version id to URL for unspecified versionId scenario.

* Create new ResourceSelectorV2 and make corresponding changes (back to
v2beta1Pipeline) in PipelineDialogV2 and NewPipelineVersion

* Create resource converter to make various API returned objects fit in
base resource.
Change the behavior of "selectionChanged" to achive more general usage.

* Integrate getPipeline() / getPipelineVersion() in "create / clone run"
with v2 API.

* Integrate get started page with v2 pipeline API.

* Integrate getPipelineVersion() in run list with v2 API.

* Integrate delete pipeline / pipeline version with v2 API.

* Remove unused imports. Change relative path to absolute path.

* Add unit test for PipelineDialogV2 and ResourceSelectorV2.

* Fix incorrect Version Description in PipelineVersionCard and rename the
constant in unit test.
Add size limitation in the listPipelineVersions() called by
getSelectedVersion.
Add missing props in NewRunV2 test.
Fix FE-integration test (trial)

* Simplify the logic of deletePipelineVersion. Remove
dialoghandlerMultiId.
2023-04-09 00:04:52 +00:00
Joe Li 1bc05b1654
chore(frontend): Integrate recurring run functions with KFP v2 API (#9001)
* Add recurringRunServiceApi() in Apis.ts

* Add helper function for v2 run in StatusUtils and Utils.
Separate v1 anv v2 status by creating a new file StatusV2.tsx

* Integrate run details page with v2 API.

* Integrate run list page with v2 API.
Update unit tests.

* Integrate create / clone run with v2 API.

* Integrate retry / terminate run with v2 API.
Note: retrying or terminating v1 run is also using v2 API.

* Integrate compare run with V2 API.

* Add logics to get pipeline_spec via pipeline_version_id in Run details
router.
Make pipeline_spec and version_id exclusive in createRun request body.
Remove unused tests (related to run metric)

* Change the previous changes about filter in component/experimentList.
This change should be in the other PR.

* Change filter in listRuns API request.
Update unit tests for run list and experiment list
Update snapshots.

* Remove unused import and format.

* Remove retrieving recurring run details in RunDetailsRouter,
because run response already contains pipeline_spec.

* Change helper function related to recurring run in Utils and
TriggerUtils.
Use v2 recurring run status instead in enabledDisplayString().

* Integrate recurring run details with v2 API.

* Integrate recurring run list page with v2 API.

* Integrate recurring run manager with v2 API.

* Integrate enable/disable buttons with v2 API.

* Integrate create / clone recurring run with v2 API.

* Integrate recurring run manager in experiment details page with v2 API.
Format.

* Integrate pipeline details from cloned object with v2 API.

* Fix status icon on recurring run list.

* Format.

* Fix bugs after rebase.

* Remove unused import and fix some rebase bugs.

* Fix yaml exception error and add getPipelineVersion logic for clone run.

* Revert "Integrate pipeline details from cloned object with v2 API."

This reverts commit a4f2391302.

* Add TODO in pipeline details and format.

* Change trigger in recurring run to v2 trigger.
Change relative path to absolute path.

* Format

* Revert "Integrate recurring run details with v2 API."

This reverts commit 0166e883d4.

* Separate enableDisplayString in Utils for v1 and v2.

* Create recurring run details router to separate v1 and v2 logic.

* Integrate pipeline details page with v2 API.

* Remove unnecessary retrieving v1 details in run details router.

* Remove unused import.

* Remove default '' in workflow parameter.

* Change output param in helloworld spec to see if it fix failed FE
integration test.

* Changes:

Separate version dependency  from trigger.
Reverse the condition logic in getDurationFromRunV2().
Simplify the expression by change x ? x : y to x ?? y.
Fix unexpected v1 getJob() call bug.
Wrap retrieve IR in v2 run/recurring run as a helper in PipelineDetails.
Change to use RecurringRunDetailsRouter as a testing component in
RecurringRunDetailsV2.test.
Remove inapplicable unit tests.

* Fix unit test and remove unused import.

* Add notes to clarify complicated logic in pipeline details.
Change FE integration test back to see if it will fail.

* Change FE integratio test back to see if it will fail.

* Change variable to see if the FE integration test will fail.

* Change the outputParameterValue in FE integration as default value.

* Change outputParameter as inputParameter to avoid misleading.

* Revert the tiny change in rundetails.

* Try to print out the parameter value before and after it's changed to
input value.

* Remove console.log()

* Create a helper to check the paramValue.

* Remove unnecessary v1 getRun() in NewRunSwitcher.
Change the query key to original one (resolve failed FE integration
test)
Revert unnecessary changes in helloworld.spec.js
2023-03-31 23:56:57 +00:00
Joe Li ca2004ca6c
chore(frontend): Integrate run functions with KFP v2 API (#8963)
* Separate runServiceApiV1 and runServiceApiV2.

* Add helper function for v2 run in StatusUtils and Utils.
Separate v1 anv v2 status by creating a new file StatusV2.tsx

* Integrate run details page with v2 API.

* Integrate run list page with v2 API.
Update unit tests.

* Integrate archive run with v2 API.
Format.

* Integrate create / clone run with v2 API.

* Integrate retry / terminate run with v2 API.
Note: retrying or terminating v1 run is also using v2 API.

* Integrate compare run with V2 API.

* Add unit tests and snapshots for StatusV2.

* Add logics to get pipeline_spec via pipeline_version_id in Run details
router.
Make pipeline_spec and version_id exclusive in createRun request body.
Remove unused tests (related to run metric)

* Change the previous changes about filter in component/experimentList.
This change should be in the other PR.

* Change filter in listRuns API request.
Update unit tests for run list and experiment list
Update snapshots.

* Remove unused import and format.

* Change relative path back to absolute path.

* Remove duplicated helper function in utils.
Remove unused helper function in status utils.
Added warn / error to handle unexpected state.

* Fix yaml exception bug in clone run.
Change relative path to absolute path.
2023-03-15 22:11:27 +00:00
Joe Li 16ac46bc36
chore(frontend): Use v2 filter in listExperiment() v2 API (#8951)
* Change filter in listExperiment() as v2 filter.

* Remove unused import.

* Change filter in custom table to support reload with v2 filter.

* Revert "Change filter in custom table to support reload with v2 filter."

This reverts commit dc391370d3.

* Add the changes in CustomTable back to the PR.
2023-03-09 22:32:19 +00:00
Joe Li 9926f31a3a
chore(frontend): Integrate the experiment-only functions with KFP v2 API (#8864)
* Integrate the create experiment for v2 API (NewExperiment.tsx)

* Integrate list experiment with v2 API (ExperimentList.tsx)

* Integrate experiment details with v2 API (ExperimentDetails.tsx)

* Integrate archive / unarchive experiment with v2 API.

* Add TODO and format.

* Change unit tests.
2023-02-24 07:05:24 +00:00
Tasos Alexiou 69969475bc
feat(frontend): Support namespaced pipelines from the UI. Closes #5084 (#8831)
* feat(frontend): Introduce BuildInfo context

Introduce the BuildInfo context and BuildInfoProvider class which is
going pass the build information from the "/healthz" endpoint across
the app.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Use BuildInfo context in SideNav

Get the BuildInfo information from React's context instead of making
the request to "/healthz" endpoint inside the SideNav component.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Add namespace optional parameter

Add the namespace optional parameter when uploading a new pipeline.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Add tooltips in MD2Tabs component

Extend MD2Tabs component and add support for optional tooltips in
tab's headers.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Make title property in ResourceSelector optional

Make title property in ResourceSelector optional and hide the
toolbar if it is not defined.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Use namespace when displaying pipelines

Add namespace as an option property in the PipelineList component.
When the namespace is available the PipelineList component will
display the namespaced pipelines.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* chore(frontend): Remove UploadPipelineDialog from PipelineList

Remove the  UploadPipelineDialog from PipelineList component since
it is no longer used.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Introduce tabbed pipelines list page

Introduce the NamespacedAndSharedPipelines component which replaces
the PipelineList component as the main component for the pipelines
list page. This component displays both namespace and shared
pipelines using tabs. Also fix the menu highlighting for the new
page.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Introduce PrivateSharedSelector component

Introduce the PrivateSharedSelector component that is going to help
if a new pipeline will be namespaced or shared.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Introduce pipelines dialog

Introduce the PipelinesDialog component which is going to be used to
display both namespaced and shared pipelines using tabs.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Add support for namespaced pipeline creation

Update the NewPipelineVersion component and add support to create
namespaced pipelines.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Update upload pipeline dialog

Use the PrivateSharedSelector in the upload pipeline dialog and
improve the wording in the helper texts. A user can now select if
the new pipeline is going to be in the current namespace or shared.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Add support for namespace pipelines in runs

Update the NewRun component and add support to create namespaced
pipelines when creating a new run. Use the pipelines dialog when
choosing namespaced or shared pipelines. Finally, disable the
pipeline version chooser when there is no pipeline selected.

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

* feat(frontend): Add support for namespace pipelines in runs V2

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>

---------

Signed-off-by: Tasos Alexiou <tasos@arrikto.com>
2023-02-20 08:43:38 +00:00
Joe Li e6e8600c7c
fix(frontend): Change the prompt and error message of parameter field into more readable text (#8824)
* Add protoMap to connect proto type name and usual type name.

* Also changed the type on the prompt of text field.

* Change float / double to double
Fix the unit tests

* Change map / dict to dict for better match to python class.
Update unit tests.
2023-02-10 22:22:22 +00:00
Joe Li 508b6a133a
fix(frontend): Remove the "finished at" information for artifact node. (#8810)
* Remove the "finished at" information for artifact node.

* Remove unused import.

* Revert the change (remove finishedAt) and fix the incorrect if
condition.

* Remove Finished at -

* Remove unused import.
2023-02-10 01:29:01 +00:00
Joe Li 874e3d3e91
fix(frontend): Show pipeline details for an existing recurring run without pipeline / pipeline version. (#8681)
* Made tiny change to test branch status.

* Changes:
1. Add new query parameter fromRecurringRun
2. Support fromRecurringRun condition to retrieve pipeline_manifest
3. Wrap buildBreadCumb as a function for run and recurring run.
4. Modify the generateProps() in test file to fit recurring run too.

* Change:

1. Define recurringRunId in Router to avoid mixing logic between one-off
   / recurring run.
2. Add type Origin in PipelineDetials to simplify the logic
3. Fix all mixing usages of recurring run (change links under RouteParams to recurring run id)
4. Update unit tests.

* Change:

Add recurringRunId in pipelineVersionInfo to build correct url for
recurringRun condition.

* Change variable name from errorTextAdjective to msgRunOrRecurringRun
Chnage the inline expression to if else block.

* concatenate `run` in variable msgRunOrRecurringRun.
2023-01-25 20:27:04 +00:00
Joe Li 80c0dc50db
feat(frontend): Support cloning recurringRun in KFP v2 (#8652)
* Added Recurring run control component in the NewRunV2.

* Added recurring run details in apiRun.

* Added recurringRun creation logic.

* Remove unused comment.

* temporarily add small tag v2 followed by "start a new run" for differenciate the diff between v1 and v2

* Add log to check the information in the run / job details.

* Get IR from apiJob if the run is a run of recurring run.

* Add comments.

* Remove console.log()

* Add isClone back.

* Format

* Remove setIsClone

* Add unit tests.

* Remove unused comment.

* 1. Remove unused comment
2. Set default value (as 10) for max concurrent runs
3. Add pre-check for max concurrent runs field
4. Update unit tests

* 1. Change job to recurring run in comments
2. Redirect to details page rather than list page if id is existing.

* Change naming from job to recurring run.

* Fix pre-check message.

* Fix pre-check message.

* Fix pre-check message.

* Update unit tests' snapshots.

* 1. Enable to retrieve recurring details for cloning.
2. Hide pipeline section for cloning recurring run
3. Disable the run type switcher for cloning.

* Enable cloning runtime config.

* Enable cloning run trigger.

* 1. Change the error message text.
2. Remove the prop isMaxConcurrentRunValid
3. Update the snapshot
4. Remove react.fragment for simplification

* 1. Added negative integer condition for max concurrent run pre-check.
2. Added unit tests.

* Remove unused import.

* Updated a unit test.

* 1. Use trigger prop in existing recurring run as the initial prop of
   useState().
2. Add unit tests for both UI-created and SDK-created recurring run.

* Remove comments.

* remove react.fragment

* Remove unused const in unit tests.

* Remove unused import item.

* Format.

* 1. Add pre-check for initial trigger and max concurrent runs.
2. Simplify the logic to determine the source of pipeline in
   NewRunSwitcher.
3. Wrap PipelineUrlLabel expression as a helper function.
4. Add new error if apiRun and apiRecurringRun exist at the same time.

* Define a helper type cloneOrigin to integrate apiRun and apiRecurring
run to simplify the logic in the NewRunV2.

* Improve the logic in getPipelineDetailsUrl function.

* Remove unnecessary useState.
Simplify the variable type in getCloneOrigin() and NewRunV2 interface.

* Add recurring run object assign logic back.
2023-01-14 07:35:20 +00:00
Joe Li a4a24885c5
feat(frontend): Support creating recurringRun in KFP v2. (#8568)
* Added Recurring run control component in the NewRunV2.

* Added recurring run details in apiRun.

* Added recurringRun creation logic.

* Remove unused comment.

* temporarily add small tag v2 followed by "start a new run" for differenciate the diff between v1 and v2

* Add log to check the information in the run / job details.

* Get IR from apiJob if the run is a run of recurring run.

* Add comments.

* Remove console.log()

* Add isClone back.

* Format

* Remove setIsClone

* Add unit tests.

* Remove unused comment.

* 1. Remove unused comment
2. Set default value (as 10) for max concurrent runs
3. Add pre-check for max concurrent runs field
4. Update unit tests

* 1. Change job to recurring run in comments
2. Redirect to details page rather than list page if id is existing.

* Change naming from job to recurring run.

* Fix pre-check message.

* Fix pre-check message.

* Fix pre-check message.

* Update unit tests' snapshots.

* 1. Change the error message text.
2. Remove the prop isMaxConcurrentRunValid
3. Update the snapshot
4. Remove react.fragment for simplification

* 1. Added negative integer condition for max concurrent run pre-check.
2. Added unit tests.

* Remove unused import.

* Updated a unit test.
2023-01-04 18:14:26 +00:00
James Liu c2fb286daf
fix(frontend): Surface output artifact of a SubDAG by reading subtask (#8354)
* fix(frontend): Surface output artifact of a SubDAG by reading subtask

* format

* fix test
2022-10-14 04:33:03 +00:00
James Liu 21cf6407eb
feat(frontend): Complete Sub-DAG implementation in KFPv2. (#8326)
* feat(frontend): Complete Sub-DAG implementation in KFPv2.

* remove comment
2022-10-11 07:46:25 +00:00
James Liu cdb5c6d948
test(frontend): Enforce no warning standard in frontend development. (#8305)
* test(frontend): Enforce no warning standard in frontend development.

* fix warning
2022-09-26 06:17:51 +00:00
Joe Li 440f4e15b1
feat(frontend): v2 Dynamic Sub-DAG (I) (#8278)
* Render elements in the sub-layers.

* Enable the side panel for sub-DAG type node.

* Add 'open workflow' button in sub-DAG side panel.

* Added icon for sub-DAG execution.
Implementation for displaying task details and node information for sub-DAG execution.
Implementation for getting MLMD info and update state for sub-DAG execution.

* Added comment (function for changing the state of node).

* Remove console.log()

* Format.
2022-09-20 17:14:32 +00:00
Joe Li 7d5985b4d4
feat(frontend): Creating run from various entry points (#8190)
* Enable choose pipeline and pipeline version for creating a run without pipeline ID and run ID.

* Wrap pipeline selector dialog as a function component (need to fix).

* Added a callback in NewRun component to handle the situation (choosing v1 pipeline first, and then change to v2 pipeline).

* Format.

* Set NewRunV1 as default page.
Added existingPipelineId into props of NewRunV1 to show pipeline and pipeline version details at the very first fetch.

* Wrap pipeline version selection as a function component
added exisingVersionId and callback in NewRun component to change the versionId in parent component(NewRunSwitcher)

* Replace url if users choose other pipeline version and pipeline version.

* Added additional check in if condition for callback in order to avoid breaking current v1 design.

* Fixed field in test components.

* Pre-fill experiment name for NewRunV2.

* Added comments and unit tests

* Added comments in NewRun to specify the timing of call back behavior.

* Update URL when experiment is changed.
Remove unused props

* Change behavior of updating url for changed experiment in NewRunV2

* Revert to 7966ae8.

* Remove updating URL for changed experiment.

* Added updating URL for changed experiment back.

* Hold for all changes related to URL.

* remove cache time setting.

* Add all changes related to URL update back
Modified the FE-integration-test to match current behavior
Enabling pre-filling run name of v1 new run page.
Fixing the errors in NewRunSwitcher.

* Modified the frontend-integration-test to match current v1 behavior (pre-filling the run name).

* Remove obsolete snapshot.

* Remove the old test (rely on snapshot) and add new test for selecting pipeline with params
Added tiny test for prefilling the run name when pipeline is selected.

* Format

* Replace useEffect() with callback for changed experiment.

* Replace useEffect() with callback fn() for changed pipeline and pipeline version.

* Remove unused parameters
Directly use existingPipeline and existingPipelineVersion without declaring another parameters
Added a test to validate the run name for selected pipeline
Wraped NewRun props into an interface.
Added "experiment" constant in useQuery for getting experiment details.

* remove compile warning.

* Rename the variable name in NewRunParameterV2 to get rid of the compile warning and avoid infinite loop.

* format

* Change unit test for NewRunV1 to match new behavior (callback).

* Remove unused parameters.

* Remove the unnecessary useEffect() for setApiExperiment
add runId condition for selected experiment.
2022-08-31 19:34:54 +00:00
Chris Elliott d02857f476
feat(frontend): Add refresh and run re-selection functionality (#8118)
* Reload the run artifacts on run selection.

* Remove unnecessary variable.

* Temp comment additions on how to update the roc curve colors on re-select.

* Add updated id color map starting logic.

* Merge the parameter table and add update on selection change.

* Allow refresh on the metrics visualizations tab by filtering the existing page.

* Update the refresh procedure for when an existing linked artifact page is selected.

* Get ROC Curve selection working by updating logic.

* Add initial loading state.

* Add refresh to fix page changing and force remount.

* Remove console.log statements.

* Add selected artifacts refresh.

* Reformat and clarify the update for the selected artifacts map.

* Solve some test cases on MetricsVisualizations.

* Save filter string for reload.

* Update render and refresh logic for ROC curves.

* Format and verify existing testing for refresh component.

* Update formatting and organize code.

* Add check on the roc curve id set.

* Add ROC curve and confusion matrix tests.

* Format code.

* Add tests for initialFilterString and setFilterString.

* Remove unnecessary waitFor import.

* Remove debug statements.
2022-08-10 19:26:21 +00:00
Joe Li 1257a3508e
feat(frontend): Support Clone Run with RuntimeConfig (#8093)
* Convert string-type user input to real-type pararmeter. (Currently supporting num, bool, str)

* Delete unnecessary console.log

* Change incorrect type.
Add TODO
Move inputConvert out from function component.
Check parameter type by PipelineSpec before converting.

* Format.

* Move inputConverter out from function component.
Delete unnecessary console.log

* Change inputConverter from if-else to switch.
Assign invalid input to null.

* 1. Change paramTypeIdx to ParameterTypeEnum.
2. Add tests to validate the changes.

* Format

* Support LIST and STRUCT type.

* 1. Fixed default value bugs.
2. Added unit test for LIST and STRUCT type parameters.

* Added type into param.

* Added comment.

* Added div for error message.

* Added unit test for invalid JSON form input.

* Removed incorrect merge conflicts.

* Handle error message for different parameter.

* Remove console.log()

* Added handle function to disable start run button when there is invalid input(s).

* Format.

* Wrap check valid input as a helper function.
Added unit tests for error message and enable/disable start button.

* Format.

* Remove extra error message div.

* Support double type.
Added and modified unit tests.

* Clean unnecessary expect() in the unit tests.

* Added additional tests to check for the existence of display value 4.56

* Added new test for invalid double-type input.

* Test merge.

* Show error message for the invalid input.

* Remove unused library.

* Add screen display value in unit tests.

* Change props name from handleValidInput to setIsValidInput.

* 1. Change naming of unit tests.
2. Added a test for no default input.
3. Remove field - validInputs
4. Added state - isParameterValid to avoid incorrect behavior for startButton.

* Test.

* Add some sudo code to understand the codebase.

* Added idea

* Changes:
1. Remove Pseudo code.
2. Implemented getting templateStr from runId (NewRunSwitcher)
3. Implemented 'create' a new run while having runId.

* Changes:
1. Added runIsFetching to avoid create a newRun component when the templateStrFromRunId is not ready.
2. Added apiRun to make the useEffect() handle auto-fill clone run name.

* Added runtimeConfigFromClone prop in NewRunParametersV2 component to handle the parameters and pipelineRoot from clone run.

* Fixed the pipeline input field bugs for run without pipeline ID.

* Enable cloned parameter in runtimeConfig from BE.

* Rename variable.

* Remove Pipeline section for SDK-created run.

* Fixed unit tests.

* Changes:
1. Remove unnecessary useQuery.
2. Added unit tests for runtimeConfig parameters.

* Temporarily disable the start button for cloning SDK-created run.

* Added comment and format.

* Added unit test.

* Foramt.

* Remove unnecessary lines.

* Changes:
1. Pass ApiRundetail, ApiPipeline, ApiPipelineVersion, templateString from NewRunSwitcher to NewRun v2 to avoid refetching.
2. Remove pipeline / pipeline version section for cloning run.
3. Fix unit tests.

* Add a constant value 'ApiRun' to uniquely identify the query cache key

* Wrap pipeline / pipeline version section as one element.
Move pipelineDetailsUrl from NewRunSwitcher to NewRunV2.

* Passing original Run ID via props rather than query it in NewRunV2 to improve the api design logic.

* Added additional condition for avoiding error from undefined templateString.

* Format

* Changes on a few checking conditions.
2022-08-05 23:47:50 +00:00
Joe Li 75c31f5ab6
fix(frontend): Show correct artifact type at the side panel. (#8083)
* Fixed incorrect artifact type  name.

* Appended 'empty file' warning for metrics and classificationMetrics type.

* Format.

* Show appending text on execution nodes as well.

* Consolidate reused code to a helper function in MlmdUtils.tsx

* Added unit test for getArtifactTypeName().
2022-08-05 22:30:51 +00:00
Chris Elliott f96d3e933b
feat(frontend): Add run parameters (#8105)
* Add the params compare table to v2.

* Fix mistaken params table logic.

* Add console.log for different types.

* Add params table props test.

* Update the logic to include loading and fix tests.

* Change loading UI to better fit content.

* Update dataType naming.

* Update dataType naming v2.

* Update tests and simplify the scalar table logic.
2022-08-05 07:54:14 +00:00
James Liu 369e14c36e
fix(frontend): Resolve all warnings when running `npm run start` (#8089)
* fix(frontend): Resolve all warnings when running `npm run start`

* Format

* fortmat rundetailsv2
2022-08-02 15:05:48 +00:00
Chris Elliott 23d549f3ac
feat(frontend): Add ROC Curve filter table and functionality (#8073)
* MaAllow multiple artifacts to be entered into the metrics visualizations for ROC curve.

* Update formatting.

* Add the ROC curve with todo and  pre-selection to the compare page.

* Test the ROC Curve display of metrics visualizations.

* Add back ROC curve tests.

* Remove unnecessary imports.

* By default, the first three curves will be selected.

* Add filter to existing map function.

* Add some compare table progress to the ROC curve component.

* Add rendering and custom table to MetricsVisualizations.

* Combine name and confidence metrics into the same list.

* Add TODO and simplify mapping logic.

* Update naming pattern if display_name not available.

* Resolve conflict and add import.

* Update the ROC Curve filtering mechanism to use a combination of execution id and artifact id for unique identification.

* Fix all un-selection issue.

* Add highlight index.

* Update coloring on the ROC Curve plot.

* Add selection barriers.

* Remove error on MetricsDropdown page.

* Update the selected id list to disable non-selected items if passed in.

* Update formatting.

* Introduce pagination with ROC Curves.

* Add checkbox system fixes, highlight mechanism.

* Remove required namespace.

* Remove some large block comments.

* Fix import issue and correct the execution name.

* Halfway work done on converting the full artifact path list to a map.

* Update the color map to save the colors on tab change.

* Disable animation and update green color for cleaner display.

* Simplify the logic in CompareV2 and move helper functions to CompareUtils.

* Simplify and clarify some error messages for ROC Curves.

* Provide further simplification to the metrics visualizations roc curve display logic.

* Improve formatting and add comments for udpateRocCurveSelection.

* Update naming for the full artifact name and remove unnecessary ID attribute.

* Update formatting for the page size logic.

* Update formatting and move location of lineColors const.

* Minor changes and adding back in test.

* Fix text ellipsis functionality in roc curve filter table.

* Fix the run name link by adding back ID.

* Update ROC Curve snapshot test as well.

* Update color ordering.

* Update red color.

* Remove comment andd fix ordering bug.

* Disable animation and update artifact count.

* Update line color for the ROC Curve.

* Update artifact name label.

* Remove old TODO.

* Update snapshot test.

* Add ROC Curve and CompareV2 tests.

* Add CompareUtils test to confirm valid linked artifacts are selected.

* Add fundamental setup for the MetricsVisualizations testing.

* Add comment reference for updated color palette.

* Change !== -1 to >= 0.

* Add comments to clarify the forceLegend parameter.

* Update the number of selected artifacts tests.

* Add the test for the error of confidenceMetrics data format.

* Fix the color stack setting logic.

* Add clarifying comment and TODO.

* Add brief comment for fullArtifactPathMap key.

* Make the update logic of the fullArtifactPathMap more explicit.

* Reformat FullArtifactPathMap type and add test to check pagination and max limit.

* Add checks for the filter table and selecting disabled checkbox.

* Fix formatting and testing for MetricsVisualizations.
2022-08-01 20:20:46 +00:00
Joe Li a63182bf23
feat(frontend) Show PipelineSpec from an existing Run (#8077)
* Added 'Pipeline Spec' tab in runDetails page.

* Retrive template string from BE and display in the run details page.

* Added unit test for switching to 'Pipeline Spec' tab.

* Changes:
1. Remove unnecessary useQuery
2. Wrap the editor as a new component PipelineSpecTabContent
3. Use new component is existing code.

* Added pre-check for templateString before showing the content.
2022-07-28 20:47:55 +00:00
Joe Li ca41925f59
fix(frontend) Missing parameter in the input/output tab of Run details side panel (#8069)
* Convert string-type user input to real-type pararmeter. (Currently supporting num, bool, str)

* Delete unnecessary console.log

* Change incorrect type.
Add TODO
Move inputConvert out from function component.
Check parameter type by PipelineSpec before converting.

* Format.

* Move inputConverter out from function component.
Delete unnecessary console.log

* Change inputConverter from if-else to switch.
Assign invalid input to null.

* 1. Change paramTypeIdx to ParameterTypeEnum.
2. Add tests to validate the changes.

* Format

* Support LIST and STRUCT type.

* 1. Fixed default value bugs.
2. Added unit test for LIST and STRUCT type parameters.

* Added type into param.

* Added comment.

* Added div for error message.

* Added unit test for invalid JSON form input.

* Removed incorrect merge conflicts.

* Handle error message for different parameter.

* Remove console.log()

* Added handle function to disable start run button when there is invalid input(s).

* Format.

* Wrap check valid input as a helper function.
Added unit tests for error message and enable/disable start button.

* Format.

* Remove extra error message div.

* Support double type.
Added and modified unit tests.

* Clean unnecessary expect() in the unit tests.

* Added additional tests to check for the existence of display value 4.56

* Added new test for invalid double-type input.

* Test merge.

* Show error message for the invalid input.

* Remove unused library.

* Add screen display value in unit tests.

* Change props name from handleValidInput to setIsValidInput.

* 1. Change naming of unit tests.
2. Added a test for no default input.
3. Remove field - validInputs
4. Added state - isParameterValid to avoid incorrect behavior for startButton.

* Fixed typo.

* Changes:
1. Change naming of unit tests.
2. Chaneg ambiguous naming in the map() method
3. Move isParameterValid to another useEffect() to fix the bug caused by unmodified default values.

* Change the return value of generateInputValidationErrMsg for valid input from '' to null.

* Use only one useEffect to control isStartButtonEnabled state.

* Added templateString into if condition which control the isStartButtonEnabled state.

* Removed unused code.

* Fix the missing input and output parameters in the run details side panel.

* Modified unit tests for input/output tab test.

* Changes:
Remove unused function.
Renaming parameters.
Reuse the orginal getMetadataValue function rather than creating a new one.
2022-07-26 01:40:13 +00:00
Chris Elliott 4cb85625a3
feat(frontend): Display metrics loading and error states (#8029)
* Update the compare table to include parent column labels.

* Show scalar metrics tablethrough rough calculations.

* Remove unnecessary comment.

* Remove unnecesssary print statements and simplify code.

* Break up the loading of scalar metrics table data.

* Update display and error when scalar metrics are not available.

* Update compare table comment and error formatting.

* Update the metrics formatting to include error and loading states in relevant cases.

* Add tests and update artifact index to global variable.

* Simplify mock return value syntax to mock resolved value.

* Update boolean variable naming convention.

* Update formatting.

* Update formatting.

* Separate scalar metrics table calculation into a separate utils file.

* Add compare utils test and reorganize calculation of compare table props.

* Ensure that the table organization works without names.

* Update compare utils and table tests.

* Update formatting and add compare table test and snapshot.

* Rename file from tsx to ts.

* Reset this branch to only hold the CompareTable changes.

* Update formatting.

* Update naming of artifactCount to newArtifactIndex.

* Update  new tests to use React Testing Library.

* Minor fixes - newline and remove unused variable.

* Update formatting.

* Add back the changes to incorporate the CompareTable into the CompareV2 page.

* Remove metrics tab text from the MetricsDropdown.

* Fix the value type.

* Change getExecutionName to getExecutionDisplayName.

* Move imports to CompareUtils and top-of-file.

* Add return type to getCompareTableProps.

* Update return type to defined interface.

* UExtract the data map key to a shared function.

* Update the dataMap to more quickly fill the scalar metric table rows.

* Update the sorting mechanism and remove the use of lodash.

* Fix test.

* Remove TODO and add tests.

* Add the ROC Curve loading and error states.

* Remove unnecessary namespace inputs.

* Update formatting and simplify logic to display loading and error states.
2022-07-26 00:09:14 +00:00
Chris Elliott d3fe514db6
feat(frontend): Display scalar metrics table (#8026)
* Update the compare table to include parent column labels.

* Show scalar metrics tablethrough rough calculations.

* Remove unnecessary comment.

* Remove unnecesssary print statements and simplify code.

* Break up the loading of scalar metrics table data.

* Update display and error when scalar metrics are not available.

* Update compare table comment and error formatting.

* Add tests and update artifact index to global variable.

* Update formatting.

* Separate scalar metrics table calculation into a separate utils file.

* Add compare utils test and reorganize calculation of compare table props.

* Ensure that the table organization works without names.

* Update compare utils and table tests.

* Update formatting and add compare table test and snapshot.

* Rename file from tsx to ts.

* Reset this branch to only hold the CompareTable changes.

* Update formatting.

* Update naming of artifactCount to newArtifactIndex.

* Update  new tests to use React Testing Library.

* Minor fixes - newline and remove unused variable.

* Update formatting.

* Add back the changes to incorporate the CompareTable into the CompareV2 page.

* Remove metrics tab text from the MetricsDropdown.

* Fix the value type.

* Change getExecutionName to getExecutionDisplayName.

* Move imports to CompareUtils and top-of-file.

* Add return type to getCompareTableProps.

* Update return type to defined interface.

* UExtract the data map key to a shared function.

* Update the dataMap to more quickly fill the scalar metric table rows.

* Update the sorting mechanism and remove the use of lodash.

* Fix test.
2022-07-22 19:11:48 +00:00
Chris Elliott cc3bd8b382
feat(frontend): Display ROC curve (#8046)
* MaAllow multiple artifacts to be entered into the metrics visualizations for ROC curve.

* Update formatting.

* Add the ROC curve with todo and  pre-selection to the compare page.

* Test the ROC Curve display of metrics visualizations.

* Add back ROC curve tests.

* Remove unnecessary imports.

* By default, the first three curves will be selected.

* Add filter to existing map function.

* Combine name and confidence metrics into the same list.

* Add TODO and simplify mapping logic.

* Update naming pattern if display_name not available.
2022-07-21 17:35:18 +00:00
Chris Elliott 9df8343792
feat(frontend): Add KFPv2 namespace check (#8036)
* Add namespace tests.

* Undo comment out of CompareV2 tests.

* Update namespace usage and remove unnecessary functions.

* Update comment to reflect page intent.

* Update namespace fetching structure.

* Update naming to EnhancedCompare in parent component.

* Fix import and react order issues.
2022-07-20 15:57:21 +00:00
Chris Elliott 7b49eadf62
refactor(frontend): Move MetricsDropdown logic to separate component (#8032)
* Move the MetricsDropdown component to its own file.

* Remove unnecessary tests in CompareV2.

* Add CompareUtils for v2 and expand on MetricsDropdown.

* Get working metrics dropdown test.

* Add the filter linked artifacts by type spy call.

* Fix test case errors by providing common test wrapper.

* Add test to ensure that the html viewer config spy is only called when necessary.

* Update tests to confirm selection and load behavior.

* Add and update MetricsDropdown tests.

* Simplify existing MetricsDropdown tests.

* Move exported function to top of file.
2022-07-18 18:29:08 +00:00
Chris Elliott 4be213a773
feat(frontend): Add parent labels to the Compare Table (#8024)
* Update the compare table to include parent column labels.

* Show scalar metrics tablethrough rough calculations.

* Remove unnecessary comment.

* Remove unnecesssary print statements and simplify code.

* Break up the loading of scalar metrics table data.

* Update display and error when scalar metrics are not available.

* Update compare table comment and error formatting.

* Add tests and update artifact index to global variable.

* Update formatting.

* Separate scalar metrics table calculation into a separate utils file.

* Add compare utils test and reorganize calculation of compare table props.

* Ensure that the table organization works without names.

* Update compare utils and table tests.

* Update formatting and add compare table test and snapshot.

* Rename file from tsx to ts.

* Reset this branch to only hold the CompareTable changes.

* Update  new tests to use React Testing Library.

* Minor fixes - newline and remove unused variable.

* Update formatting.
2022-07-14 19:10:34 +00:00