@kiwicom/smart-faq/src/SmartFAQ/SingleBookingPage/bookingItem/AccordionBody.js

Smart FAQ

// @flow

import * as React from 'react';
import { createFragmentContainer, graphql } from 'react-relay';
import Separator from '@kiwicom/orbit-components/lib/Separator';
import TripSector from '@kiwicom/orbit-components/lib/TripSector';

import AccordionBodyLeg from './AccordionBodyLeg';
import AccordionBodyLastLeg from './AccordionBodyLastLeg';
import type { AccordionBody_legs } from './__generated__/AccordionBody_legs.graphql';

type Props = {|
  legs: AccordionBody_legs,
|};

class AccordionBody extends React.Component<Props> {
  renderLegs = () => {
    const { legs } = this.props;
    return legs.map((l, li) => {
      if (li === legs.length - 1) {
        return <AccordionBodyLastLeg key={l.flightNumber} leg={l} />;
      }
      return (
        <AccordionBodyLeg key={l.flightNumber} leg={l} nextLeg={legs[li + 1]} />
      );
    });
  };
  render() {
    return (
      <>
        <div style={{ marginTop: '16px' }}>
          <Separator />
        </div>
        <div style={{ padding: '0 40px 0' }}>
          <TripSector dataTest="tripSector">{this.renderLegs()}</TripSector>
        </div>
      </>
    );
  }
}

export default createFragmentContainer(
  AccordionBody,
  graphql`
    fragment AccordionBody_legs on Leg @relay(plural: true) {
      flightNumber
      ...AccordionBodyLeg_leg
      ...AccordionBodyLeg_nextLeg
      ...AccordionBodyLastLeg_leg
    }
  `,
);