Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import * as React from 'react';
- import { List, Map } from 'immutable';
- import Grid from 'material-ui/Grid';
- import Typography from 'material-ui/Typography';
- import { I18n, TranslationFunction } from 'react-i18next';
- import { ExperienceVersion, Landmark, Language } from '@shared/types';
- import { environmentVariables, Variables } from '@base/environment-variables';
- import { ListExperiencesItemComponent } from './list-experiences-item-component';
- const styles = {
- padding: {
- padding: 10
- }
- };
- interface Props {
- filteredExperienceVersions: List<ExperienceVersion>;
- landmarks: Map<string, Landmark>;
- i18nKey: string;
- }
- export const HighlightedExperiencesComponent = ({filteredExperienceVersions, landmarks, i18nKey}: Props) => (
- <I18n>
- {(t: TranslationFunction, i18nParams: any) => (
- <Grid item={true} xs={12} lg={10}>
- <Grid container={true} spacing={0} style={styles.padding}>
- <Grid item={true} xs={12}>
- <Typography variant="headline">
- {t(i18nKey)}
- </Typography>
- </Grid>
- </Grid>
- <Grid container={true} spacing={16} style={styles.padding}>
- {filteredExperienceVersions.keySeq().map((xpvId: any) => {
- const xpv = filteredExperienceVersions.get(xpvId);
- return (
- <Grid key={xpvId} item={true} xs={12} sm={4} md={3} xl={2}>
- <ListExperiencesItemComponent
- link={`/public/experiences/${xpv.slug.getTranslation(Language.FR)}`}
- title={
- xpv.title.getTranslation(
- Language.fromISOCode(i18nParams.i18n.language.substring(0, 2)),
- xpv.defaultLanguage
- )
- }
- imgUrl={
- environmentVariables(Variables.PICTURE_BASE_URL)
- + 'c_fill,g_auto,h_206,w_275/v1/'
- + xpv.hostId
- + '/'
- + xpv.pictureUrls.first()
- }
- price={t(
- 'guest-ui.pages.list-experiences-item.text',
- {
- price: xpv.pricing.standardPrice().toString()
- })
- }
- unavailabilityReason={xpv.unavailabilityReason}
- address={
- !!landmarks.get(xpv.landmarkId)
- ? landmarks.get(xpv.landmarkId).address.toLocalityAndAreaLevel1()
- : ''
- }
- />
- </Grid>
- );
- })}
- </Grid>
- </Grid>
- )}
- </I18n>
- );
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement