sensitive-blue•9mo ago

i have a refine + nextjs + shadcn

i have a refine + nextjs + shadcn project, very basic as it's new. I added a new resource and basically copied the resource from Blog posts which seems to work fine, but as soon as i add my own useTable replacing the blogposts useTable, i get an error saying useTable is not a function..

2 Replies

fair-rose•9mo ago

Hey @hack1nt0sh sorry for the issue, can you at least share the parts how you import useTable and how you use it in your component?

other-emerald•9mo ago

const tableProps = useTable<IEndpoints>({
    columns,
  });

const tableProps = useTable<IEndpoints>({
    columns,
  });

import {
  GetManyResponse,
  IResourceComponentsProps,
  useMany,
} from "@refinedev/core";
import { useTable } from "@refinedev/react-table";
import { ColumnDef } from "@tanstack/react-table";
import { Button } from "@/components/ui/button";
import { LucideEdit, LucideEye } from "lucide-react";

import { DataTable } from "@/components/table/data-table";
import { Card } from "@/components/ui/card";
import React from "react";
import Link from "next/link";

import {
  GetManyResponse,
  IResourceComponentsProps,
  useMany,
} from "@refinedev/core";
import { useTable } from "@refinedev/react-table";
import { ColumnDef } from "@tanstack/react-table";
import { Button } from "@/components/ui/button";
import { LucideEdit, LucideEye } from "lucide-react";

import { DataTable } from "@/components/table/data-table";
import { Card } from "@/components/ui/card";
import React from "react";
import Link from "next/link";

it seems that refine doesn't like SSR. If i don't add the "use client" to my page.tsx it yells at me with the error

TypeError: (0 , _refinedev_react_table__WEBPACK_IMPORTED_MODULE_7__.useTable) is not a function       
    at BlogPostList (./src/app/endpoints/page.tsx:102:88)
    at stringify (<anonymous>)
digest: "4089185379"
  84 |   );

TypeError: (0 , _refinedev_react_table__WEBPACK_IMPORTED_MODULE_7__.useTable) is not a function       
    at BlogPostList (./src/app/endpoints/page.tsx:102:88)
    at stringify (<anonymous>)
digest: "4089185379"
  84 |   );