@kiwicom/smart-faq
Version:
Smart FAQ
75 lines (69 loc) • 1.75 kB
JavaScript
// @flow
import * as React from 'react';
import idx from 'idx';
import { graphql, createFragmentContainer } from 'react-relay';
import BoardingPassesLoader from './BoardingPassesLoader';
import BoardingPassesItem from './BoardingPassesItem';
import type { BoardingPassesList as BoardingPassesSummaryProps } from './__generated__/BoardingPassesList.graphql';
type Props = {|
data: BoardingPassesSummaryProps,
mmbUrl: string,
|};
const BoardingPassesList = ({ data, mmbUrl }: Props) => {
if (data === null) {
return (
<React.Fragment>
<hr className="separationLine" />
<BoardingPassesLoader />
<style jsx>
{`
hr.separationLine {
height: 1px;
background-color: #e8edf1;
border: none;
margin: 0;
}
`}
</style>
</React.Fragment>
);
}
const { boardingPasses } = data;
return (
boardingPasses &&
boardingPasses
.slice()
.sort(
(a, b) =>
new Date(idx(a, _ => _.leg.departure.time) || '') -
new Date(idx(b, _ => _.leg.departure.time) || ''),
// TODO sort boarding passes on GraphQL
)
.map(
boardingPass =>
boardingPass && (
<BoardingPassesItem
key={boardingPass.flightNumber}
data={boardingPass}
mmbUrl={mmbUrl}
/>
),
)
);
};
export default createFragmentContainer(
BoardingPassesList,
graphql`
fragment BoardingPassesList on BookingAssets {
boardingPasses {
flightNumber
leg {
departure {
time
}
}
...BoardingPassesItem
}
}
`,
);