From 2884dcc95caef9d7d1580631b5834457033803f7 Mon Sep 17 00:00:00 2001
From: mark tyneway <mark@purse.io>
Date: Thu, 20 Sep 2018 13:01:49 -0700
Subject: [PATCH] feature: add table pagination

---
 lib/Bui.js                    |  6 +++++
 lib/constants/codeSnippets.js |  5 ++++
 lib/constants/tableProps.js   | 44 +++++++++++++++++------------------
 3 files changed, 33 insertions(+), 22 deletions(-)

diff --git a/lib/Bui.js b/lib/Bui.js
index 805fecd..3b9b707 100644
--- a/lib/Bui.js
+++ b/lib/Bui.js
@@ -39,6 +39,7 @@ const {
   radioFormCode,
   fileUploadCode,
   tableCode,
+  paginatedTableCode,
   tabMenuCode,
   dropdownCode
 } = codeSnippets;
@@ -263,6 +264,11 @@ class Bui extends PureComponent {
             <Table {...tableProps} />
             <xmp style={styles.xmp}>{tableCode}</xmp>
           </div>
+          <Header type="h2">Paginating Table</Header>
+          <div style={styles.componentContainer}>
+            <Table pageSize={2} {...tableProps} />
+            <xmp style={styles.xmp}>{paginatedTableCode}</xmp>
+          </div>
         </div>
         <div style={styles.componentFamilyContainer}>
           <Header type="h2">TabMenu</Header>
diff --git a/lib/constants/codeSnippets.js b/lib/constants/codeSnippets.js
index 454f0d1..5874011 100644
--- a/lib/constants/codeSnippets.js
+++ b/lib/constants/codeSnippets.js
@@ -137,6 +137,11 @@ export const tableCode = `import { Table } from '@bpanel/bpanel-ui';
 <Table {...tableProps} />
 `;
 
+export const paginatedTableCode = `import { Table } from '@bpanel/bpanel-ui';
+
+<Table pageSize={2} {...tableProps} />
+`;
+
 export const tabMenuCode = `import { TabMenu } from '@bpanel/bpanel-ui';
 
 <TabMenu />
diff --git a/lib/constants/tableProps.js b/lib/constants/tableProps.js
index 1ce7654..4c18ffa 100644
--- a/lib/constants/tableProps.js
+++ b/lib/constants/tableProps.js
@@ -4,9 +4,9 @@ const exampleTableData = [
     Age: '2m',
     '# of Tx': '2464',
     'BTC Sent': '18',
-    'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    'Size (kB)': '1,311',
+    Weight: '1311',
+    'Avg Fee': '$1.52',
     Miner: 'bcoin'
   },
   {
@@ -14,49 +14,49 @@ const exampleTableData = [
     Age: '14m',
     '# of Tx': '2464',
     'BTC Sent': '18',
-    'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    'Size (kB)': '1,912',
+    Weight: '1912',
+    'Avg Fee': '$1.35',
     Miner: 'bcoin'
   },
   {
     Height: '488236',
     Age: '2m',
     '# of Tx': '2464',
-    'BTC Sent': '18',
+    'BTC Sent': '42',
     'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    Weight: '1018',
+    'Avg Fee': '$7.48',
     Miner: 'bcoin'
   },
   {
     Height: '488236',
     Age: '14m',
     '# of Tx': '2464',
-    'BTC Sent': '18',
-    'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    'BTC Sent': '41',
+    'Size (kB)': '1,710',
+    Weight: '1710',
+    'Avg Fee': '$1.57',
     Miner: 'bcoin'
   },
   {
     Height: '488236',
     Age: '2m',
-    '# of Tx': '2464',
-    'BTC Sent': '18',
+    '# of Tx': '2011',
+    'BTC Sent': '118',
     'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    Weight: '1018',
+    'Avg Fee': '$1.28',
     Miner: 'bcoin'
   },
   {
     Height: '488236',
     Age: '14m',
-    '# of Tx': '2464',
-    'BTC Sent': '18',
-    'Size (kB)': '1,018',
-    Weight: '1898',
-    'Avg Fee': '$1.58',
+    '# of Tx': '1269',
+    'BTC Sent': '388',
+    'Size (kB)': '1,928',
+    Weight: '1928',
+    'Avg Fee': '$4.58',
     Miner: 'bcoin'
   }
 ];