Commit 30c8ed6a authored by Stefan Probst's avatar Stefan Probst
Browse files

fix: use category label on item detail screen

parent 3e65d296
......@@ -11,11 +11,20 @@ import { selectors } from '../../store/reducers'
import { createPath } from '../../utils'
import ItemEditScreen from '../ItemEditScreen/ItemEditScreen'
import ProtectedRoute from '../ProtectedRoute/ProtectedRoute'
import { fetchItemCategories } from '../../store/actions/itemCategories'
const ItemScreenContainer = ({ fetchItem, id }) => {
const dispatch = useDispatch()
const { path /*, url */ } = useRouteMatch()
useEffect(() => {
dispatch(fetchItemCategories())
}, [dispatch])
const itemCategories = useSelector(state =>
selectors.itemCategories.selectAllResources(state)
)
useEffect(() => {
dispatch(fetchItem({ id }))
}, [dispatch, fetchItem, id])
......@@ -36,13 +45,17 @@ const ItemScreenContainer = ({ fetchItem, id }) => {
<ItemEditScreen request={request} resource={resource} />
</ProtectedRoute>
<Route>
<ItemScreen request={request} resource={resource} />
<ItemScreen
request={request}
resource={resource}
itemCategories={itemCategories}
/>
</Route>
</Switch>
)
}
export const ItemScreen = ({ request, resource }) => (
export const ItemScreen = ({ request, resource, itemCategories }) => (
<Flex css={css({ my: 6 })}>
<Box css={{ flex: 3 }}>
<ItemDetails request={request} resource={resource} />
......@@ -56,7 +69,7 @@ export const ItemScreen = ({ request, resource }) => (
minWidth: 0,
})}
>
<ItemSidebar resource={resource} />
<ItemSidebar resource={resource} itemCategories={itemCategories} />
</aside>
</Flex>
)
......
......@@ -7,7 +7,7 @@ import Icon from '../../elements/Icon/Icon'
import Link from '../../elements/Link/Link'
import Stack from '../../elements/Stack/Stack'
const ItemSidebar = ({ resource }) => {
const ItemSidebar = ({ resource, itemCategories }) => {
if (!resource) return null
const properties = resource.properties.reduce((acc, property) => {
......@@ -23,13 +23,13 @@ const ItemSidebar = ({ resource }) => {
return acc
}, {})
const [type] = properties['object-type'].values
const type = itemCategories?.[resource.category] || 'Resource'
const links = [
{
label: (
<>
Go to {type || 'Resource'}{' '}
Go to {type}{' '}
<Icon
css={css({
alignSelf: 'flex-start',
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment