From 11663701f94ac82210fbb1e7d5aec256fa6dd0f2 Mon Sep 17 00:00:00 2001
From: tamarasaurus <tamara@heetch.com>
Date: Thu, 16 Apr 2020 10:34:40 +0200
Subject: [PATCH] Allow initial state to be passed to Table

Fix prettier

Fix linting

Improve prop types
---
 packages/react/src/components/Table/index.js  | 20 ++++++++++++++++++-
 .../src/components/Table/index.stories.js     |  5 +++--
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/packages/react/src/components/Table/index.js b/packages/react/src/components/Table/index.js
index d5d309f2..2260aa93 100644
--- a/packages/react/src/components/Table/index.js
+++ b/packages/react/src/components/Table/index.js
@@ -10,7 +10,15 @@ import RowCell from '../TableRowCell';
 
 const Table = React.forwardRef(
   (
-    { className, columns, data, isSortable, manualSorting, onChangeSort },
+    {
+      className,
+      columns,
+      data,
+      isSortable,
+      manualSorting,
+      onChangeSort,
+      initialState,
+    },
     ref,
   ) => {
     const {
@@ -23,6 +31,7 @@ const Table = React.forwardRef(
         columns,
         data,
         manualSorting,
+        initialState,
       },
       useSortBy,
     );
@@ -99,6 +108,14 @@ Table.propTypes = {
   isSortable: PropTypes.bool,
   manualSorting: PropTypes.bool,
   onChangeSort: PropTypes.func,
+  initialState: PropTypes.shape({
+    sortBy: PropTypes.arrayOf(
+      PropTypes.shape({
+        id: PropTypes.string.isRequired,
+        desc: PropTypes.bool,
+      }),
+    ),
+  }),
 };
 
 Table.defaultProps = {
@@ -108,6 +125,7 @@ Table.defaultProps = {
   isSortable: false,
   onChangeSort: () => {},
   manualSorting: false,
+  initialState: undefined,
 };
 
 Table.HeaderGroup = HeaderGroup;
diff --git a/packages/react/src/components/Table/index.stories.js b/packages/react/src/components/Table/index.stories.js
index 78c3889c..3416dbd4 100644
--- a/packages/react/src/components/Table/index.stories.js
+++ b/packages/react/src/components/Table/index.stories.js
@@ -37,7 +37,7 @@ stories.add('Playground', () => (
         },
       ]}
       data={data}
-      isSortable={boolean('Is sortable', false)}
+      isSortable={boolean('Table 1 sortable', false)}
     />
 
     <Heading>Table with manual sorting</Heading>
@@ -59,9 +59,10 @@ stories.add('Playground', () => (
         },
       ]}
       data={data}
-      isSortable={boolean('Is sortable', false)}
+      isSortable={boolean('Table 2 sortable', true)}
       manualSorting
       onChangeSort={action('onChangeSort')}
+      initialState={{ sortBy: [{ id: 'number', desc: true }] }}
     />
   </>
 ));