Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 | 1x 5x 1x 1x 4x 1x 1x 1x 1x 1x 5x | // @flow
import React from 'react';
import { Outlet, createRootRoute, createRoute, createRouter, createMemoryHistory, RouterProvider } from '@tanstack/react-router';
import {
OrdersFilterDesktopDialog,
Footer,
OrderListItem,
OrderListContainer,
Order,
Layout,
OrdersFilterOpened,
OrderListPreviewContainer,
OrdersFilterProvider,
} from '@/components';
import { Row, Col, Pagination as OrdersPagination } from 'antd';
import { sidebarButtons, data, filters } from './data';
const rootRoute = createRootRoute({
component: function RootComponent() {
return (
<OrdersFilterProvider>
<Layout buttons={sidebarButtons} title="Caption" avatar={{ title: 'AV' }}>
<Row>
<Col span={12}>
<OrdersFilterOpened open dialog filters={filters} />
<OrderListPreviewContainer height={555}>
<Col span={12}>
<OrderListContainer>
<OrderListItem key={data[0].id} data={data[0]} />
<OrderListItem key={data[1].id} data={data[1]} />
<OrderListItem key={data[2].id} data={data[2]} />
<OrderListItem key={data[3].id} data={data[3]} />
<OrderListItem key={data[4].id} data={data[4]} />
<OrderListItem key={data[5].id} data={data[5]} />
<OrderListItem key={data[6].id} data={null} />
</OrderListContainer>
<OrdersPagination defaultCurrent={1} total={50} />
</Col>
<Col span={12}>
<Order />
</Col>
</OrderListPreviewContainer>
</Col>
<Col span={12}>
<OrdersFilterOpened open dialog filters={filters} />
<OrderListPreviewContainer height={555}>
<Col span={12}>
<OrderListContainer>
<OrderListItem key={data[0].id} data={data[0]} />
<OrderListItem key={data[1].id} data={data[1]} />
<OrderListItem key={data[2].id} data={data[2]} />
<OrderListItem key={data[3].id} data={data[3]} />
<OrderListItem key={data[4].id} data={data[4]} />
<OrderListItem key={data[5].id} data={data[5]} />
<OrderListItem key={data[6].id} data={null} />
</OrderListContainer>
<OrdersPagination defaultCurrent={1} total={50} />
</Col>
<Col span={12}>
<Order />
</Col>
</OrderListPreviewContainer>
</Col>
</Row>
<Footer />
</Layout>
<Outlet />
</OrdersFilterProvider>
);
},
});
const IndexRoute = createRoute({
getParentRoute: () => rootRoute,
path: '/',
component: function IndexComponent() {
return <div />;
},
});
const DialogRoute = createRoute({
getParentRoute: () => rootRoute,
path: '/dialog',
component: function DialogComponent() {
return <OrdersFilterDesktopDialog />;
},
});
const routeTree = rootRoute.addChildren([IndexRoute, DialogRoute]);
const memoryHistory = createMemoryHistory({
initialEntries: ['/'],
});
const router = createRouter({ routeTree, history: memoryHistory });
export const DiffOpenedCardsWithDialogPage = (): React.Node => <RouterProvider router={router} />;
|