How to query join with Nestjsx when use useTable and useShow?
Hello!
I really enjoyed using refine with nestjsx data provider recently.
1. Is there any options for useTable or useShow to add query like "resource" + "?join=profile" ?
when I change resource to "users?join=profile", refine combines query "users?join=profile?limit=10....."
I searched docs but I couldn't find solution.
2. How to optimize using @pankod/refine-antd <EditButton/>, <ShowButton/>,<DeleteButton/> every row.
there are almost 300 items on list with 30pages. click other page, it loaded too slowly. when I removed that 3 components, it works fine.
<Table.Column<IAdmin>
ellipsis={true}
title="actions"
dataIndex="actions"
render={(_, record) => {
return (
<Space>
<ShowButton
hideText
size="small"
recordItemId={record.id}
/>
<EditButton
hideText
size="small"
recordItemId={record.id}
/>
<DeleteButton
hideText
size="small"
recordItemId={record.id}
/>
</Space>
);
}}
/>
3. Can I go back previous page index (Ex: List page5) if I navigate to Show page?
click show button during searching items, and then i click backward arrow, it navigates to first page of list.
Thanks for reading my questions.
2 Replies
metropolitan-bronze•2y ago
Hey @MLOPS, Let me try to answer all 😅
1) Currently, there's no much easy way to do this (for nestjsx data provider) but we're working on some helpers/properties to easily modify requests and responses of data providers in hooks.
For now, you can try passing a second argument to the data provider prop in
<Refine>
component which is the axios instance and add an interceptor to it so you can append your query params or do anything with the request. You can also do by axios.defaults
but I assume you don't need to add join=profile
to all of the requests 😅
Here's an example code for the interceptor:
Other way is, customizing the data provider by re-creating it by copy-ing the source code (Can be seen at https://github.com/refinedev/refine/blob/next/packages/nestjsx-crud/src/index.ts ) but I personally do not recommend doing this if its just for join=profile
query parameter 😅
2) This might be happening due to render
function being re-initialized on every render and causing every row to re-render 🤔 Creating a memoized component for it or wrapping the function with useMemo
might help, if not please let me know and we can try other ways to improve performance here.
3) If I understood correctly, you want to go back to the last page you visited when you click on the back arrow or go back from the browser. This can be done by simply adding syncWithLocation: true
to useTable
hook in your list
page.
Sorry for the late response, hoping this would help 🙏adverse-sapphire•2y ago
Thank you so mush for your answers. 😊
It helps me a lot!