@kiwicom/smart-faq/src/shared/StaticFAQ/FAQCategory.js

// @flow

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

import type { FAQCategory_category as FAQCategoryType } from './__generated__/FAQCategory_category.graphql';

type Props = {|
  category: FAQCategoryType,
|};

const FAQCategory = (props: Props) => (
  <div className="faq-category">
    <Tile
      title={props.category.title ?? ''}
      external={false}
      description={props.category.perex ?? ''}
    />
    <style jsx>
      {`
        @media only screen and (min-width: 901px) {
          .faq-category {
            margin-bottom: 24px;
          }
        }
      `}
    </style>
  </div>
);

export default createFragmentContainer(
  FAQCategory,
  graphql`
    fragment FAQCategory_category on FAQCategory {
      id
      title
      perex
    }
  `,
);