diff --git a/ui/src/app/api-docs/api-docs.tsx b/ui/src/app/api-docs/api-docs.tsx index c706dd268214..4c7abb460d54 100644 --- a/ui/src/app/api-docs/api-docs.tsx +++ b/ui/src/app/api-docs/api-docs.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {uiUrl} from '../shared/base'; diff --git a/ui/src/app/app-router.tsx b/ui/src/app/app-router.tsx index a45fd2521c82..c572297150ca 100644 --- a/ui/src/app/app-router.tsx +++ b/ui/src/app/app-router.tsx @@ -1,5 +1,9 @@ -import {Layout, Notifications, NotificationsManager, NotificationType, Popup, PopupManager, PopupProps} from 'argo-ui'; import * as H from 'history'; +import {Layout} from 'argo-ui/src/components/layout/layout'; +import {NotificationsManager} from 'argo-ui/src/components/notifications/notification-manager'; +import {Notifications, NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {PopupManager} from 'argo-ui/src/components/popup/popup-manager'; +import {Popup, PopupProps} from 'argo-ui/src/components/popup/popup'; import * as React from 'react'; import {useEffect, useState} from 'react'; diff --git a/ui/src/app/app.tsx b/ui/src/app/app.tsx index f4099e32beff..120121ea2cbf 100644 --- a/ui/src/app/app.tsx +++ b/ui/src/app/app.tsx @@ -1,7 +1,11 @@ -import {NavigationManager, NotificationsManager, PopupManager} from 'argo-ui'; - import {createBrowserHistory} from 'history'; import * as React from 'react'; +import {NavigationManager} from 'argo-ui/src/components/navigation'; +import {NotificationsManager} from 'argo-ui/src/components/notifications/notification-manager'; +import {PopupManager} from 'argo-ui/src/components/popup/popup-manager'; + +import 'argo-ui/src/styles/main.scss'; + import {AppRouter} from './app-router'; import {ContextApis, Provider} from './shared/context'; diff --git a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-details.tsx b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-details.tsx index d647046c806c..1675e50ace64 100644 --- a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-details.tsx +++ b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-details.tsx @@ -1,5 +1,6 @@ -import {NotificationType, Page} from 'argo-ui'; -import {SlidingPanel} from 'argo-ui/src/index'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router'; diff --git a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-editor.tsx b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-editor.tsx index ebfae00deb04..32179230605b 100644 --- a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-editor.tsx +++ b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-editor.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {Tabs} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {WorkflowTemplate} from '../../models'; import {LabelsAndAnnotationsEditor} from '../shared/components/editors/labels-and-annotations-editor'; diff --git a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-list.tsx b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-list.tsx index c855a9c885d8..2e52d4591658 100644 --- a/ui/src/app/cluster-workflow-templates/cluster-workflow-template-list.tsx +++ b/ui/src/app/cluster-workflow-templates/cluster-workflow-template-list.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {Link, RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/cron-workflows/cron-workflow-details.tsx b/ui/src/app/cron-workflows/cron-workflow-details.tsx index e2e97b248c4f..07017f23cc23 100644 --- a/ui/src/app/cron-workflows/cron-workflow-details.tsx +++ b/ui/src/app/cron-workflows/cron-workflow-details.tsx @@ -1,4 +1,6 @@ -import {NotificationType, Page, SlidingPanel} from 'argo-ui'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router'; diff --git a/ui/src/app/cron-workflows/cron-workflow-editor.tsx b/ui/src/app/cron-workflows/cron-workflow-editor.tsx index a48bd95dff3b..8f9dca5738e5 100644 --- a/ui/src/app/cron-workflows/cron-workflow-editor.tsx +++ b/ui/src/app/cron-workflows/cron-workflow-editor.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {Tabs} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {CronWorkflow} from '../../models'; import {LabelsAndAnnotationsEditor} from '../shared/components/editors/labels-and-annotations-editor'; diff --git a/ui/src/app/cron-workflows/cron-workflow-list.tsx b/ui/src/app/cron-workflows/cron-workflow-list.tsx index 3d171ee4b585..48809f7d5871 100644 --- a/ui/src/app/cron-workflows/cron-workflow-list.tsx +++ b/ui/src/app/cron-workflows/cron-workflow-list.tsx @@ -1,4 +1,6 @@ -import {Page, SlidingPanel, Ticker} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; +import {Ticker} from 'argo-ui/src/components/ticker'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {Link, RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/cron-workflows/cron-workflow-spec-editior.tsx b/ui/src/app/cron-workflows/cron-workflow-spec-editior.tsx index 9d6ce5b44302..3ebdf6dd1e66 100644 --- a/ui/src/app/cron-workflows/cron-workflow-spec-editior.tsx +++ b/ui/src/app/cron-workflows/cron-workflow-spec-editior.tsx @@ -1,4 +1,5 @@ -import {Checkbox, Select} from 'argo-ui'; +import {Checkbox} from 'argo-ui/src/components/checkbox'; +import {Select} from 'argo-ui/src/components/select/select'; import * as React from 'react'; import {ConcurrencyPolicy, CronWorkflowSpec} from '../../models'; diff --git a/ui/src/app/event-flow/event-flow-page.tsx b/ui/src/app/event-flow/event-flow-page.tsx index 96de8c31079c..4e7e211b15c5 100644 --- a/ui/src/app/event-flow/event-flow-page.tsx +++ b/ui/src/app/event-flow/event-flow-page.tsx @@ -1,4 +1,6 @@ -import {Page, SlidingPanel, Tabs} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {useContext, useEffect, useState} from 'react'; import * as React from 'react'; import {RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/event-sources/event-source-details.tsx b/ui/src/app/event-sources/event-source-details.tsx index 65383afcb5cf..0601dbd75421 100644 --- a/ui/src/app/event-sources/event-source-details.tsx +++ b/ui/src/app/event-sources/event-source-details.tsx @@ -1,5 +1,7 @@ -import {NotificationType, Page} from 'argo-ui'; -import {SlidingPanel, Tabs} from 'argo-ui/src/index'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router'; diff --git a/ui/src/app/event-sources/event-source-editor.tsx b/ui/src/app/event-sources/event-source-editor.tsx index d20fce3d156f..60bb20227a8d 100644 --- a/ui/src/app/event-sources/event-source-editor.tsx +++ b/ui/src/app/event-sources/event-source-editor.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {Tabs} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {EventSource} from '../../models'; import {MetadataEditor} from '../shared/components/editors/metadata-editor'; diff --git a/ui/src/app/event-sources/event-source-list.tsx b/ui/src/app/event-sources/event-source-list.tsx index b626be613e71..a2796cfb7769 100644 --- a/ui/src/app/event-sources/event-source-list.tsx +++ b/ui/src/app/event-sources/event-source-list.tsx @@ -1,4 +1,6 @@ -import {Page, SlidingPanel, Tabs} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import classNames from 'classnames'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; diff --git a/ui/src/app/help/help.tsx b/ui/src/app/help/help.tsx index 77c89ceb7b9f..73e71c76b713 100644 --- a/ui/src/app/help/help.tsx +++ b/ui/src/app/help/help.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {uiUrl} from '../shared/base'; diff --git a/ui/src/app/login/login.tsx b/ui/src/app/login/login.tsx index a932609f6478..ec0b00d1379a 100644 --- a/ui/src/app/login/login.tsx +++ b/ui/src/app/login/login.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {uiUrl, uiUrlWithParams} from '../shared/base'; diff --git a/ui/src/app/plugins/plugin-list.tsx b/ui/src/app/plugins/plugin-list.tsx index 1941d1a7c5c5..46aca4b03538 100644 --- a/ui/src/app/plugins/plugin-list.tsx +++ b/ui/src/app/plugins/plugin-list.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/reports/reports.tsx b/ui/src/app/reports/reports.tsx index d686347a7c5e..aef2178380d6 100644 --- a/ui/src/app/reports/reports.tsx +++ b/ui/src/app/reports/reports.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui/src/index'; +import {Page} from 'argo-ui/src/components/page/page'; import {ChartOptions} from 'chart.js'; import 'chartjs-plugin-annotation'; import * as React from 'react'; diff --git a/ui/src/app/sensors/sensor-details.tsx b/ui/src/app/sensors/sensor-details.tsx index 52d262961a3f..bbd14aef8f65 100644 --- a/ui/src/app/sensors/sensor-details.tsx +++ b/ui/src/app/sensors/sensor-details.tsx @@ -1,4 +1,5 @@ -import {NotificationType, Page} from 'argo-ui'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router'; diff --git a/ui/src/app/sensors/sensor-editor.tsx b/ui/src/app/sensors/sensor-editor.tsx index b2a676a659e0..b595af74b02d 100644 --- a/ui/src/app/sensors/sensor-editor.tsx +++ b/ui/src/app/sensors/sensor-editor.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {Tabs} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {Sensor} from '../../models'; import {MetadataEditor} from '../shared/components/editors/metadata-editor'; diff --git a/ui/src/app/sensors/sensor-list.tsx b/ui/src/app/sensors/sensor-list.tsx index b8240c572598..b130f82518f5 100644 --- a/ui/src/app/sensors/sensor-list.tsx +++ b/ui/src/app/sensors/sensor-list.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import classNames from 'classnames'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; diff --git a/ui/src/app/sensors/sensor-side-panel.tsx b/ui/src/app/sensors/sensor-side-panel.tsx index 76ce67c5aace..b7bffd024c3c 100644 --- a/ui/src/app/sensors/sensor-side-panel.tsx +++ b/ui/src/app/sensors/sensor-side-panel.tsx @@ -1,6 +1,8 @@ -import {SlidingPanel, Tabs} from 'argo-ui'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import * as React from 'react'; import {useState} from 'react'; + import {Sensor} from '../../models'; import {Node} from '../shared/components/graph/types'; import {EventsPanel} from '../workflows/components/events-panel'; diff --git a/ui/src/app/shared/components/checkbox-filter/checkbox-filter.tsx b/ui/src/app/shared/components/checkbox-filter/checkbox-filter.tsx index 96d450c2086e..29244c02cb27 100644 --- a/ui/src/app/shared/components/checkbox-filter/checkbox-filter.tsx +++ b/ui/src/app/shared/components/checkbox-filter/checkbox-filter.tsx @@ -1,4 +1,4 @@ -import {Checkbox} from 'argo-ui'; +import {Checkbox} from 'argo-ui/src/components/checkbox'; import * as React from 'react'; import './checkbox-filter.scss'; diff --git a/ui/src/app/shared/components/clipboard-text.tsx b/ui/src/app/shared/components/clipboard-text.tsx index 949a598f01e3..c8bcfa7aec04 100644 --- a/ui/src/app/shared/components/clipboard-text.tsx +++ b/ui/src/app/shared/components/clipboard-text.tsx @@ -1,4 +1,4 @@ -import {Tooltip} from 'argo-ui'; +import {Tooltip} from 'argo-ui/src/components/tooltip/tooltip'; import * as React from 'react'; import {useState} from 'react'; diff --git a/ui/src/app/shared/components/data-loader-dropdown.tsx b/ui/src/app/shared/components/data-loader-dropdown.tsx index 173eb5772676..a05748a9c989 100644 --- a/ui/src/app/shared/components/data-loader-dropdown.tsx +++ b/ui/src/app/shared/components/data-loader-dropdown.tsx @@ -1,4 +1,5 @@ -import {DataLoader, Select, SelectOption} from 'argo-ui'; +import {DataLoader} from 'argo-ui/src/components/data-loader'; +import {Select, SelectOption} from 'argo-ui/src/components/select/select'; import * as React from 'react'; import {useState} from 'react'; diff --git a/ui/src/app/shared/components/filter-drop-down.tsx b/ui/src/app/shared/components/filter-drop-down.tsx index 2ed833e5181e..95419e793273 100644 --- a/ui/src/app/shared/components/filter-drop-down.tsx +++ b/ui/src/app/shared/components/filter-drop-down.tsx @@ -1,4 +1,4 @@ -import {Checkbox} from 'argo-ui'; +import {Checkbox} from 'argo-ui/src/components/checkbox'; import classNames from 'classnames'; import * as React from 'react'; diff --git a/ui/src/app/shared/components/input-filter.tsx b/ui/src/app/shared/components/input-filter.tsx index e870a7f97efb..14e781aa420c 100644 --- a/ui/src/app/shared/components/input-filter.tsx +++ b/ui/src/app/shared/components/input-filter.tsx @@ -1,4 +1,4 @@ -import {Autocomplete} from 'argo-ui'; +import {Autocomplete} from 'argo-ui/src/components/autocomplete/autocomplete'; import React, {useState} from 'react'; interface InputProps { diff --git a/ui/src/app/shared/components/links.tsx b/ui/src/app/shared/components/links.tsx index 52cd4677e1c2..0808d7d2d005 100644 --- a/ui/src/app/shared/components/links.tsx +++ b/ui/src/app/shared/components/links.tsx @@ -1,6 +1,7 @@ import {ObjectMeta} from 'argo-ui/src/models/kubernetes'; import {useEffect, useState} from 'react'; import * as React from 'react'; + import {Link, Workflow} from '../../../models'; import {services} from '../services'; import {Button} from './button'; diff --git a/ui/src/app/shared/components/loading.tsx b/ui/src/app/shared/components/loading.tsx index 31f75903428f..07745c48e650 100644 --- a/ui/src/app/shared/components/loading.tsx +++ b/ui/src/app/shared/components/loading.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {MockupList} from '../../../../node_modules/argo-ui'; +import {MockupList} from 'argo-ui/src/components/mockup-list/mockup-list'; export const Loading = () => (
diff --git a/ui/src/app/shared/components/parameters-input.tsx b/ui/src/app/shared/components/parameters-input.tsx index 56c4eddaf612..4e76e786d9fa 100644 --- a/ui/src/app/shared/components/parameters-input.tsx +++ b/ui/src/app/shared/components/parameters-input.tsx @@ -1,4 +1,5 @@ -import {Select, Tooltip} from 'argo-ui'; +import {Select} from 'argo-ui/src/components/select/select'; +import {Tooltip} from 'argo-ui/src/components/tooltip/tooltip'; import React from 'react'; import {Parameter} from '../../../models'; diff --git a/ui/src/app/shared/components/tags-input/tags-input.tsx b/ui/src/app/shared/components/tags-input/tags-input.tsx index 3788e41a214d..c2ab23e52c49 100644 --- a/ui/src/app/shared/components/tags-input/tags-input.tsx +++ b/ui/src/app/shared/components/tags-input/tags-input.tsx @@ -1,4 +1,4 @@ -import {Autocomplete, AutocompleteApi, AutocompleteOption} from 'argo-ui'; +import {Autocomplete, AutocompleteApi, AutocompleteOption} from 'argo-ui/src/components/autocomplete/autocomplete'; import classNames from 'classnames'; import * as React from 'react'; import {useRef, useState} from 'react'; diff --git a/ui/src/app/shared/components/timestamp.tsx b/ui/src/app/shared/components/timestamp.tsx index 7b7de13f2201..5c4fc7d11773 100644 --- a/ui/src/app/shared/components/timestamp.tsx +++ b/ui/src/app/shared/components/timestamp.tsx @@ -1,4 +1,4 @@ -import {Ticker} from 'argo-ui'; +import {Ticker} from 'argo-ui/src/components/ticker'; import * as React from 'react'; import {ago} from '../duration'; diff --git a/ui/src/app/shared/context.ts b/ui/src/app/shared/context.ts index b1500143548a..45835ba9e2e6 100644 --- a/ui/src/app/shared/context.ts +++ b/ui/src/app/shared/context.ts @@ -1,4 +1,7 @@ -import {AppContext as ArgoAppContext, NavigationApi, NotificationsApi, PopupApi} from 'argo-ui'; +import type {AppContext as ArgoAppContext} from 'argo-ui/src/context'; +import type {NavigationApi} from 'argo-ui/src/components/navigation'; +import type {NotificationsApi} from 'argo-ui/src/components/notifications/notification-manager'; +import type {PopupApi} from 'argo-ui/src/components/popup/popup-manager'; import {History} from 'history'; import * as React from 'react'; diff --git a/ui/src/app/userinfo/user-info.tsx b/ui/src/app/userinfo/user-info.tsx index 684c045cf6c4..e908057695df 100644 --- a/ui/src/app/userinfo/user-info.tsx +++ b/ui/src/app/userinfo/user-info.tsx @@ -1,4 +1,4 @@ -import {Page} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; import * as React from 'react'; import {useEffect, useState} from 'react'; diff --git a/ui/src/app/workflow-event-bindings/workflow-event-bindings.tsx b/ui/src/app/workflow-event-bindings/workflow-event-bindings.tsx index 3d3826344cc2..5603d67a3d73 100644 --- a/ui/src/app/workflow-event-bindings/workflow-event-bindings.tsx +++ b/ui/src/app/workflow-event-bindings/workflow-event-bindings.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/workflow-templates/workflow-template-details.tsx b/ui/src/app/workflow-templates/workflow-template-details.tsx index 60d7b4b85da9..129228ee13fe 100644 --- a/ui/src/app/workflow-templates/workflow-template-details.tsx +++ b/ui/src/app/workflow-templates/workflow-template-details.tsx @@ -1,5 +1,6 @@ -import {NotificationType, Page} from 'argo-ui'; -import {SlidingPanel} from 'argo-ui/src/index'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {RouteComponentProps} from 'react-router'; diff --git a/ui/src/app/workflow-templates/workflow-template-editor.tsx b/ui/src/app/workflow-templates/workflow-template-editor.tsx index bfd24362c48f..c98e92682c7c 100644 --- a/ui/src/app/workflow-templates/workflow-template-editor.tsx +++ b/ui/src/app/workflow-templates/workflow-template-editor.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import {Tabs} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; import {WorkflowTemplate} from '../../models'; import {LabelsAndAnnotationsEditor} from '../shared/components/editors/labels-and-annotations-editor'; diff --git a/ui/src/app/workflow-templates/workflow-template-list.tsx b/ui/src/app/workflow-templates/workflow-template-list.tsx index b1bbb6cb042d..7f40a15db439 100644 --- a/ui/src/app/workflow-templates/workflow-template-list.tsx +++ b/ui/src/app/workflow-templates/workflow-template-list.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; import {Link, RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/workflows/components/resubmit-workflow-panel.tsx b/ui/src/app/workflows/components/resubmit-workflow-panel.tsx index 67842bde9470..a9771ffc0a4c 100644 --- a/ui/src/app/workflows/components/resubmit-workflow-panel.tsx +++ b/ui/src/app/workflows/components/resubmit-workflow-panel.tsx @@ -1,5 +1,6 @@ -import {Checkbox} from 'argo-ui'; +import {Checkbox} from 'argo-ui/src/components/checkbox'; import React, {useContext, useState} from 'react'; + import {Parameter, ResubmitOpts, Workflow} from '../../../models'; import {Context} from '../../shared/context'; import {uiUrl} from '../../shared/base'; diff --git a/ui/src/app/workflows/components/retry-workflow-panel.tsx b/ui/src/app/workflows/components/retry-workflow-panel.tsx index 51ea2c518a1b..36bac85346d3 100644 --- a/ui/src/app/workflows/components/retry-workflow-panel.tsx +++ b/ui/src/app/workflows/components/retry-workflow-panel.tsx @@ -1,5 +1,6 @@ -import {Checkbox} from 'argo-ui'; +import {Checkbox} from 'argo-ui/src/components/checkbox'; import React, {useContext, useState} from 'react'; + import {Parameter, RetryOpts, Workflow} from '../../../models'; import {Context} from '../../shared/context'; import {uiUrl} from '../../shared/base'; diff --git a/ui/src/app/workflows/components/submit-workflow-panel.tsx b/ui/src/app/workflows/components/submit-workflow-panel.tsx index c2605d99993b..87ad365f99d5 100644 --- a/ui/src/app/workflows/components/submit-workflow-panel.tsx +++ b/ui/src/app/workflows/components/submit-workflow-panel.tsx @@ -1,5 +1,6 @@ -import {Select} from 'argo-ui'; +import {Select} from 'argo-ui/src/components/select/select'; import React, {useContext, useMemo, useState} from 'react'; + import {Parameter, Template} from '../../../models'; import {Context} from '../../shared/context'; import {uiUrl} from '../../shared/base'; diff --git a/ui/src/app/workflows/components/workflow-details/suspend-inputs.tsx b/ui/src/app/workflows/components/workflow-details/suspend-inputs.tsx index 7aac1ca4792b..ec35018b15fb 100644 --- a/ui/src/app/workflows/components/workflow-details/suspend-inputs.tsx +++ b/ui/src/app/workflows/components/workflow-details/suspend-inputs.tsx @@ -1,4 +1,5 @@ -import {Select, Tooltip} from 'argo-ui'; +import {Select} from 'argo-ui/src/components/select/select'; +import {Tooltip} from 'argo-ui/src/components/tooltip/tooltip'; import * as React from 'react'; import {useState} from 'react'; diff --git a/ui/src/app/workflows/components/workflow-details/workflow-details.tsx b/ui/src/app/workflows/components/workflow-details/workflow-details.tsx index d2699bed8da5..5349b2094c40 100644 --- a/ui/src/app/workflows/components/workflow-details/workflow-details.tsx +++ b/ui/src/app/workflows/components/workflow-details/workflow-details.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import classNames from 'classnames'; import * as React from 'react'; import {useContext, useEffect, useRef, useState} from 'react'; diff --git a/ui/src/app/workflows/components/workflow-editor.tsx b/ui/src/app/workflows/components/workflow-editor.tsx index a521ec2b3459..4c51cb64f596 100644 --- a/ui/src/app/workflows/components/workflow-editor.tsx +++ b/ui/src/app/workflows/components/workflow-editor.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; -import {Tabs} from 'argo-ui'; import {Workflow} from '../../../models'; import {MetadataEditor} from '../../shared/components/editors/metadata-editor'; import {WorkflowParametersEditor} from '../../shared/components/editors/workflow-parameters-editor'; diff --git a/ui/src/app/workflows/components/workflow-logs-viewer/full-height-logs-viewer.tsx b/ui/src/app/workflows/components/workflow-logs-viewer/full-height-logs-viewer.tsx index d0c871124182..fdac5a2d36ab 100644 --- a/ui/src/app/workflows/components/workflow-logs-viewer/full-height-logs-viewer.tsx +++ b/ui/src/app/workflows/components/workflow-logs-viewer/full-height-logs-viewer.tsx @@ -1,8 +1,9 @@ import * as React from 'react'; import {useEffect, useRef, useState} from 'react'; -import {LogsViewer} from 'argo-ui'; -import {LogsViewerProps} from 'argo-ui/src/components/logs-viewer/logs-viewer'; +import type {LogsViewerProps} from 'argo-ui/src/components/logs-viewer/logs-viewer'; + +import {Loading} from '../../../shared/components/loading'; import './workflow-logs-viewer.scss'; @@ -18,7 +19,22 @@ export function FullHeightLogsViewer(props: LogsViewerProps) { return (
- {height && } + {height && }
); } + +// lazy load LogsViewer as it imports a large component: xterm (which can be split into a separate bundle) +const LazyLogsViewer = React.lazy(async () => { + // prefetch b/c logs are commonly used + const module = await import(/* webpackPrefetch: true, webpackChunkName: "argo-ui-logs-viewer" */ 'argo-ui/src/components/logs-viewer/logs-viewer'); + return {default: module.LogsViewer}; // React.lazy requires a default import, so we create an intermediate module +}); + +function SuspenseLogsViewer(props: LogsViewerProps) { + return ( + }> + + + ); +} diff --git a/ui/src/app/workflows/components/workflow-logs-viewer/workflow-logs-viewer.tsx b/ui/src/app/workflows/components/workflow-logs-viewer/workflow-logs-viewer.tsx index 3194a00ae9ac..1f7c5b831cd2 100644 --- a/ui/src/app/workflows/components/workflow-logs-viewer/workflow-logs-viewer.tsx +++ b/ui/src/app/workflows/components/workflow-logs-viewer/workflow-logs-viewer.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import {useContext, useEffect, useState} from 'react'; -import {Autocomplete} from 'argo-ui'; +import {Autocomplete} from 'argo-ui/src/components/autocomplete/autocomplete'; import {Observable} from 'rxjs'; import {map, publishReplay, refCount} from 'rxjs/operators'; diff --git a/ui/src/app/workflows/components/workflow-node-info/workflow-node-info.tsx b/ui/src/app/workflows/components/workflow-node-info/workflow-node-info.tsx index 19c9113a59e8..8d5c70a4ec34 100644 --- a/ui/src/app/workflows/components/workflow-node-info/workflow-node-info.tsx +++ b/ui/src/app/workflows/components/workflow-node-info/workflow-node-info.tsx @@ -1,4 +1,7 @@ -import {Tabs, Ticker, Tooltip} from 'argo-ui'; +import {Tabs} from 'argo-ui/src/components/tabs/tabs'; +import {Ticker} from 'argo-ui/src/components/ticker'; +import {Tooltip} from 'argo-ui/src/components/tooltip/tooltip'; + import moment from 'moment'; import * as React from 'react'; import {useState} from 'react'; diff --git a/ui/src/app/workflows/components/workflow-panel/workflow-panel.tsx b/ui/src/app/workflows/components/workflow-panel/workflow-panel.tsx index a84df7d13766..6b7f906f4f14 100644 --- a/ui/src/app/workflows/components/workflow-panel/workflow-panel.tsx +++ b/ui/src/app/workflows/components/workflow-panel/workflow-panel.tsx @@ -1,5 +1,6 @@ import {ObjectMeta} from 'argo-ui/src/models/kubernetes'; import * as React from 'react'; + import {WorkflowStatus} from '../../../../models'; import {Notice} from '../../../shared/components/notice'; import {Phase} from '../../../shared/components/phase'; diff --git a/ui/src/app/workflows/components/workflow-summary-panel.tsx b/ui/src/app/workflows/components/workflow-summary-panel.tsx index b345ae27e621..36cade2327e8 100644 --- a/ui/src/app/workflows/components/workflow-summary-panel.tsx +++ b/ui/src/app/workflows/components/workflow-summary-panel.tsx @@ -1,4 +1,4 @@ -import {Ticker} from 'argo-ui'; +import {Ticker} from 'argo-ui/src/components/ticker'; import * as React from 'react'; import {labels, NODE_PHASE, Workflow} from '../../../models'; diff --git a/ui/src/app/workflows/components/workflow-yaml-viewer/workflow-yaml-viewer.tsx b/ui/src/app/workflows/components/workflow-yaml-viewer/workflow-yaml-viewer.tsx index 844a0ddf8d48..af36228b7c75 100644 --- a/ui/src/app/workflows/components/workflow-yaml-viewer/workflow-yaml-viewer.tsx +++ b/ui/src/app/workflows/components/workflow-yaml-viewer/workflow-yaml-viewer.tsx @@ -1,4 +1,4 @@ -import {SlideContents} from 'argo-ui'; +import {SlideContents} from 'argo-ui/src/components/slide-contents/slide-contents'; import * as React from 'react'; import * as models from '../../../../models'; diff --git a/ui/src/app/workflows/components/workflows-list/workflows-list.tsx b/ui/src/app/workflows/components/workflows-list/workflows-list.tsx index f192e2827cab..d1c9b3ab6630 100644 --- a/ui/src/app/workflows/components/workflows-list/workflows-list.tsx +++ b/ui/src/app/workflows/components/workflows-list/workflows-list.tsx @@ -1,4 +1,5 @@ -import {Page, SlidingPanel} from 'argo-ui'; +import {Page} from 'argo-ui/src/components/page/page'; +import {SlidingPanel} from 'argo-ui/src/components/sliding-panel/sliding-panel'; import * as React from 'react'; import {useContext, useEffect, useMemo, useState} from 'react'; import {RouteComponentProps} from 'react-router-dom'; diff --git a/ui/src/app/workflows/components/workflows-row/workflows-row.tsx b/ui/src/app/workflows/components/workflows-row/workflows-row.tsx index 5f8122bf551a..b7aba72bf9cb 100644 --- a/ui/src/app/workflows/components/workflows-row/workflows-row.tsx +++ b/ui/src/app/workflows/components/workflows-row/workflows-row.tsx @@ -1,4 +1,4 @@ -import {Ticker} from 'argo-ui/src/index'; +import {Ticker} from 'argo-ui/src/components/ticker'; import * as React from 'react'; import {useState} from 'react'; import {Link} from 'react-router-dom'; diff --git a/ui/src/app/workflows/components/workflows-summary-container/workflows-summary-container.tsx b/ui/src/app/workflows/components/workflows-summary-container/workflows-summary-container.tsx index 41942b32fafb..1a0670970726 100644 --- a/ui/src/app/workflows/components/workflows-summary-container/workflows-summary-container.tsx +++ b/ui/src/app/workflows/components/workflows-summary-container/workflows-summary-container.tsx @@ -1,4 +1,4 @@ -import {Tooltip} from 'argo-ui'; +import {Tooltip} from 'argo-ui/src/components/tooltip/tooltip'; import * as React from 'react'; import {useEffect, useState} from 'react'; diff --git a/ui/src/app/workflows/components/workflows-toolbar/workflows-toolbar.tsx b/ui/src/app/workflows/components/workflows-toolbar/workflows-toolbar.tsx index 2f3692202672..79184c52b3a8 100644 --- a/ui/src/app/workflows/components/workflows-toolbar/workflows-toolbar.tsx +++ b/ui/src/app/workflows/components/workflows-toolbar/workflows-toolbar.tsx @@ -1,4 +1,4 @@ -import {NotificationType} from 'argo-ui'; +import {NotificationType} from 'argo-ui/src/components/notifications/notifications'; import * as React from 'react'; import {useContext, useMemo} from 'react'; diff --git a/ui/src/models/index.ts b/ui/src/models/index.ts index 0241a88bc1ff..9e87060788b8 100644 --- a/ui/src/models/index.ts +++ b/ui/src/models/index.ts @@ -8,4 +8,4 @@ export * from './cluster-workflow-templates'; export * from './submit-opts'; export type {EventSource} from './event-source'; export type {Sensor, SensorList} from './sensor'; -export {models as kubernetes} from 'argo-ui'; +export * as kubernetes from 'argo-ui/src/models/kubernetes';