diff --git a/src/components/ListingLink/ListingLink.js b/src/components/ListingLink/ListingLink.js index 0286bf8e..6277f32b 100644 --- a/src/components/ListingLink/ListingLink.js +++ b/src/components/ListingLink/ListingLink.js @@ -10,9 +10,7 @@ import React from 'react'; import { string, oneOfType, node } from 'prop-types'; import { NamedLink } from '../../components'; import { LISTING_STATE_PENDING_APPROVAL, propTypes } from '../../util/types'; -import { createSlug } from '../../util/urlHelpers'; - -const PENDING_APPROVAL_VARIANT = 'pending-approval'; +import { LISTING_PAGE_PENDING_APPROVAL_VARIANT, createSlug } from '../../util/urlHelpers'; const ListingLink = props => { const { className, listing, children } = props; @@ -30,7 +28,7 @@ const ListingLink = props => { params: { id, slug, - variant: PENDING_APPROVAL_VARIANT, + variant: LISTING_PAGE_PENDING_APPROVAL_VARIANT, }, } : { diff --git a/src/containers/EditListingPage/EditListingPage.js b/src/containers/EditListingPage/EditListingPage.js index 3ec78f63..3e066b38 100644 --- a/src/containers/EditListingPage/EditListingPage.js +++ b/src/containers/EditListingPage/EditListingPage.js @@ -5,7 +5,7 @@ import { withRouter } from 'react-router-dom'; import { intlShape, injectIntl } from 'react-intl'; import { connect } from 'react-redux'; import { types as sdkTypes } from '../../util/sdkLoader'; -import { createSlug } from '../../util/urlHelpers'; +import { LISTING_PAGE_PENDING_APPROVAL_VARIANT, createSlug } from '../../util/urlHelpers'; import { LISTING_STATE_PENDING_APPROVAL, propTypes } from '../../util/types'; import { getMarketplaceEntities } from '../../ducks/marketplaceData.duck'; import { manageDisableScrolling, isScrollingDisabled } from '../../ducks/UI.duck'; @@ -29,8 +29,6 @@ import css from './EditListingPage.css'; const { UUID } = sdkTypes; -const PENDING_APPROVAL_VARIANT = 'pending-approval'; - // N.B. All the presentational content needs to be extracted to their own components export const EditListingPageComponent = props => { const { @@ -79,7 +77,7 @@ export const EditListingPageComponent = props => { params: { id: listingId.uuid, slug: listingSlug, - variant: PENDING_APPROVAL_VARIANT, + variant: LISTING_PAGE_PENDING_APPROVAL_VARIANT, }, } : { diff --git a/src/containers/ListingPage/ListingPage.duck.js b/src/containers/ListingPage/ListingPage.duck.js index 007a666e..297c7d58 100644 --- a/src/containers/ListingPage/ListingPage.duck.js +++ b/src/containers/ListingPage/ListingPage.duck.js @@ -4,6 +4,7 @@ import { storableError } from '../../util/errors'; import { addMarketplaceEntities } from '../../ducks/marketplaceData.duck'; import { denormalisedResponseEntities } from '../../util/data'; import { TRANSITION_ENQUIRE } from '../../util/types'; +import { LISTING_PAGE_PENDING_APPROVAL_VARIANT } from '../../util/urlHelpers'; import { fetchCurrentUser } from '../../ducks/user.duck'; const { UUID } = sdkTypes; @@ -154,7 +155,7 @@ export const sendEnquiry = (listingId, message) => (dispatch, getState, sdk) => export const loadData = (params, search) => dispatch => { const listingId = new UUID(params.id); - if (params.variant === 'pending-approval') { + if (params.variant === LISTING_PAGE_PENDING_APPROVAL_VARIANT) { return dispatch(showListing(listingId, true)); } return Promise.all([dispatch(showListing(listingId)), dispatch(fetchReviews(listingId))]); diff --git a/src/containers/ListingPage/ListingPage.js b/src/containers/ListingPage/ListingPage.js index f232aa96..61e719ea 100644 --- a/src/containers/ListingPage/ListingPage.js +++ b/src/containers/ListingPage/ListingPage.js @@ -10,7 +10,7 @@ import config from '../../config'; import routeConfiguration from '../../routeConfiguration'; import { LISTING_STATE_PENDING_APPROVAL, LISTING_STATE_CLOSED, propTypes } from '../../util/types'; import { types as sdkTypes } from '../../util/sdkLoader'; -import { createSlug, parse } from '../../util/urlHelpers'; +import { LISTING_PAGE_PENDING_APPROVAL_VARIANT, createSlug, parse } from '../../util/urlHelpers'; import { formatMoney } from '../../util/currency'; import { createResourceLocatorString, findRouteByRouteName } from '../../util/routes'; import { ensureListing, ensureOwnListing, ensureUser, userDisplayName } from '../../util/data'; @@ -48,8 +48,6 @@ import css from './ListingPage.css'; // This defines when ModalInMobile shows content as Modal const MODAL_BREAKPOINT = 1023; -const PENDING_APPROVAL_VARIANT = 'pending-approval'; - const { UUID } = sdkTypes; const priceData = (price, intl) => { @@ -259,10 +257,11 @@ export class ListingPageComponent extends Component { const isBook = !!parse(location.search).book; const listingId = new UUID(params.id); - const currentListing = - params.variant === PENDING_APPROVAL_VARIANT - ? ensureOwnListing(getOwnListing(listingId)) - : ensureListing(getListing(listingId)); + const isPendingApprovalVariant = params.variant === LISTING_PAGE_PENDING_APPROVAL_VARIANT; + const currentListing = isPendingApprovalVariant + ? ensureOwnListing(getOwnListing(listingId)) + : ensureListing(getListing(listingId)); + const listingSlug = params.slug || createSlug(currentListing.attributes.title || ''); const { description = '', @@ -711,7 +710,7 @@ ListingPageComponent.propTypes = { params: shape({ id: string.isRequired, slug: string, - variant: oneOf([PENDING_APPROVAL_VARIANT]), + variant: oneOf([LISTING_PAGE_PENDING_APPROVAL_VARIANT]), }).isRequired, isAuthenticated: bool.isRequired, diff --git a/src/util/urlHelpers.js b/src/util/urlHelpers.js index 25c66aac..78c4e72d 100644 --- a/src/util/urlHelpers.js +++ b/src/util/urlHelpers.js @@ -3,6 +3,8 @@ import { types as sdkTypes } from './sdkLoader'; const { LatLng, LatLngBounds } = sdkTypes; +export const LISTING_PAGE_PENDING_APPROVAL_VARIANT = 'pending-approval'; + export const createSlug = str => encodeURIComponent( str