Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

List aside prop #142

Merged
merged 15 commits into from
Feb 24, 2021
Merged

List aside prop #142

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
59280f3
create default aside component
burcukaragozzz Feb 22, 2021
1ab4e02
Merge branch 'master' of https://github.com/pankod/readmin into list-…
burcukaragozzz Feb 23, 2021
25267a4
delete default aside component
burcukaragozzz Feb 23, 2021
5086fbf
update list with aside prop
burcukaragozzz Feb 23, 2021
eecb6c8
create aside component for example
burcukaragozzz Feb 23, 2021
0226f48
delete card style
burcukaragozzz Feb 23, 2021
881cb9e
texts update for aside component
burcukaragozzz Feb 23, 2021
fac850a
Merge branch 'master' of https://github.com/pankod/readmin into list-…
burcukaragozzz Feb 23, 2021
0fcd315
add optional component
burcukaragozzz Feb 23, 2021
4e24739
npm i
burcukaragozzz Feb 24, 2021
2ee4b62
add aside component test to list
burcukaragozzz Feb 24, 2021
a10c803
update list snapshots test
burcukaragozzz Feb 24, 2021
1180d67
Merge branch 'master' of https://github.com/pankod/readmin into list-…
burcukaragozzz Feb 24, 2021
d8216cb
update example package-lock.json
omeraplak Feb 24, 2021
452031c
fix resource test
omeraplak Feb 24, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions example/src/components/aside.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import React from "react";
import { Card, CardProps } from "antd";

export const Aside: React.FC<CardProps> = (props: any) => {
return (
<Card
{...props}
title="Users List Details"
extra={<a href="#">More</a>}
>
<p>
You can view personal data of users registered in your system in
the user table.
</p>
</Card>
);
};
4 changes: 3 additions & 1 deletion example/src/components/pages/user.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,11 @@ import {
DateField,
} from "readmin";

import { Aside } from "../aside";

export const UserList = (props: any) => {
return (
<List {...props}>
<List {...props} aside={Aside}>
<Table
rowKey="id"
pagination={{
Expand Down
2 changes: 1 addition & 1 deletion package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

316 changes: 163 additions & 153 deletions src/components/crud/list/__snapshots__/index.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,189 +3,199 @@
exports[`<List/> JSON Rest Server renders given data 1`] = `
<div>
<div
class="ant-card ant-card-bordered"
class="ant-row"
style="margin: -8px -8px -8px -8px;"
>
<div
class="ant-card-head"
class="ant-col"
style="padding: 8px 8px 8px 8px; flex: 1 1 200px;"
>
<div
class="ant-card-head-wrapper"
class="ant-card ant-card-bordered"
>
<div
class="ant-card-head-title"
class="ant-card-head"
>
Posts
</div>
</div>
</div>
<div
class="ant-card-body"
style="padding: 0px;"
>
<div
class="ant-table-wrapper"
style="width: 100%;"
>
<div
class="ant-spin-nested-loading"
>
<div>
<div
class="ant-card-head-wrapper"
>
<div
class="ant-spin ant-spin-spinning"
class="ant-card-head-title"
>
<span
class="ant-spin-dot ant-spin-dot-spin"
>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
</span>
Posts
</div>
</div>
</div>
<div
class="ant-card-body"
style="padding: 0px; flex: 1;"
>
<div
class="ant-spin-container ant-spin-blur"
class="ant-table-wrapper"
style="width: 100%;"
>
<div
class="ant-table"
class="ant-spin-nested-loading"
>
<div>
<div
class="ant-spin ant-spin-spinning"
>
<span
class="ant-spin-dot ant-spin-dot-spin"
>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
<i
class="ant-spin-dot-item"
/>
</span>
</div>
</div>
<div
class="ant-table-container"
class="ant-spin-container ant-spin-blur"
>
<div
class="ant-table-content"
class="ant-table"
>
<table
style="table-layout: auto;"
<div
class="ant-table-container"
>
<colgroup />
<thead
class="ant-table-thead"
<div
class="ant-table-content"
>
<tr>
<th
class="ant-table-cell"
>
Title
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody"
>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="1"
<table
style="table-layout: auto;"
>
<td
class="ant-table-cell"
<colgroup />
<thead
class="ant-table-thead"
>
Necessitatibus necessitatibus id et cupiditate provident est qui amet.
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="2"
>
<td
class="ant-table-cell"
<tr>
<th
class="ant-table-cell"
>
Title
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody"
>
Recusandae consectetur aut atque est.
</td>
</tr>
</tbody>
</table>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="1"
>
<td
class="ant-table-cell"
>
Necessitatibus necessitatibus id et cupiditate provident est qui amet.
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="2"
>
<td
class="ant-table-cell"
>
Recusandae consectetur aut atque est.
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<ul
class="ant-pagination ant-table-pagination ant-table-pagination-right"
unselectable="unselectable"
>
<li
aria-disabled="true"
class="ant-pagination-prev ant-pagination-disabled"
title="Previous Page"
>
<button
class="ant-pagination-item-link"
disabled=""
tabindex="-1"
type="button"
<ul
class="ant-pagination ant-table-pagination ant-table-pagination-right"
unselectable="unselectable"
>
<span
aria-label="left"
class="anticon anticon-left"
role="img"
<li
aria-disabled="true"
class="ant-pagination-prev ant-pagination-disabled"
title="Previous Page"
>
<svg
aria-hidden="true"
data-icon="left"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<button
class="ant-pagination-item-link"
disabled=""
tabindex="-1"
type="button"
>
<path
d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"
/>
</svg>
</span>
</button>
</li>
<li
class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"
tabindex="0"
title="1"
>
<a
rel="nofollow"
>
1
</a>
</li>
<li
aria-disabled="true"
class="ant-pagination-next ant-pagination-disabled"
title="Next Page"
>
<button
class="ant-pagination-item-link"
disabled=""
tabindex="-1"
type="button"
>
<span
aria-label="right"
class="anticon anticon-right"
role="img"
<span
aria-label="left"
class="anticon anticon-left"
role="img"
>
<svg
aria-hidden="true"
data-icon="left"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"
/>
</svg>
</span>
</button>
</li>
<li
class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"
tabindex="0"
title="1"
>
<svg
aria-hidden="true"
data-icon="right"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<a
rel="nofollow"
>
<path
d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
/>
</svg>
</span>
</button>
</li>
</ul>
1
</a>
</li>
<li
aria-disabled="true"
class="ant-pagination-next ant-pagination-disabled"
title="Next Page"
>
<button
class="ant-pagination-item-link"
disabled=""
tabindex="-1"
type="button"
>
<span
aria-label="right"
class="anticon anticon-right"
role="img"
>
<svg
aria-hidden="true"
data-icon="right"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
/>
</svg>
</span>
</button>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
Expand Down
Loading