All files / modules/10-common/pages/entityUsage EntityUsage.tsx

76.19% Statements 16/21
55% Branches 22/40
33.33% Functions 2/6
76.19% Lines 16/21

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              20x 20x 20x 20x         20x     20x 20x             20x 5x 5x 5x 5x   5x                             5x                                                         8x                                 20x  
/*
 * 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, { useState } from 'react'
import { useParams } from 'react-router-dom'
import { Layout, Container, ExpandingSearchInput, PageHeader, PageBody } from '@wings-software/uicore'
import {
  useListReferredByEntities,
  ResponsePageEntitySetupUsageDTO,
  ListReferredByEntitiesQueryParams
} from 'services/cd-ng'
import { useStrings } from 'framework/strings'
import type { ProjectPathProps } from '@common/interfaces/RouteInterfaces'
import type { UseGetMockData } from '@common/utils/testUtils'
import EntityUsageList from './views/EntityUsageListView/EntityUsageList'
import css from './EntityUsage.module.scss'
 
interface EntityUsageProps {
  entityIdentifier: string
  entityType: ListReferredByEntitiesQueryParams['referredEntityType']
  mockData?: UseGetMockData<ResponsePageEntitySetupUsageDTO>
}
const EntityUsage: React.FC<EntityUsageProps> = props => {
  const { accountId, orgIdentifier, projectIdentifier } = useParams<ProjectPathProps>()
  const { getString } = useStrings()
  const [searchTerm, setSearchTerm] = useState<string | undefined>()
  const [page, setPage] = useState(0)
 
  const { data, loading, refetch, error } = useListReferredByEntities({
    queryParams: {
      accountIdentifier: accountId,
      projectIdentifier: projectIdentifier,
      orgIdentifier: orgIdentifier,
      identifier: props.entityIdentifier,
      referredEntityType: props.entityType,
      searchTerm: searchTerm,
      pageIndex: page,
      pageSize: 10
    },
    debounce: 300,
    mock: props.mockData
  })
 
  return (
    <>
      <PageHeader
        className={css.secondHeader}
        size="standard"
        title={undefined}
        toolbar={
          <Container>
            <Layout.Horizontal>
              <ExpandingSearchInput
                alwaysExpanded
                onChange={text => {
                  setPage(0)
                  setSearchTerm(text.trim())
                }}
                className={css.search}
                width={350}
              />
            </Layout.Horizontal>
          </Container>
        }
      />
      <PageBody
        loading={loading}
        retryOnError={() => refetch()}
        error={(error?.data as Error)?.message || error?.message}
        noData={
          !searchTerm
            ? {
                when: () => !data?.data?.content?.length,
                icon: 'nav-project',
                message: getString('common.noRefData')
              }
            : {
                when: () => !data?.data?.content?.length,
                icon: 'nav-project',
                message: getString('entityReference.noRecordFound')
              }
        }
      >
        <EntityUsageList entityData={data} gotoPage={pageNumber => setPage(pageNumber)} />
      </PageBody>
    </>
  )
}
 
export default EntityUsage