Commit a3b6e221 authored by Stefan Probst's avatar Stefan Probst
Browse files

feat: add document title for item detail view

parent f29bb521
Pipeline #154442 failed with stages
in 54 minutes and 22 seconds
import css from '@styled-system/css'
import React, { useEffect } from 'react'
import React, { Fragment, useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { Route, Switch, useRouteMatch } from 'react-router-dom'
import 'styled-components/macro'
......@@ -12,6 +12,7 @@ import { createPath } from '../../utils'
import ItemEditScreen from '../ItemEditScreen/ItemEditScreen'
import ProtectedRoute from '../ProtectedRoute/ProtectedRoute'
import { fetchItemCategories } from '../../store/actions/itemCategories'
import Helmet from 'react-helmet'
const ItemScreenContainer = ({ fetchItem, id }) => {
const dispatch = useDispatch()
......@@ -56,26 +57,36 @@ const ItemScreenContainer = ({ fetchItem, id }) => {
}
export const ItemScreen = ({ request, resource, itemCategories }) => (
<Flex css={css({ my: 6 })}>
<Box css={{ flex: 3 }}>
<ItemDetails
request={request}
resource={resource}
itemCategories={itemCategories}
/>
</Box>
<aside
css={css({
flexBasis: 'sidebar',
flexGrow: 0,
flexShrink: 1,
pl: 4,
minWidth: 0,
})}
>
<ItemSidebar resource={resource} itemCategories={itemCategories} />
</aside>
</Flex>
<Fragment>
<Helmet
title={[
resource ? resource.label : undefined,
'Social Sciences & Humanities Open Marketplace',
]
.filter(Boolean)
.join(' | ')}
/>
<Flex css={css({ my: 6 })}>
<Box css={{ flex: 3 }}>
<ItemDetails
request={request}
resource={resource}
itemCategories={itemCategories}
/>
</Box>
<aside
css={css({
flexBasis: 'sidebar',
flexGrow: 0,
flexShrink: 1,
pl: 4,
minWidth: 0,
})}
>
<ItemSidebar resource={resource} itemCategories={itemCategories} />
</aside>
</Flex>
</Fragment>
)
export default ItemScreenContainer
import css from '@styled-system/css'
import React from 'react'
import React, { Fragment } from 'react'
import 'styled-components/macro'
import SearchBar from '../../components/SearchBar/SearchBar'
import Breadcrumbs from '../../elements/Breadcrumbs/Breadcrumbs'
import Container from '../../elements/Container/Container'
import Flex from '../../elements/Flex/Flex'
import Helmet from 'react-helmet'
const Screen = ({
breadcrumbs,
......@@ -12,18 +13,21 @@ const Screen = ({
onSearchParamsChange,
searchParams,
}) => (
<Container
as={Flex}
css={css({ flexDirection: 'column', height: '100%', pb: 0 })}
>
<SearchBar
css={{ alignSelf: 'flex-end', width: '50%' }}
onSearchParamsChange={onSearchParamsChange}
{...searchParams}
/>
<Breadcrumbs paths={breadcrumbs} />
{children}
</Container>
<Fragment>
<Helmet title={'Social Sciences & Humanities Open Marketplace'} />
<Container
as={Flex}
css={css({ flexDirection: 'column', height: '100%', pb: 0 })}
>
<SearchBar
css={{ alignSelf: 'flex-end', width: '50%' }}
onSearchParamsChange={onSearchParamsChange}
{...searchParams}
/>
<Breadcrumbs paths={breadcrumbs} />
{children}
</Container>
</Fragment>
)
export default Screen
import React from 'react'
import React, { Fragment } from 'react'
import 'styled-components/macro'
import HomeScreen from '../../components/HomeScreen/HomeScreen'
import Container from '../../elements/Container/Container'
......@@ -6,26 +6,32 @@ import Main from '../../elements/Main/Main'
import BackgroundImage from '../../images/bg_home.jpg'
import BackgroundImageHiDPI from '../../images/bg_home@2x.jpg'
import { useNavigationFocusScroll } from '../../utils'
import Helmet from 'react-helmet'
const HomePage = () => {
const focusRef = useNavigationFocusScroll()
return (
<Main
css={{
backgroundImage: `url(${
window.devicePixelRatio >= 1 ? BackgroundImageHiDPI : BackgroundImage
})`,
backgroundSize: 'contain',
backgroundPosition: 'top center',
backgroundRepeat: 'no-repeat',
}}
ref={focusRef}
>
<Container>
<HomeScreen />
</Container>
</Main>
<Fragment>
<Helmet title={'Social Sciences & Humanities Open Marketplace'} />
<Main
css={{
backgroundImage: `url(${
window.devicePixelRatio >= 1
? BackgroundImageHiDPI
: BackgroundImage
})`,
backgroundSize: 'contain',
backgroundPosition: 'top center',
backgroundRepeat: 'no-repeat',
}}
ref={focusRef}
>
<Container>
<HomeScreen />
</Container>
</Main>
</Fragment>
)
}
......
import React from 'react'
import React, { Fragment } from 'react'
import 'styled-components/macro'
import Container from '../../elements/Container/Container'
import Heading from '../../elements/Heading/Heading'
import Main from '../../elements/Main/Main'
import { useNavigationFocusScroll } from '../../utils'
import Helmet from 'react-helmet'
const NotFoundPage = () => {
const focusRef = useNavigationFocusScroll()
return (
<Main ref={focusRef}>
<Container>
<Heading>Not Found</Heading>
</Container>
</Main>
<Fragment>
<Helmet
title={'Not Found | Social Sciences & Humanities Open Marketplace'}
/>
<Main ref={focusRef}>
<Container>
<Heading>Not Found</Heading>
</Container>
</Main>
</Fragment>
)
}
......
......@@ -13269,6 +13269,11 @@ react-fast-compare@^2.0.4:
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
 
react-fast-compare@^3.1.1:
version "3.2.0"
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
react-focus-lock@^1.18.3:
version "1.19.1"
resolved "https://registry.yarnpkg.com/react-focus-lock/-/react-focus-lock-1.19.1.tgz#2f3429793edaefe2d077121f973ce5a3c7a0651a"
......@@ -13290,6 +13295,16 @@ react-helmet-async@^1.0.2:
react-fast-compare "^2.0.4"
shallowequal "^1.1.0"
 
react-helmet@^6.1.0:
version "6.1.0"
resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.1.0.tgz#a750d5165cb13cf213e44747502652e794468726"
integrity sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==
dependencies:
object-assign "^4.1.1"
prop-types "^15.7.2"
react-fast-compare "^3.1.1"
react-side-effect "^2.1.0"
react-hotkeys@2.0.0-pre4:
version "2.0.0-pre4"
resolved "https://registry.yarnpkg.com/react-hotkeys/-/react-hotkeys-2.0.0-pre4.tgz#a1c248a51bdba4282c36bf3204f80d58abc73333"
......@@ -13469,6 +13484,11 @@ react-select@^3.0.0:
react-input-autosize "^2.2.2"
react-transition-group "^2.2.1"
 
react-side-effect@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-2.1.0.tgz#1ce4a8b4445168c487ed24dab886421f74d380d3"
integrity sha512-IgmcegOSi5SNX+2Snh1vqmF0Vg/CbkycU9XZbOHJlZ6kMzTmi3yc254oB1WCkgA7OQtIAoLmcSFuHTc/tlcqXg==
react-sizeme@^2.5.2, react-sizeme@^2.6.7:
version "2.6.10"
resolved "https://registry.yarnpkg.com/react-sizeme/-/react-sizeme-2.6.10.tgz#9993dcb5e67fab94a8e5d078a0d3820609010f17"
......
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