R
Refine

ask-any-question

useTable from refine-react-table is killing my IDE

Aambitious-aqua10/5/2022
Hi! I'm using refine with the new mantineUI integration. I'm trying to get a list working for some easy entities, but as soon as I import useTable from the @pankod/refine-react-table (copying an example from the official repo https://github.com/pankod/refine/blob/next/examples/authentication/mantine/src/pages/posts/list.tsx) my IDE (jetBrains WebStorm) takes at least 30 seconds to complete each post-save action (only import optimization and reformat with prettier). If i remove the useTable import, it goes back to instant post-save actions as always.. Any guess?
OOmer10/5/2022
Hey @kino90 馃憢 , Welcome, we are glad to see you! Very interesting. So, are you experiencing the same issue in this example? https://github.com/pankod/refine/blob/next/examples/table/reactTable/basic/src/pages/posts/list.tsx
Aambitious-aqua10/5/2022
let me try 馃檪
Aambitious-aqua10/5/2022
I don't know how to reproduce this on your monorepo. I'm getting this error even if i installed deps both in the main repo folder and in the example :/
No description
OOmer10/5/2022
just copy/paste the page into your project. So you can easily try
Aambitious-aqua10/5/2022
ah ok in my project 馃檪
OOmer10/5/2022
We just want to be sure if it's about the "@pankod/refine-mantine" package or the "@pankod/refine-react-table" package 馃憖
Aambitious-aqua10/5/2022
Done, it's definetely the useTable from "@pankod/refine-react-table"
OOmer10/5/2022
Aambitious-aqua10/5/2022
if i save with import { useTable, ColumnDef, flexRender } from "@pankod/refine-react-table"; it freezes everything for 30sec more or less, if I save with import { ColumnDef, flexRender } from "@pankod/refine-react-table"; (without useTable) it's instant `
OOmer10/5/2022
Could you try this?
import {
createColumnHelper,
flexRender,
getCoreRowModel,
useReactTable,
} from '@tanstack/react-table'
import {
createColumnHelper,
flexRender,
getCoreRowModel,
useReactTable,
} from '@tanstack/react-table'
Aambitious-aqua10/5/2022
using this (and using useReactTable instead of useTable) saves quickly
OOmer10/5/2022
Thanks. Let's see what we can do 馃巵
Aambitious-aqua10/5/2022
Thanks a lot 馃憦
OOmer10/5/2022
I guess I couldn't reproduce the issue 馃槮
Aambitious-aqua10/5/2022
No description
Aambitious-aqua10/5/2022
you can see from the gif that: 1- it takes a lot for the import 2- after the save, it takes a lot for the optimizations
OOmer10/5/2022
@aliemirs Have you any idea? Could it be related to types? @kino90 could you try version @pankod/refine-react-table@4.5.0? npm i @pankod/refine-react-table@4.5.0
Aambitious-aqua10/5/2022
I'll try it as soon as I'll be back to my desk 馃槈
Ccorrect-apricot10/5/2022
Hey! Sorry I had trouble with my discord connection. Interesting issue @kino90, can you also try using useTable from @pankod/refine-core? Let's see if we have the issue is coming from the core or the react-table itself 馃 Also trying to repro the issue 馃槄
Aambitious-aqua10/5/2022
useTable from refine-core looks ok (but does not return the correct values, as typescript is marking everything as error 馃槀 )
Aambitious-aqua10/5/2022
No description
Aambitious-aqua10/5/2022
but the import and save are quick now I'll try updating to 4.5.0 after installing 4.5.0 still have problems importing useTable
Aambitious-aqua10/5/2022
My project settings are pretty basic, too.. I just added prettier 馃
Aambitious-aqua10/5/2022
@pankod/refine-antd is there because I'm actually trying to porting a POC from antd to our preferred UI Kit (Mantine UI) I also tried to run prettier --write ./path/to/file.tsx on the file which includes useTable to see if it was a prettier problem, but it runs smoothly from CLI (also, it won't give problems IMPORTING the hook, but only when SAVING 馃槈 ) so it's clearly not prettier I disabled "optimize imports" functionality from "Actions on save" panel, and it's OK now, so it's something related to imports Maybe that helps you to reproduce the issue 馃檪
OOmer10/5/2022
I think this PR will fix the issue, https://github.com/pankod/refine/pull/2645
GitHub
fix: react-table export type by omeraplak 路 Pull Request #2645 路 pa...
Please provide enough information so that others can review your pull request: UseTableProps and UseTableReturnType are exported as type. Closing issues Could potentially solve this problem -> h...
OOmer10/5/2022
Hey @kino90 , Could you try version @pankod/refine-react-table@4.7.3?
Aambitious-aqua10/5/2022
installing 馃槈 still very slow while importing and during imports optimizations 馃槩
OOmer10/5/2022
frankly, I was hopeful hehe
Aambitious-aqua10/5/2022
I was, too ahaha I solved the main issue disabling the "optimize imports" feature at every save, so I can keep working on the app.. but the problem is still there, just not as blocking..
OOmer10/5/2022
So can you do the same test for @pankod/refine-react-hook-form? https://github.com/pankod/refine/blob/master/examples/form/reactHookForm/useForm/src/pages/posts/create.tsx I have a guess
OOmer10/5/2022
I think this might work 馃憖 https://github.com/pankod/refine/pull/2648
GitHub
refactor: update@tanstack/react-table exports by omeraplak 路 Pull...
Please provide enough information so that others can review your pull request: We've updated @tanstack/react-table exports Closing issues Could potentially solve this issue -> https://discor...
OOmer10/5/2022
Hey @kino90 , Could you try version @pankod/refine-react-table@4.7.4 ? Thank you 鈿★笍
Aambitious-aqua10/5/2022
installing
Aambitious-aqua10/5/2022
same 馃槩
OOmer10/5/2022
I will look into this issue 馃憖

