use shared pipe component

This commit is contained in:
Dan Wilson 2023-09-04 15:51:29 +01:00
parent f7969d3bf5
commit 7cde39a7b4
6 changed files with 6 additions and 17 deletions

View File

@ -68,9 +68,4 @@
.triggerLayout {
align-items: center !important;
}
.divider {
color: var(--grey-300) !important;
font-size: 4px !important;
}
}

View File

@ -12,6 +12,5 @@ declare const styles: {
readonly author: string
readonly hash: string
readonly triggerLayout: string
readonly divider: string
}
export default styles

View File

@ -31,6 +31,7 @@ import { useGetRepositoryMetadata } from 'hooks/useGetRepositoryMetadata'
import { RepositoryPageHeader } from 'components/RepositoryPageHeader/RepositoryPageHeader'
import { ExecutionState, ExecutionStatus } from 'components/ExecutionStatus/ExecutionStatus'
import { getStatus } from 'utils/PipelineUtils'
import { PipeSeparator } from 'components/PipeSeparator/PipeSeparator'
import noExecutionImage from '../RepositoriesListing/no-repo.svg'
import css from './ExecutionList.module.scss'
@ -87,7 +88,7 @@ const ExecutionList = () => {
<Avatar email={record.author_email} name={record.author_name} size="small" hoverCard={false} />
{/* TODO need logic here for different trigger types */}
<Text className={css.author}>{`${record.author_name} triggered manually`}</Text>
<Text className={css.divider}>{`|`}</Text>
<PipeSeparator height={7} />
{/* TODO Will need to replace this with commit component - wont match Yifan designs */}
<a rel="noreferrer noopener" className={css.hash}>
{record.after}

View File

@ -54,11 +54,6 @@
width: 180px;
}
.divider {
color: var(--grey-300) !important;
font-size: 8px !important;
}
.statusIcon {
align-self: center !important;
}

View File

@ -12,7 +12,6 @@ declare const styles: {
readonly hash: string
readonly triggerLayout: string
readonly spacer: string
readonly divider: string
readonly statusIcon: string
}
export default styles

View File

@ -32,6 +32,7 @@ import { useGetRepositoryMetadata } from 'hooks/useGetRepositoryMetadata'
import { RepositoryPageHeader } from 'components/RepositoryPageHeader/RepositoryPageHeader'
import { ExecutionStatus, ExecutionState } from 'components/ExecutionStatus/ExecutionStatus'
import { getStatus } from 'utils/PipelineUtils'
import { PipeSeparator } from 'components/PipeSeparator/PipeSeparator'
import noPipelineImage from '../RepositoriesListing/no-repo.svg'
import css from './PipelineList.module.scss'
@ -100,9 +101,8 @@ const PipelineList = () => {
return record ? (
<Layout.Vertical spacing={'small'}>
<Layout.Horizontal spacing={'small'} style={{ alignItems: 'center' }}>
{/* TODO this icon need to depend on the status */}
<Text className={css.desc}>{`#${record.number}`}</Text>
<Text className={css.divider}>{`|`}</Text>
<PipeSeparator height={7} />
<Text className={css.desc}>{record.title}</Text>
</Layout.Horizontal>
<Layout.Horizontal spacing={'xsmall'} style={{ alignItems: 'center' }}>
@ -115,10 +115,10 @@ const PipelineList = () => {
/>
{/* TODO need logic here for different trigger types */}
<Text className={css.author}>{record.author_name}</Text>
<Text className={css.divider}>{`|`}</Text>
<PipeSeparator height={7} />
<GitFork height={12} width={12} color={Utils.getRealCSSColor(Color.GREY_500)} />
<Text className={css.author}>{record.source}</Text>
<Text className={css.divider}>{`|`}</Text>
<PipeSeparator height={7} />
{/* TODO Will need to replace this with commit component - wont match Yifan designs */}
<a rel="noreferrer noopener" className={css.hash}>
{/* {record.after} */}