-
Notifications
You must be signed in to change notification settings - Fork 11
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.
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
Add the Table Component #48
base: dev
Are you sure you want to change the base?
Conversation
Signed-off-by: Saswata Mukherjee <[email protected]>
pageCount={pageCount} | ||
paginationData={paginationData} | ||
onChangePage={onChangePage} | ||
/>{' '} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
some extra brackets {' '}
can be removed if not required.
); | ||
}; | ||
|
||
export { BasicTable }; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
are there other variations coming up for the table component?
if not we can export it just as a table. Let wait for others to reviews this.
rowsPerPage: number; | ||
} | ||
|
||
interface BasicTableProps extends TableProps { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you can get the TableProps
from another file as base.ts, have a look as done in other components.
src/core/Table/BasicTable/style.ts
Outdated
width: '0.2em', | ||
}, | ||
'&::-webkit-scrollbar-track': { | ||
webkitBoxShadow: `inset 0 0 6px ${theme.palette.border.main}`, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can we convert px
to rem
and use where required.
src/core/Table/index.ts
Outdated
@@ -0,0 +1 @@ | |||
export * from './BasicTable'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If this has only one table component then we can just use as ./Table
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also, I guess you need to export globally the Table
component at src/core/index.ts
something like export * from './Table';
in order to get the table exported for npm.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@S-ayanide @arkajyotiMukherjee should we have this Table as a core or lab component?
src/core/Table/BasicTable/index.ts
Outdated
@@ -0,0 +1 @@ | |||
export * from './BasicTable'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
as it's only one table component, we can export the Table instead.
src/core/Table/BasicTable/data.tsx
Outdated
@@ -0,0 +1,35 @@ | |||
import { TableCell, TableRow, Typography } from '@material-ui/core'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can we use the typography which is available in Kubera-UI?
src/core/Table/BasicTable/data.tsx
Outdated
}; | ||
|
||
const onChangePage = (_: any, page: number) => { | ||
console.log(page); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is console.log()
really required?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's required, since I need to use page
and can't have an empty function. Otherwise linting errors/warnings occurs.
Signed-off-by: Saswata Mukherjee <[email protected]>
Description
This PR adds the Table component at the
core/Table
path which includes theTable
component along with a storybook file and a unit test file.Code Structure
Storybook
Screenshot