Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 | 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 4x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 2x | /*
* Copyright 2022 Harness Inc. All rights reserved.
* Use of this source code is governed by the PolyForm Shield 1.0.0 license
* that can be found in the licenses directory at the root of this repository, also available at
* https://polyformproject.org/wp-content/uploads/2020/06/PolyForm-Shield-1.0.0.txt.
*/
import React, { useEffect, useState } from 'react'
import { Container, Text, PageError, PageSpinner, Collapse, getErrorInfoFromErrorObject } from '@wings-software/uicore'
import { Color, FontVariation } from '@harness/design-system'
import { useParams } from 'react-router-dom'
import type { IconProps } from '@harness/uicore/dist/icons/Icon'
import { useStrings } from 'framework/strings'
import type { AccountPathProps } from '@common/interfaces/RouteInterfaces'
import {
useListAccountSetting,
ConnectorSettings as ConnectorSettingsDTO,
AccountSettings as AccountSettingsDTO
} from 'services/cd-ng'
import ConnectorSettings from './connector/ConnectorSettings'
import css from './AccountSettings.module.scss'
interface SettingConfig {
type: AccountSettingsDTO['type']
title: string
component: JSX.Element
}
export enum AccountSettingType {
CONNECTOR = 'Connector'
}
const AccountSettings: React.FC = () => {
const { getString } = useStrings()
const { accountId } = useParams<AccountPathProps>()
const {
data,
loading,
refetch: refetchAccountSettings,
error
} = useListAccountSetting({ queryParams: { accountIdentifier: accountId } })
const [disableBuiltInSM, setDisableBuiltInSM] = useState<boolean>(false)
const SETTINGS_CONFIG: SettingConfig[] = [
{
type: AccountSettingType.CONNECTOR,
title: getString('connectorsLabel'),
component: <ConnectorSettings disableBuiltInSM={disableBuiltInSM} onChange={setDisableBuiltInSM} />
}
]
useEffect(() => {
Eif (!loading && data) {
const connectorSetting = data?.data?.filter(item => item.type === AccountSettingType.CONNECTOR)
setDisableBuiltInSM(
connectorSetting && connectorSetting.length === 1
? !!(connectorSetting[0].config as ConnectorSettingsDTO)?.builtInSMDisabled
: false
)
}
}, [data, loading])
Iif (loading) {
return <PageSpinner />
}
Iif (error) {
return (
<Container height={300}>
<PageError message={getErrorInfoFromErrorObject(error)} onClick={() => refetchAccountSettings()} />
</Container>
)
}
return (
<Container margin="xlarge" padding="xlarge" background="white" className={css.container}>
<Text color={Color.BLACK} font={{ variation: FontVariation.H5 }} margin={{ bottom: 'xlarge' }}>
{getString('settingsLabel')}
</Text>
{SETTINGS_CONFIG.map(item => {
return (
<Collapse
data-testid={`collapse-${item.type}`}
key={item.type}
collapsedIcon="main-chevron-down"
expandedIcon="main-chevron-up"
isRemovable={false}
iconProps={{ size: 12, color: Color.PRIMARY_7 } as IconProps}
collapseClassName={css.collapseWrap}
heading={
<Text font={{ variation: FontVariation.H6 }} margin={{ left: 'small' }}>
{item.title}
</Text>
}
>
{item.component}
</Collapse>
)
})}
</Container>
)
}
export default AccountSettings
|