Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
SSHOC
sshoc-marketplace-frontend
Commits
3e65d296
Commit
3e65d296
authored
Sep 16, 2020
by
Stefan Probst
Browse files
fix: use item category labels from backend
parent
67bcd186
Changes
7
Hide whitespace changes
Inline
Side-by-side
src/api/index.js
View file @
3e65d296
import
{
API_BASE_URL
}
from
'
../constants
'
const
createMarketplaceAPI
=
({
baseUrl
,
prefix
=
'
/api
'
})
=>
({
getItemCategories
:
()
=>
({
baseUrl
,
method
:
'
get
'
,
path
:
`
${
prefix
}
/items-categories/`
,
}),
getWorkflowById
:
({
id
})
=>
({
baseUrl
,
method
:
'
get
'
,
...
...
src/components/SearchResult/SearchResult.js
View file @
3e65d296
...
...
@@ -45,7 +45,7 @@ export const SearchResultPlaceholder = () => (
<
/SearchResultContainer
>
)
const
SearchResult
=
({
result
})
=>
(
const
SearchResult
=
({
result
,
itemCategories
})
=>
(
<
SearchResultContainer
>
<
Box
css
=
{{
flexBasis
:
80
,
flexGrow
:
0
,
flexShrink
:
0
}}
>
<
Icon
icon
=
{
result
.
category
}
width
=
"
3em
"
height
=
"
3em
"
/>
...
...
@@ -65,13 +65,7 @@ const SearchResult = ({ result }) => (
<
/Heading
>
<
/Link
>
<
/Box
>
<
Badge
>
{
result
.
properties
.
find
(
property
=>
property
.
type
.
code
===
'
object-type
'
).
concept
.
label
}
<
/Badge
>
<
Badge
>
{
itemCategories
?.[
result
.
category
]
||
''
}
<
/Badge
>
<
/Flex
>
<
Box
css
=
{
css
({
my
:
2
})}
>
<
Text
css
=
{
css
({
color
:
'
grey.900
'
})}
size
=
"
small
"
>
...
...
src/components/SearchResults/SearchResults.js
View file @
3e65d296
...
...
@@ -62,13 +62,13 @@ const SearchResultsHeader = ({
<
/Flex
>
)
const
SearchResultsList
=
({
request
,
results
})
=>
{
const
SearchResultsList
=
({
request
,
results
,
itemCategories
})
=>
{
if
(
results
&&
results
.
length
)
{
return
(
<
Stack
as
=
"
ul
"
>
{
results
.
map
(
result
=>
(
<
li
key
=
{
result
.
id
}
>
<
SearchResult
result
=
{
result
}
/
>
<
SearchResult
result
=
{
result
}
itemCategories
=
{
itemCategories
}
/
>
<
/li
>
))}
<
/Stack
>
...
...
@@ -113,6 +113,7 @@ const SearchResults = ({
request
,
results
,
searchParams
,
itemCategories
,
})
=>
{
const
{
categories
,
page
,
query
,
sort
,
facets
}
=
searchParams
...
...
@@ -189,7 +190,11 @@ const SearchResults = ({
page
=
{
page
}
sort
=
{
sort
}
/
>
<
SearchResultsList
request
=
{
request
}
results
=
{
results
}
/
>
<
SearchResultsList
request
=
{
request
}
results
=
{
results
}
itemCategories
=
{
itemCategories
}
/
>
<
Pagination
aria
-
label
=
"
Search results pages
"
css
=
{
css
({
alignSelf
:
'
flex-end
'
,
my
:
4
})}
...
...
src/components/SearchScreen/SearchScreen.js
View file @
3e65d296
...
...
@@ -7,6 +7,7 @@ import SearchResults from '../../components/SearchResults/SearchResults'
import
Flex
from
'
../../elements/Flex/Flex
'
import
Heading
from
'
../../elements/Heading/Heading
'
import
{
fetchSearchResults
}
from
'
../../store/actions/items
'
import
{
fetchItemCategories
}
from
'
../../store/actions/itemCategories
'
import
{
selectors
}
from
'
../../store/reducers
'
const
SearchScreenContainer
=
({
onSearchParamsChange
,
searchParams
})
=>
{
...
...
@@ -14,6 +15,14 @@ const SearchScreenContainer = ({ onSearchParamsChange, searchParams }) => {
const
{
categories
,
facets
,
page
,
query
,
sort
}
=
searchParams
useEffect
(()
=>
{
dispatch
(
fetchItemCategories
())
},
[
dispatch
])
const
itemCategories
=
useSelector
(
state
=>
selectors
.
itemCategories
.
selectAllResources
(
state
)
)
const
request
=
useSelector
(
state
=>
selectors
.
requests
.
selectRequestByName
(
state
,
{
name
:
fetchSearchResults
,
...
...
@@ -64,6 +73,7 @@ const SearchScreenContainer = ({ onSearchParamsChange, searchParams }) => {
request
=
{
request
}
results
=
{
results
}
searchParams
=
{
searchParams
}
itemCategories
=
{
itemCategories
}
/
>
)
}
...
...
@@ -86,6 +96,7 @@ export const SearchScreen = ({
request
,
results
,
searchParams
,
itemCategories
,
})
=>
(
<>
<
Heading
variant
=
"
h1
"
css
=
{
css
({
mt
:
4
})}
>
...
...
@@ -107,6 +118,7 @@ export const SearchScreen = ({
request
=
{
request
}
results
=
{
results
}
searchParams
=
{
searchParams
}
itemCategories
=
{
itemCategories
}
/
>
<
/Flex
>
<
/
>
...
...
src/store/actions/itemCategories.js
0 → 100644
View file @
3e65d296
import
API
,
{
getErrorMessage
}
from
'
../../api
'
import
{
API_REQUEST
,
FETCH_RESOURCE
}
from
'
../constants
'
export
const
fetchItemCategories
=
()
=>
({
type
:
API_REQUEST
,
payload
:
{
...
API
.
getItemCategories
(),
},
meta
:
{
getErrorMessage
,
next
:
FETCH_RESOURCE
,
normalize
:
data
=>
({
entities
:
{
itemCategories
:
Object
.
keys
(
data
)
},
resources
:
{
itemCategories
:
data
},
}),
request
:
{
name
:
'
fetchItemCategories
'
,
},
},
})
fetchItemCategories
.
toString
=
()
=>
'
fetchItemCategories
'
src/store/reducers/index.js
View file @
3e65d296
...
...
@@ -23,6 +23,10 @@ const {
reducer
:
conceptReducer
,
selectors
:
conceptSelectors
,
}
=
createResourceSlice
(
'
concepts
'
)
const
{
reducer
:
itemCategoriesReducer
,
selectors
:
itemCategoriesSelectors
,
}
=
createResourceSlice
(
'
itemCategories
'
)
const
{
reducer
:
requestReducer
,
...
...
@@ -43,6 +47,7 @@ export const selectors = {
),
items
:
mapSelectors
(
itemSelectors
,
'
items
'
),
itemCollections
:
mapSelectors
(
itemCollectionSelectors
,
'
itemCollections
'
),
itemCategories
:
mapSelectors
(
itemCategoriesSelectors
,
'
itemCategories
'
),
requests
:
mapSelectors
(
requestSelectors
,
'
requests
'
),
toasts
:
mapSelectors
(
toastSelectors
,
'
toasts
'
),
user
:
mapSelectors
(
userSelectors
,
'
user
'
),
...
...
@@ -53,6 +58,7 @@ export default combineReducers({
conceptCollections
:
conceptCollectionReducer
,
items
:
itemReducer
,
itemCollections
:
itemCollectionReducer
,
itemCategories
:
itemCategoriesReducer
,
requests
:
requestReducer
,
toasts
:
toastReducer
,
user
:
userReducer
,
...
...
src/store/utils/createResourceSlice.js
View file @
3e65d296
...
...
@@ -35,6 +35,9 @@ export const createResourceSlice = resourceName => {
if
(
!
Array
.
isArray
(
ids
))
return
null
return
ids
.
map
(
id
=>
state
[
id
]).
filter
(
Boolean
)
},
selectAllResources
(
state
)
{
return
state
},
}
return
{
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment