-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(deal/ticket/task): first stage has recursive refresh on pipeline,…
- Loading branch information
1 parent
826f2dd
commit 9855f26
Showing
32 changed files
with
644 additions
and
502 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
import { colors } from 'modules/common/styles'; | ||
import { highlight } from 'modules/common/utils/animations'; | ||
import React from 'react'; | ||
import styled from 'styled-components'; | ||
import styledTS from 'styled-components-ts'; | ||
|
||
type Props = { | ||
width?: string; | ||
}; | ||
|
||
const Spin = styledTS<Props>(styled.div)` | ||
position: absolute; | ||
overflow: auto; | ||
height: 100%; | ||
width: ${props => props.width}; | ||
z-index: 99999; | ||
display: ${'flex'}; | ||
`; | ||
|
||
export const MainLoader = styledTS<Props>(styled.div)` | ||
width: 100%; | ||
height: 100%; | ||
animation: ${highlight} 0.75s linear infinite; | ||
border-top: 2px solid ${colors.borderDarker}; | ||
border-top-color: ${colors.colorSecondary}; | ||
`; | ||
|
||
function DragDisabler({ width = '100%' }: Props) { | ||
return ( | ||
<Spin width={width}> | ||
<MainLoader width={width} /> | ||
</Spin> | ||
); | ||
} | ||
|
||
export default DragDisabler; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,30 +1,69 @@ | ||
import gql from 'graphql-tag'; | ||
import * as compose from 'lodash.flowright'; | ||
import EmptyState from 'modules/common/components/EmptyState'; | ||
import { IRouterProps } from 'modules/common/types'; | ||
import { withProps } from 'modules/common/utils'; | ||
import React from 'react'; | ||
import { graphql } from 'react-apollo'; | ||
import { withRouter } from 'react-router-dom'; | ||
import { queries } from '../graphql'; | ||
import { RootBack, ScrolledContent } from '../styles/common'; | ||
import { IOptions, IPipeline } from '../types'; | ||
import { IOptions, PipelineDetailQueryResponse } from '../types'; | ||
import Pipeline from './Pipeline'; | ||
import withPipeline from './withPipeline'; | ||
|
||
type Props = { | ||
queryParams: any; | ||
options: IOptions; | ||
pipeline: IPipeline; | ||
}; | ||
pipelineDetailQuery: PipelineDetailQueryResponse; | ||
} & WrapperProps & | ||
IRouterProps; | ||
|
||
const Board = (props: Props) => { | ||
const { pipeline, queryParams, options } = props; | ||
class Board extends React.Component<Props> { | ||
render() { | ||
const { pipelineDetailQuery, queryParams, options } = this.props; | ||
|
||
return ( | ||
<RootBack style={{ backgroundColor: pipeline.bgColor }}> | ||
<ScrolledContent> | ||
<Pipeline | ||
options={options} | ||
pipeline={pipeline} | ||
key={pipeline._id} | ||
queryParams={queryParams} | ||
if (!pipelineDetailQuery || !pipelineDetailQuery.pipelineDetail) { | ||
return ( | ||
<EmptyState | ||
image="/images/actions/18.svg" | ||
text="Oh boy, looks like you need to get a head start on your board" | ||
size="small" | ||
light={true} | ||
/> | ||
</ScrolledContent> | ||
</RootBack> | ||
); | ||
); | ||
} | ||
|
||
const pipeline = pipelineDetailQuery.pipelineDetail; | ||
|
||
return ( | ||
<RootBack style={{ backgroundColor: pipeline.bgColor }}> | ||
<ScrolledContent> | ||
<Pipeline | ||
options={options} | ||
pipeline={pipeline} | ||
key={pipeline._id} | ||
queryParams={queryParams} | ||
/> | ||
</ScrolledContent> | ||
</RootBack> | ||
); | ||
} | ||
} | ||
|
||
type WrapperProps = { | ||
queryParams: any; | ||
options: IOptions; | ||
}; | ||
|
||
export default withPipeline(Board); | ||
export default withProps<WrapperProps>( | ||
compose( | ||
graphql<WrapperProps, PipelineDetailQueryResponse, { _id?: string }>( | ||
gql(queries.pipelineDetail), | ||
{ | ||
name: 'pipelineDetailQuery', | ||
skip: ({ queryParams }) => !queryParams.pipelineId, | ||
options: ({ queryParams }) => ({ | ||
variables: { _id: queryParams && queryParams.pipelineId } | ||
}) | ||
} | ||
) | ||
)(withRouter(Board)) | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,92 @@ | ||
import gql from 'graphql-tag'; | ||
import * as compose from 'lodash.flowright'; | ||
import { IRouterProps } from 'modules/common/types'; | ||
import { withProps } from 'modules/common/utils'; | ||
import routerUtils from 'modules/common/utils/router'; | ||
import React from 'react'; | ||
import { graphql } from 'react-apollo'; | ||
import { withRouter } from 'react-router-dom'; | ||
import { DetailQueryResponse, IOptions } from '../types'; | ||
import { EditForm } from './editForm'; | ||
|
||
type WrapperProps = { | ||
itemId: string; | ||
options: IOptions; | ||
}; | ||
|
||
type FinalProps = WrapperProps & | ||
IRouterProps & { | ||
detailQuery: DetailQueryResponse; | ||
}; | ||
|
||
class InvisibleItemInUrl extends React.PureComponent<FinalProps> { | ||
beforePopupClose = () => { | ||
const { history } = this.props; | ||
|
||
routerUtils.removeParams(history, 'itemId'); | ||
}; | ||
|
||
render() { | ||
const { options, itemId, detailQuery } = this.props; | ||
|
||
if (detailQuery.loading) { | ||
return null; | ||
} | ||
|
||
const item = detailQuery[options.queriesName.detailQuery]; | ||
|
||
if (!item) { | ||
return null; | ||
} | ||
|
||
return ( | ||
<EditForm | ||
itemId={itemId} | ||
options={options} | ||
isPopupVisible={true} | ||
stageId={item.stageId} | ||
hideHeader={true} | ||
beforePopupClose={this.beforePopupClose} | ||
/> | ||
); | ||
} | ||
} | ||
|
||
const withQuery = (props: WrapperProps) => { | ||
const { options } = props; | ||
|
||
return withProps<WrapperProps>( | ||
compose( | ||
graphql<WrapperProps, DetailQueryResponse, { _id: string }>( | ||
gql(options.queries.detailQuery), | ||
{ | ||
name: 'detailQuery', | ||
options: ({ itemId }: { itemId: string }) => { | ||
return { | ||
variables: { | ||
_id: itemId | ||
}, | ||
fetchPolicy: 'network-only' | ||
}; | ||
} | ||
} | ||
) | ||
)(withRouter(InvisibleItemInUrl)) | ||
); | ||
}; | ||
|
||
export default class WithData extends React.Component<WrapperProps> { | ||
private withQuery; | ||
|
||
constructor(props) { | ||
super(props); | ||
|
||
this.withQuery = withQuery(props); | ||
} | ||
|
||
render() { | ||
const Component = this.withQuery; | ||
|
||
return <Component {...this.props} />; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.