diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionKeyValueBlock.tsx b/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionKeyValueBlock.tsx index 434b0ae36..cc988bdec 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionKeyValueBlock.tsx +++ b/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionKeyValueBlock.tsx @@ -12,7 +12,7 @@ import { useOrchestratorTheme } from '../../hooks'; import { KeyValue, SubscriptionStatus } from '../../types'; -export const RenderField = ( +export const getRenderField = ( key: string, value: unknown, theme: EuiThemeComputed, @@ -55,7 +55,7 @@ export const SubscriptionKeyValueBlock = ({ const subscriptionKeyValues: WFOKeyValueTableDataType[] = keyValues.map( (keyValue) => ({ key: keyValue.key, - value: RenderField(keyValue.key, keyValue.value, theme), + value: getRenderField(keyValue.key, keyValue.value, theme), }), ); diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscription.tsx b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscription.tsx index 68f4c7ed5..1a6942e87 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscription.tsx +++ b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscription.tsx @@ -13,9 +13,9 @@ import { SubscriptionTabIds, tabs } from './utils'; import { GET_SUBSCRIPTION_DETAIL_GRAPHQL_QUERY } from '../../graphqlQueries'; import { WFOLoading } from '../WFOLoading'; -import { SubscriptionActions } from './SubscriptionActions'; -import { SubscriptionGeneral } from './SubscriptionGeneral'; -import { SubscriptionDetailTree } from './SubscriptionDetailTree'; +import { WFOSubscriptionActions } from './WFOSubscriptionActions'; +import { WFOSubscriptionGeneral } from './WFOSubscriptionGeneral'; +import { WFOSubscriptionDetailTree } from './WFOSubscriptionDetailTree'; import { ProcessesTimeline } from './WFOProcessesTimeline'; type WFOSubscriptionProps = { @@ -53,6 +53,7 @@ export const WFOSubscription = ({ subscriptionId }: WFOSubscriptionProps) => { )); + // Todo #97: Find out if pre fetch can be used again. The shape of table cache seems to have changed const subscriptionResult = data && data.subscriptions && data.subscriptions.page; const subscriptionDetail = subscriptionResult @@ -74,7 +75,7 @@ export const WFOSubscription = ({ subscriptionId }: WFOSubscriptionProps) => { - @@ -84,13 +85,13 @@ export const WFOSubscription = ({ subscriptionId }: WFOSubscriptionProps) => { {selectedTabId === SubscriptionTabIds.GENERAL_TAB && ( - )} {selectedTabId === SubscriptionTabIds.SERVICE_CONFIGURATION_TAB && ( - = ({ title }) => ( ); -export type SubscriptionActionsProps = { +export type WFOSubscriptionActionsProps = { subscriptionId: string; }; -export const SubscriptionActions: FC = ({ +export const WFOSubscriptionActions: FC = ({ subscriptionId, }) => { const MenuItem: FC = ({ icon, action, key }) => { diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionDetailTree.tsx b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionDetailTree.tsx similarity index 95% rename from packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionDetailTree.tsx rename to packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionDetailTree.tsx index fd19b6978..16a61ebe0 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionDetailTree.tsx +++ b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionDetailTree.tsx @@ -18,19 +18,19 @@ import { getFieldFromProductBlockInstanceValues, getProductBlockTitle, } from './utils'; -import { SubscriptionProductBlock } from './SubscriptionProductBlock'; +import { WFOSubscriptionProductBlock } from './WFOSubscriptionProductBlock'; type NodeMap = { [key: number]: TreeBlock }; const MAX_EXPAND_ALL = 100; -interface SubscriptionDetailTreeProps { +interface WFOSubscriptionDetailTreeProps { productBlockInstances: ProductBlockInstance[]; } -export const SubscriptionDetailTree = ({ +export const WFOSubscriptionDetailTree = ({ productBlockInstances, -}: SubscriptionDetailTreeProps) => { +}: WFOSubscriptionDetailTreeProps) => { const t = useTranslations('subscriptions.detail'); const [expandAllActive, setExpandAllActive] = useState(false); const [, setSelectedTreeNode] = useState(-1); @@ -151,7 +151,7 @@ export const SubscriptionDetailTree = ({ {selectedIds.length !== 0 && selectedIds.reverse().map((id, index) => { return ( - { +}: WFOSubscriptionGeneralProps) => { const t = useTranslations('subscriptions.detail'); const getSubscriptionDetailBlockData = (): KeyValue[] => { diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionProductBlock.tsx b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionProductBlock.tsx similarity index 98% rename from packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionProductBlock.tsx rename to packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionProductBlock.tsx index a2c5cd2bc..118fae2ee 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscription/SubscriptionProductBlock.tsx +++ b/packages/orchestrator-ui-components/src/components/WFOSubscription/WFOSubscriptionProductBlock.tsx @@ -13,15 +13,15 @@ import { TreeContext, TreeContextType } from '../../contexts'; import { FieldValue } from '../../types'; import { getProductBlockTitle } from './utils'; -interface SubscriptionProductBlock { +interface WFOSubscriptionProductBlockProps { productBlockInstanceValues: FieldValue[]; id: number; } -export const SubscriptionProductBlock = ({ +export const WFOSubscriptionProductBlock = ({ productBlockInstanceValues, id, -}: SubscriptionProductBlock) => { +}: WFOSubscriptionProductBlockProps) => { const { toggleSelectedId } = React.useContext( TreeContext, ) as TreeContextType; diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscription/index.ts b/packages/orchestrator-ui-components/src/components/WFOSubscription/index.ts index 90b1eea5d..2f3df35e0 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscription/index.ts +++ b/packages/orchestrator-ui-components/src/components/WFOSubscription/index.ts @@ -1,8 +1,8 @@ export * from './utils'; export * from './WFOProcessesTimeline'; -export * from './SubscriptionProductBlock'; -export * from './SubscriptionActions'; +export * from './WFOSubscriptionProductBlock'; +export * from './WFOSubscriptionActions'; export * from './SubscriptionKeyValueBlock'; -export * from './SubscriptionDetailTree'; -export * from './SubscriptionGeneral'; +export * from './WFOSubscriptionDetailTree'; +export * from './WFOSubscriptionGeneral'; export * from './WFOSubscription'; diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/WFOSubscriptionsList.tsx b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/WFOSubscriptionsList.tsx index a6e7dc760..8df3879b2 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/WFOSubscriptionsList.tsx +++ b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/WFOSubscriptionsList.tsx @@ -16,8 +16,7 @@ import { WFOTableControlColumnConfig, WFOTableWithFilter, } from '../WFOTable'; -import { SubscriptionListItem } from '../../types'; - +import { SubscriptionListItem } from './mapGrapghQlSubscriptionsResultToSubscriptionListItems'; import { FilterQuery } from '../WFOFilterTabs'; import { DataDisplayParams } from '../../hooks/useDataDisplayParams'; import { useOrchestratorTheme } from '../../hooks/useOrchestratorTheme'; diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/mapGrapghQlSubscriptionsResultToSubscriptionListItems.ts b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/mapGrapghQlSubscriptionsResultToSubscriptionListItems.ts index bebb6d6ca..4b7f6b238 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/mapGrapghQlSubscriptionsResultToSubscriptionListItems.ts +++ b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/mapGrapghQlSubscriptionsResultToSubscriptionListItems.ts @@ -1,6 +1,16 @@ -import { SubscriptionsResult, SubscriptionListItem } from '../../types'; +import { SubscriptionsResult, Subscription } from '../../types'; import { parseDate } from '../../utils'; +export type SubscriptionListItem = Pick< + Subscription, + 'subscriptionId' | 'description' | 'status' | 'insync' | 'note' +> & { + startDate: Date | null; + endDate: Date | null; + productName: string; + tag: string | null; +}; + export function mapGrapghQlSubscriptionsResultToSubscriptionListItems( graphqlResponse: SubscriptionsResult, ): SubscriptionListItem[] { diff --git a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/subscriptionListTabs.ts b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/subscriptionListTabs.ts index 43d4a127f..70feb7315 100644 --- a/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/subscriptionListTabs.ts +++ b/packages/orchestrator-ui-components/src/components/WFOSubscriptionsList/subscriptionListTabs.ts @@ -1,5 +1,6 @@ import { WFOFilterTab } from '../../components'; -import { SubscriptionListItem } from '../../types'; +import { SubscriptionListItem } from './mapGrapghQlSubscriptionsResultToSubscriptionListItems'; + export enum WFOSubscriptionsTabType { ACTIVE = 'ACTIVE', TERMINATED = 'TERMINATED', diff --git a/packages/orchestrator-ui-components/src/pages/subscriptions/WFOSubscriptionsListPage.tsx b/packages/orchestrator-ui-components/src/pages/subscriptions/WFOSubscriptionsListPage.tsx index 95a4b548a..cbabf8931 100644 --- a/packages/orchestrator-ui-components/src/pages/subscriptions/WFOSubscriptionsListPage.tsx +++ b/packages/orchestrator-ui-components/src/pages/subscriptions/WFOSubscriptionsListPage.tsx @@ -9,8 +9,8 @@ import { WFOSubscriptionsList, WFOSubscriptionsTabType, } from '../../components/WFOSubscriptionsList'; -import { SortOrder, SubscriptionListItem } from '../../types'; - +import { SortOrder } from '../../types'; +import { SubscriptionListItem } from '../../components/WFOSubscriptionsList'; import { StoredTableConfig } from '../../components/WFOTable'; import { SUBSCRIPTIONS_TABLE_LOCAL_STORAGE_KEY } from '../../components/WFOTable'; import { diff --git a/packages/orchestrator-ui-components/src/types/types.ts b/packages/orchestrator-ui-components/src/types/types.ts index 360598250..3a2accecf 100644 --- a/packages/orchestrator-ui-components/src/types/types.ts +++ b/packages/orchestrator-ui-components/src/types/types.ts @@ -346,16 +346,6 @@ export type Subscription = { product: Pick; }; -export type SubscriptionListItem = Pick< - Subscription, - 'subscriptionId' | 'description' | 'status' | 'insync' | 'note' -> & { - startDate: Date | null; - endDate: Date | null; - productName: string; - tag: string | null; -}; - export type SubscriptionDetail = { subscriptionId: string; description: string; @@ -381,6 +371,5 @@ export type SubscriptionDetail = { export type ExternalService = { externalServiceKey: string; externalServiceId: string; - // eslint-disable-next-line @typescript-eslint/no-explicit-any - externalServiceData: any; + externalServiceData: object; }; diff --git a/packages/orchestrator-ui-components/src/utils/getDefaultTableConfig.ts b/packages/orchestrator-ui-components/src/utils/getDefaultTableConfig.ts index 01e026950..e4ff963cb 100644 --- a/packages/orchestrator-ui-components/src/utils/getDefaultTableConfig.ts +++ b/packages/orchestrator-ui-components/src/utils/getDefaultTableConfig.ts @@ -15,9 +15,10 @@ import { ProductBlockDefinition, ProductDefinition, WorkflowDefinition, - SubscriptionListItem, } from '../types'; +import { SubscriptionListItem } from '../components/WFOSubscriptionsList'; + import { ProcessListItem } from '../components/WFOProcessesList/WFOProcessList'; function getTableConfig(