eastern-cyan•10mo ago

How to get data from other tables via foreign keys (Supabase / Chakra UI tables)

Hello, I have a question regarding the useTable hook, how do I set query options so I can do operations like these for example:

select movies.title, categories.name
from movies
join categories on movies.category_id = categories.id;

select movies.title, categories.name
from movies
join categories on movies.category_id = categories.id;

3 Replies

kapa.ai•10mo ago

Hi @3d.2478. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In refine, you can handle multiple joins using the meta property in the useTable hook. The meta property is used to pass additional information that can be read by data provider methods. Here is an example of how you can use the meta property to perform a join operation:

const { tableProps, sorter } = useTable<IUser>({  
 resource: "movies",  
 meta: {  
 select: "*, categories!inner(name)",  
 },  
});

const { tableProps, sorter } = useTable<IUser>({  
 resource: "movies",  
 meta: {  
 select: "*, categories!inner(name)",  
 },  
});

In this example, the select value in the meta object is used to perform the relational database operation. The select property is used internally by the Supabase data provider methods. Please note that the actual implementation might vary depending on the specifics of your data structure and the data provider you are using. For more information, you can refer to the refine documentation (https://refine.dev/docs). Source (https://discord.com/channels/837692625737613362/1126520565629472801) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•10mo ago

<@326362244860346371> kapa.ai is still learning and improving, please let us know how it did by reacting below

eastern-cyan•10mo ago

the useTable hook in my interface is written like this:

const {
        getHeaderGroups,
        getRowModel,
        setOptions,
        refineCore: {
            setCurrent,
            pageCount,
            current,
            tableQueryResult: { data: tableData },
        },
    } = useTable({
        columns,
    });

const {
        getHeaderGroups,
        getRowModel,
        setOptions,
        refineCore: {
            setCurrent,
            pageCount,
            current,
            tableQueryResult: { data: tableData },
        },
    } = useTable({
        columns,
    });

what should I change?