@rnga/orders/src/dev/App.js

## Get schema from @prisma-cms 1. yarn get-api-schema -e http://localhost:4000 2. yarn build-api-fragments

/* eslint-disable react/forbid-foreign-prop-types */
import React, { Component, Fragment } from 'react';
import PropTypes from "prop-types";

import PrismaCmsApp from '@prisma-cms/front'
import { Renderer as PrismaCmsRenderer } from '@prisma-cms/front'
import MainMenu from "@prisma-cms/front/lib/components/App/Renderer/MainMenu";

import * as queryFragments from "../schema/generated/api.fragments";

import Orders from "../App";

import Layout from "./components/layout";

import services from "./components/orders/mock/services";

import data from "./components/orders/mock/data/step1";
import step2Data from "./components/orders/mock/data/step2";
import step3Data from "./components/orders/mock/data/step3";


import { Grid } from 'material-ui';

import { Link } from "react-router-dom";
import { Button } from 'material-ui';

// import Auth from 'Auth';

import OrdersPage from "./components/pages/Orders";

class DevRenderer extends PrismaCmsRenderer {


  static propTypes = {
    ...PrismaCmsRenderer.propTypes,
    pure: PropTypes.bool.isRequired,
  }

  static defaultProps = {
    ...PrismaCmsRenderer.defaultProps,
    pure: false,
    // Auth,
  }

  getRoutes() {

    const {
      uri,
      router,
    } = this.context;

    return [
      {
        exact: true,
        path: "/",
        // path: ["/", "/step1"],
        // component: Orders,
        // component: () => "dfgdfg",
        render: (props) => {

          return <Layout
            uri={uri}
            router={router}
          >
            <OrdersPage
              {...props}
              services={services}
            // data={data}
            // opened={true}
            />
          </Layout>

        }

        //   return <Layout
        //     uri={uri}
        //     router={router}
        //   >
        //     <Orders
        //       {...props}
        //       services={services}
        //       // data={data}
        //       opened={true}
        //     />
        //   </Layout>
        // }
      },
      {
        exact: true,
        path: "/step1",
        render: (props) => {


          return <Layout
            uri={uri}
            router={router}
          >
            <Orders
              {...props}
              services={services}
              data={data}
              opened={true}
            />
          </Layout>
        }
      },
      {
        exact: true,
        path: ["/", "/step2"],
        // component: App,
        render: (props) => {


          return <Layout
            uri={uri}
            router={router}
          >
            <Orders
              {...props}
              services={services}
              data={step2Data}
              opened={true}
            // confirmOpened={true}
            />
          </Layout>
        }
      },
      {
        exact: true,
        path: ["/", "/step3"],
        // component: App,
        render: (props) => {


          return <Layout
            uri={uri}
            router={router}
          >
            <Orders
              {...props}
              services={services}
              data={step3Data}
              opened={true}
            // showSuccess={true}
            />
          </Layout>
        }
      },
      {
        path: "*",
        render: props => this.renderOtherPages(props),
      },];

  }

  renderAdmin(wrapper) {
    return wrapper;
  }

  renderMenu() {

    return <Fragment>
      {/* {super.renderMenu()} */}
      <MainMenu />
      <Grid
        container
        spacing={8}
      >
        <Grid
          item
        >
          <Link
            to="/step1"
          >
            <Button>
              Этап 1
          </Button>
          </Link>
        </Grid>
        <Grid
          item
        >
          <Link
            to="/step2"
          >
            <Button>
              Этап 2
          </Button>
          </Link>
        </Grid>
        <Grid
          item
        >
          <Link
            to="/step3"
          >
            <Button>
              Этап 3
          </Button>
          </Link>
        </Grid>
      </Grid>
    </Fragment>;
  }



  renderWrapper() {

    return this.renderWrapperOld__();

  }


  render() {

    // const {
    //   pure,
    //   // ...other
    // } = this.props;

    // const {
    //   uri,
    // } = this.context;


    return <Fragment>

      {/* <style
        dangerouslySetInnerHTML={{
          __html: `
            @import url("/assets/css/bootstrap.min.css");
            @import url("/assets/css/style.css");
            @import url("/assets/css/colors/green.css");
            @import url("/assets/css/owl.carousel.css");
            @import url("/assets/css/owl.transitions.css");
            @import url("/assets/css/animate.min.css");
            @import url("/assets/fonts/fonts.css");
            @import url("/assets/css/rn_style.css");
            @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800");
            @import url("/assets/css/font-awesome.min.css");
            @import url("https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.css");
        `,
        }}
      /> */}


      {super.render()}
    </Fragment>;

  }

}

export default class DevApp extends Component {

  static propTypes = {
    queryFragments: PropTypes.object.isRequired,
  }

  static defaultProps = {
    queryFragments,
    lang: "ru",
  }

  render() {

    const {
      queryFragments,
      ...other
    } = this.props;

    const {
      UserNoNestingFragment,
      DiscountGroupNoNestingFragment,
    } = queryFragments;

    return <PrismaCmsApp
      queryFragments={queryFragments}
      Renderer={DevRenderer}
      // pure={true}
      {...other}
      apolloOptions={{
        apiQuery: `{
          user:me{
            ...UserNoNesting
            DiscountGroup{
              ...DiscountGroupNoNesting
            }
          }
        }
        ${UserNoNestingFragment}
        ${DiscountGroupNoNestingFragment}`
      }}
    />
  }
}