maverick/flex-template-web
1
0
Fork 0
mirror of https://github.com/kingomarnajjar/flex-template-web.git synced 2026-07-28 12:43:11 +10:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add internal link to the host section in ListingPage

Browse source
This commit is contained in:
Kimmo Puputti 2017-11-08 10:02:00 +02:00
parent dc54d9aa1d
commit 798df231da
3 changed files with 112 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/containers/ListingPage/ListingPage.css
View file

@ -318,6 +318,10 @@
}
}
.authorNameLink {
color: var(--matterColor);
}
.descriptionContainer {
padding: 0 24px;
margin-bottom: 35px;

34
src/containers/ListingPage/ListingPage.js
View file

@ -364,6 +364,17 @@ export class ListingPageComponent extends Component {
{ title, price: formattedPrice, siteTitle }
);
const hostLink = (
<NamedLink
className={css.authorNameLink}
name="ListingPage"
params={params}
to={{ hash: '#host' }}
>
{currentAuthorDisplayName}
</NamedLink>
);
return (
<Page
title={schemaTitle}
@ -417,8 +428,20 @@ export class ListingPageComponent extends Component {
<div className={css.contentContainer}>
<div className={css.avatarWrapper}>
<AvatarLarge user={currentAuthor} className={css.avatarDesktop} />
<AvatarMedium user={currentAuthor} className={css.avatarMobile} />
<NamedLink name="ListingPage" params={params} to={{ hash: '#host' }}>
<AvatarLarge
user={currentAuthor}
className={css.avatarDesktop}
disableProfileLink
/>
</NamedLink>
<NamedLink name="ListingPage" params={params} to={{ hash: '#host' }}>
<AvatarMedium
user={currentAuthor}
className={css.avatarMobile}
disableProfileLink
/>
</NamedLink>
</div>
<div className={css.mainContent}>
@ -434,12 +457,7 @@ export class ListingPageComponent extends Component {
<div className={css.heading}>
<h1 className={css.title}>{title}</h1>
<div className={css.author}>
<span className={css.authorName}>
<FormattedMessage
id="ListingPage.hostedBy"
values={{ name: currentAuthorDisplayName }}
/>
</span>
<FormattedMessage id="ListingPage.hostedBy" values={{ name: hostLink }} />
</div>
</div>
</div>

119
src/containers/ListingPage/__snapshots__/ListingPage.test.js.snap
View file

@ -97,40 +97,72 @@ exports[`ListingPage matches snapshot 1`] = `
</InjectIntl(ModalComponent)>
<div>
<div>
<AvatarLarge
user={
<NamedLink
name="ListingPage"
params={
Object {
"attributes": Object {
"banned": false,
"profile": Object {
"abbreviatedName": "TT",
"displayName": "user-1 display name",
},
},
"id": UUID {
"uuid": "user-1",
},
"type": "user",
"id": "listing1",
"slug": "listing1-title",
}
}
/>
<AvatarMedium
user={
to={
Object {
"attributes": Object {
"banned": false,
"profile": Object {
"abbreviatedName": "TT",
"displayName": "user-1 display name",
},
},
"id": UUID {
"uuid": "user-1",
},
"type": "user",
"hash": "#host",
}
}
/>
>
<AvatarLarge
disableProfileLink={true}
user={
Object {
"attributes": Object {
"banned": false,
"profile": Object {
"abbreviatedName": "TT",
"displayName": "user-1 display name",
},
},
"id": UUID {
"uuid": "user-1",
},
"type": "user",
}
}
/>
</NamedLink>
<NamedLink
name="ListingPage"
params={
Object {
"id": "listing1",
"slug": "listing1-title",
}
}
to={
Object {
"hash": "#host",
}
}
>
<AvatarMedium
disableProfileLink={true}
user={
Object {
"attributes": Object {
"banned": false,
"profile": Object {
"abbreviatedName": "TT",
"displayName": "user-1 display name",
},
},
"id": UUID {
"uuid": "user-1",
},
"type": "user",
}
}
/>
</NamedLink>
</div>
<div>
<div>
@ -152,16 +184,29 @@ exports[`ListingPage matches snapshot 1`] = `
listing1 title
</h1>
<div>
<span>
<FormattedMessage
id="ListingPage.hostedBy"
values={
Object {
"name": "user-1 display name",
}
<FormattedMessage
id="ListingPage.hostedBy"
values={
Object {
"name": <NamedLink
name="ListingPage"
params={
Object {
"id": "listing1",
"slug": "listing1-title",
}
}
to={
Object {
"hash": "#host",
}
}
>
user-1 display name
</NamedLink>,
}
/>
</span>
}
/>
</div>
</div>
</div>