Looking for more? Join the community!

R
Refine

ask-any-question

Join Server
Recommended Posts
Overriding default padding of 'main' areaSorry for all the noob questions but what is the 'correct' way to override the default padding of thinitialValues empty in serachFormProps with syncWithLocation set to TrueHi, I am setting `syncWithLocation` to true for useTable from Antd, the `initialValues` in searchForLogin-componentHello team I am trying to setup a login component for a new project i am trying out in refine. Is thcustom-pageswith NextJSIntercept data for SaveButton on ModalHi. I'm really struggling to figure this out and it feels like it should be simple. I have a modal uuse-modal-form-successhow to change success notification message in useModalForm hook ?Testing ComponentsWhile testing my Login Form i am getting this error: No QueryClient set, use QueryClientProvider toQuestion about fetching paginated table data for a .csv exportHey @Omer , another question if I may. I have a table which will return quite a few records. The taDefault Values of Filter panel of form being lost even though UI reflects a valueHey guys wondering if you can help me We have a Page with a table and a filter form. We are settinAuth0 authProvider and dataProvider async problemI have an Auth0 login on my Refine frontend. Once I'm logged in I pass my token to the backend via tAzureB2C MsalProvider issuesHi. I'm using Azure B2C (Microsoft provides MsalProvider for react apps) as the auth provider for custom-pagesCould you please provide an example??? I have tried push("offerings", "/step1"), push("offerings",Many-to-Many relationshipsJust jumped in to Refine and I'm looking for a nice way to do many-to-many relationships with supabaHow to have access window on next.config.js?Does someone know how to get access to window variable on next.config.js i will need to read the winSocket.ioHello, I struggle to get LiveProvider works with socket.io. any chance you have a boilerplate that cHi all I have created a small app withHi all, I have created a small app with refine-nextjs template and added posts list page to pages asAntd TextareaIs there a trick to wiring up Antd TextArea inside a Form.Item to a resource in Edit view? I am not How to reference another resource in table.Hello, i've searched docs, but couldn't find how to do logic similar to react admin reference field How to make an edit form to handle 2+ modelsI have this `user` model with an associated `profile` model (1:1 relationship) I want to make an edinpm run bootstrap looping errorWith a forked instance of `refine`, after I run `npm install` and run `npm run boostrap` I am recei