Skip to content

Commit

Permalink
Fix [Artifacts] Tree filter ignored after register artifact (#202)
Browse files Browse the repository at this point in the history
IvanVoznyi authored Jul 31, 2020

Verified

This commit was signed with the committer’s verified signature.
llwt Steven Nance
1 parent c113a7a commit 8628e29
Showing 8 changed files with 95 additions and 30 deletions.
7 changes: 6 additions & 1 deletion src/actions/artifacts.js
Original file line number Diff line number Diff line change
@@ -5,7 +5,8 @@ import {
FETCH_ARTIFACTS_FAILURE,
FETCH_ARTIFACTS_SUCCESS,
REMOVE_ARTIFACTS,
SHOW_ARTIFACT_PREVIEW
SHOW_ARTIFACT_PREVIEW,
SET_ARTIFACT_FILTER
} from '../constants'

const artifactsAction = {
@@ -48,6 +49,10 @@ const artifactsAction = {
type: FETCH_ARTIFACTS_FAILURE,
payload: error
}),
setArtifactFilter: filter => ({
type: SET_ARTIFACT_FILTER,
payload: filter
}),
showArtifactsPreview: item => ({
type: SHOW_ARTIFACT_PREVIEW,
payload: item
22 changes: 21 additions & 1 deletion src/components/Artifacts/Artifacts.js
Original file line number Diff line number Diff line change
@@ -17,6 +17,7 @@ import RegisterArtifactPopup from '../RegisterArtifactPopup/RegisterArtifactPopu
const Artifacts = ({
artifactsStore,
fetchArtifacts,
setArtifactFilter,
history,
match,
removeArtifacts
@@ -168,6 +169,23 @@ const Artifacts = ({
setSelectedArtifact({ item })
}

const handleArtifactFilterTree = useCallback(
item => {
const value = item.toLowerCase() !== 'latest' ? item.toLowerCase() : ''
fetchData({
tag: value,
project: match.params.projectName,
labels: artifactsStore.filter.labels,
name: artifactsStore.filter.name
})
setArtifactFilter({
...artifactsStore.filter,
tag: value || 'latest'
})
},
[fetchData, artifactsStore, match, setArtifactFilter]
)

const handleCancel = () => {
setSelectedArtifact({})
}
@@ -181,14 +199,16 @@ const Artifacts = ({
handleSelectItem={handleSelectArtifact}
loading={artifactsStore.loading}
match={match}
openPopupDialog={() => setIsPopupDialogOpen(true)}
pageData={pageData}
refresh={fetchData}
openPopupDialog={() => setIsPopupDialogOpen(true)}
selectedItem={selectedArtifact.item}
yamlContent={artifactsStore.artifacts}
handleArtifactFilterTree={handleArtifactFilterTree}
/>
{isPopupDialogOpen && (
<RegisterArtifactPopup
artifactFilter={artifactsStore.filter}
match={match}
refresh={fetchData}
setIsPopupDialogOpen={setIsPopupDialogOpen}
51 changes: 29 additions & 22 deletions src/components/FilterMenu/FilterMenu.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import PropTypes from 'prop-types'
import { useHistory } from 'react-router-dom'
import { useSelector, useDispatch } from 'react-redux'

import Select from '../../common/Select/Select'
import ArtifactFilterTree from '../ArtifactsFilterTree/ArtifactsFilterTree'
@@ -15,6 +16,8 @@ import { ReactComponent as Expand } from '../../images/expand.svg'

import { ARTIFACTS_PAGE, FUNCTIONS_PAGE, JOBS_PAGE } from '../../constants.js'

import artifactsAction from '../../actions/artifacts'

import artifactsData from '../Artifacts/artifactsData'
import { selectOptions, filterTreeOptions } from './filterMenu.settings'

@@ -23,50 +26,52 @@ import './filterMenu.scss'
const FilterMenu = ({
expand,
filters,
groupFilter,
handleArtifactFilterTree,
handleExpandAll,
match,
onChange,
page,
groupFilter,
setStateFilter,
setGroupFilter,
setStateFilter,
showUntagged,
stateFilter,
toggleShowUntagged
}) => {
const [valueFilterTree, setValueFilterTree] = useState('latest')
const [labels, setLabels] = useState('')
const [name, setName] = useState('')
const history = useHistory()
const artifactFilter = useSelector(store => store.artifactsStore.filter)
const dispatch = useDispatch()

if (page === JOBS_PAGE) {
selectOptions.groupBy.push({ label: 'Workflow', id: 'workflow' })
}

const handleChangeArtifactFilterTree = item => {
const value = item.toLowerCase() !== 'latest' ? item.toLowerCase() : ''
onChange({ tag: value, project: match.params.projectName, name, labels })
setValueFilterTree(value)
}

const onKeyDown = event => {
if (event.keyCode === 13) {
if (match.params.jobId || match.params.name) {
history.push(
`/projects/${match.params.projectName}/${page.toLowerCase()}`
)
}

page === ARTIFACTS_PAGE
? onChange({
tag: valueFilterTree,
project: match.params.projectName,
if (page === ARTIFACTS_PAGE) {
dispatch(
artifactsAction.setArtifactFilter({
...artifactFilter,
labels,
name
})
: page === JOBS_PAGE
? onChange({ labels, name })
: onChange({ name })
)
onChange({
tag: artifactFilter.tag !== 'latest' ? artifactFilter.tag : '',
project: match.params.projectName,
labels,
name
})
} else {
page === JOBS_PAGE ? onChange({ labels, name }) : onChange({ name })
}
}
}

@@ -82,9 +87,9 @@ const FilterMenu = ({
key={filter}
label="Tree:"
match={match}
onChange={handleChangeArtifactFilterTree}
onChange={handleArtifactFilterTree}
page={page}
value={valueFilterTree}
value={artifactFilter.tag}
/>
)
case 'labels':
@@ -150,7 +155,7 @@ const FilterMenu = ({
onClick={() => {
page === artifactsData.page
? onChange({
tag: valueFilterTree !== 'latest' ? valueFilterTree : '',
tag: artifactFilter.tag,
project: match.params.projectName,
labels,
name
@@ -179,8 +184,9 @@ const FilterMenu = ({

FilterMenu.defaultProps = {
groupFilter: '',
setStateFilter: null,
handleArtifactFilterTree: null,
setGroupFilter: null,
setStateFilter: null,
showUntagged: '',
stateFilter: '',
toggleShowUntagged: null
@@ -189,8 +195,9 @@ FilterMenu.defaultProps = {
FilterMenu.propTypes = {
filters: PropTypes.arrayOf(PropTypes.string).isRequired,
groupFilter: PropTypes.string,
setStateFilter: PropTypes.func,
handleArtifactFilterTree: PropTypes.func,
setGroupFilter: PropTypes.func,
setStateFilter: PropTypes.func,
showUntagged: PropTypes.string,
stateFilter: PropTypes.string,
toggleShowUntagged: PropTypes.func
20 changes: 16 additions & 4 deletions src/components/RegisterArtifactPopup/RegisterArtifactPopup.js
Original file line number Diff line number Diff line change
@@ -8,7 +8,12 @@ import { v4 as uuidv4 } from 'uuid'

import artifactApi from '../../api/artifacts-api'

const RegisterArtifactPopup = ({ match, refresh, setIsPopupDialogOpen }) => {
const RegisterArtifactPopup = ({
artifactFilter,
match,
refresh,
setIsPopupDialogOpen
}) => {
const [registerArtifactData, setRegisterArtifactData] = useState({
description: {
value: '',
@@ -108,9 +113,14 @@ const RegisterArtifactPopup = ({ match, refresh, setIsPopupDialogOpen }) => {
artifactApi
.registerArtifact(match.params.projectName, data)
.then(() => {
setIsPopupDialogOpen(false)
resetRegisterArtifactForm()
refresh({ project: match.params.projectName })
setIsPopupDialogOpen(false)
refresh({
project: match.params.projectName,
tag: artifactFilter.tag !== 'latest' ? artifactFilter.tag : '',
labels: artifactFilter.labels,
name: artifactFilter.name
})
})
.catch(err => {
setRegisterArtifactData(prevData => ({
@@ -126,7 +136,8 @@ const RegisterArtifactPopup = ({ match, refresh, setIsPopupDialogOpen }) => {
refresh,
registerArtifactData,
resetRegisterArtifactForm,
setIsPopupDialogOpen
setIsPopupDialogOpen,
artifactFilter
])

const closePopupDialog = useCallback(() => {
@@ -173,6 +184,7 @@ const RegisterArtifactPopup = ({ match, refresh, setIsPopupDialogOpen }) => {
}

RegisterArtifactPopup.propTypes = {
artifactFilter: PropTypes.shape({}).isRequired,
match: PropTypes.shape({}).isRequired,
refresh: PropTypes.func.isRequired,
setIsPopupDialogOpen: PropTypes.func.isRequired
1 change: 1 addition & 0 deletions src/constants.js
Original file line number Diff line number Diff line change
@@ -19,6 +19,7 @@ export const FETCH_ARTIFACTS_BEGIN = 'FETCH_ARTIFACTS_BEGIN'
export const FETCH_ARTIFACTS_FAILURE = 'FETCH_ARTIFACTS_FAILURE'
export const FETCH_ARTIFACTS_SUCCESS = 'FETCH_ARTIFACTS_SUCCESS'
export const REMOVE_ARTIFACTS = 'REMOVE_ARTIFACTS'
export const SET_ARTIFACT_FILTER = 'SET_ARTIFACT_FILTER'
export const SHOW_ARTIFACT_PREVIEW = 'SHOW_ARTIFACT_PREVIEW'

export const PROJECTS_PAGE = 'PROJECTS'
3 changes: 3 additions & 0 deletions src/layout/Content/Content.js
Original file line number Diff line number Diff line change
@@ -21,6 +21,7 @@ import './content.scss'
const Content = ({
content,
groupFilter,
handleArtifactFilterTree,
handleCancel,
handleSelectItem,
loading,
@@ -197,6 +198,7 @@ const Content = ({
expand={expand}
filters={pageData.filters}
groupFilter={groupFilter}
handleArtifactFilterTree={handleArtifactFilterTree}
handleExpandAll={handleExpandAll}
match={match}
onChange={refresh}
@@ -251,6 +253,7 @@ Content.defaultProps = {
Content.propTypes = {
content: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
groupFilter: PropTypes.string,
handleArtifactFilterTree: PropTypes.func,
handleCancel: PropTypes.func.isRequired,
handleSelectItem: PropTypes.func.isRequired,
loading: PropTypes.bool.isRequired,
15 changes: 13 additions & 2 deletions src/reducers/artifactReducer.js
Original file line number Diff line number Diff line change
@@ -4,14 +4,20 @@ import {
FETCH_ARTIFACTS_SUCCESS,
SHOW_ARTIFACT_PREVIEW,
CLOSE_ARTIFACT_PREVIEW,
REMOVE_ARTIFACTS
REMOVE_ARTIFACTS,
SET_ARTIFACT_FILTER
} from '../constants'

const initialState = {
artifacts: [],
loading: false,
error: null,
preview: {}
preview: {},
filter: {
tag: 'latest',
labels: '',
name: ''
}
}

export default (state = initialState, { type, payload }) => {
@@ -49,6 +55,11 @@ export default (state = initialState, { type, payload }) => {
...state,
preview: payload
}
case SET_ARTIFACT_FILTER:
return {
...state,
filter: payload
}
default:
return state
}
6 changes: 6 additions & 0 deletions src/utils/parseTargetPath.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,10 @@
export default targetPath => {
if (!targetPath) {
return {
schema: '',
path: ''
}
}
const index = targetPath.indexOf('://')
const target_path = {
schema: targetPath.includes('://') ? targetPath.slice(0, index) : '',

0 comments on commit 8628e29

Please sign in to comment.