refactor: use storybook and atomic design (#16)

BREAKING CHANGE: rewrite most of the Typescript types, so the content format (the meta in particular) needs to be updated.

1 files changed, 26 insertions, 0 deletions

diff --git a/src/components/molecules/nav/pagination.test.tsx b/src/components/molecules/nav/pagination.test.tsx
new file mode 100644
index 0000000..2c4a063
--- /dev/null
+++ b/src/components/molecules/nav/pagination.test.tsx
@@ -0,0 +1,26 @@
+import { render, screen } from '@test-utils';
+import Pagination from './pagination';
+
+const total = 50;
+const perPage = 10;
+
+describe('Pagination', () => {
+  it('renders previous and next page links', () => {
+    render(<Pagination current={2} total={total} perPage={perPage} />);
+    expect(
+      screen.getByRole('link', { name: /Previous page/i })
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole('link', { name: /Next page/i })
+    ).toBeInTheDocument();
+  });
+
+  it('renders the page links except for the current one', () => {
+    render(
+      <Pagination current={2} siblings={2} total={total} perPage={perPage} />
+    );
+    expect(screen.getAllByRole('link', { name: /Page / })).toHaveLength(
+      total / perPage - 1
+    );
+  });
+});