All files / modules/75-cf/pages/segment-details/segment-settings SegmentSettings.tsx

100% Statements 12/12
70% Branches 7/10
100% Functions 1/1
100% Lines 11/11

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              1x 1x 1x   1x 1x 1x 1x 1x             1x 4x   4x                                                            
/*
 * Copyright 2021 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 from 'react'
import { Container, Tab, Tabs, Text } from '@wings-software/uicore'
import { useStrings } from 'framework/strings'
import type { Feature, Segment } from 'services/cf'
import StringWithTooltip from '@common/components/StringWithTooltip/StringWithTooltip'
import { AuditLogs } from '@cf/components/AuditLogs/AuditLogs'
import { AuditLogObjectType } from '@cf/utils/CFUtils'
import { SegmentRules } from '../SegmentRules'
import css from './SegmentSettings.module.scss'
 
interface SegmentSettingsProps {
  segment?: Segment | undefined | null
  onUpdate: () => void
}
 
export const SegmentSettings: React.FC<SegmentSettingsProps> = ({ segment, onUpdate }) => {
  const { getString } = useStrings()
 
  return (
    <Container height="100%" width="100%" style={{ overflow: 'auto', background: '#fcfdfd' }}>
      <Container className={css.tabContainer}>
        <Tabs id="targetSettings">
          <Tab
            id="attributes"
            title={
              <Text className={css.tabTitle}>
                <StringWithTooltip stringId="cf.shared.rules" tooltipId="ff_segmentRules_heading" />
              </Text>
            }
            panel={segment ? <SegmentRules segment={segment} onUpdate={onUpdate} /> : undefined}
          />
          <Tab
            id="segments"
            title={<Text className={css.tabTitle}>{getString('activityLog')}</Text>}
            panel={
              <Container style={{ marginTop: '-20px', height: 'calc(100vh - 217px)', overflow: 'auto' }}>
                <AuditLogs
                  flagData={{ name: segment?.name, identifier: segment?.identifier } as Feature}
                  objectType={AuditLogObjectType.Segment}
                />
              </Container>
            }
          />
        </Tabs>
      </Container>
    </Container>
  )
}