usage for useOne useShow
How can I do so that it does not return all the fields of the table, only some of them have some property for me to select the ones that I want returned, since in some cases I have json data and the application breaks
7 Replies
Hi @efren6799. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
You can use the
meta
property to specify the fields you want to select when making requests. This allows you to fetch only the necessary fields and avoid breaking your application due to large JSON data. Here's an example of a GraphQL query with specified fields using meta
:
For more information on using meta
and detailed usage of GraphQL with Refine, you can refer to the GraphQL guide (https://refine.dev/docs/guides-and-concepts/data-provider/graphql/).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@1031576840931913859> kapa.ai is still learning and improving, please let us how it did by reacting below
continuing-cyan•2y ago
Hey @efren6799, can you share some code snippets and explain the result you trying to achieve?
fair-rose•2y ago
import { MantineShowInferencer } from "@refinedev/inferencer/mantine";
import { GetServerSideProps } from "next";
import { authProvider } from "src/authProvider";
import { useShow, useOne } from "@refinedev/core";
import { Show, TextField, EmailField, DateField } from "@refinedev/mantine";
import { Title } from "@mantine/core";
export default function UserShow() {
const { queryResult } = useShow();
const { data, isLoading } = queryResult;
const record = data?.data;
const { data: userData, isLoading: userIsLoading } = useOne({
resource: "users",
id: record?.user_id || "",
queryOptions: {
enabled: !!record,
}
});
console.log(userData)
return (
<Show isLoading={isLoading}>
<Title my="xs" order={5}>
Id
</Title>
<TextField value={record?.id} />
<Title my="xs" order={5}>
User
</Title>
{userIsLoading ? <>Loading...</> : <>{userData?.data}</>}
<Title my="xs" order={5}>
Email
</Title>
<EmailField value={record?.email} />
<Title my="xs" order={5}>
Email Confirmed At
</Title>
<DateField value={record?.email_confirmed_at} />
<Title my="xs" order={5}>
Last Sign In At
</Title>
<DateField value={record?.last_sign_in_at} />
<Title my="xs" order={5}>
Created At
</Title>
<DateField value={record?.created_at} />
<Title my="xs" order={5}>
Updated At
</Title>
<DateField value={record?.updated_at} />
</Show>
);
}
export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
const { authenticated, redirectTo } = await authProvider.check(context);
if (!authenticated) {
return {
props: {},
redirect: {
destination:
${redirectTo}?to=${encodeURIComponent("/users")},
permanent: false,
},
};
}
return {
props: {},
};
};
i see error
here {userIsLoading ? <>Loading...</> : <>{userData?.data}</>}
is autoGenered code for inferencer
continuing-cyan•2y ago
Inferencer may fail to generate the proper code to display the field when theres more than one possible types. I think its better for you to update that section of the code to make it suitable for the other type options.
The inferencer code is generated by the data response and if the data used in generation of the code and the data in the other pages are different, it will probably fail. You can try to generate some other codes with trying the inferencer with other data and combine the necessary changes in your component as you like
Hope this helps 🚀
fair-rose•2y ago
thanks!
other question
I have a table with a jsonb type
How can I conditionally display the data from the jsonb properties?
for example
{
id: "name",
header: "Name",
accessorKey: "raw_user_meta_data.name",
},
{
id: "first_name",
header: "Name",
accessorKey: "raw_user_meta_data.first_name",
},
{
id: "last_name",
header: "Name",
accessorKey: "raw_user_meta_data.last_name",
},
that conditions me if name is null show first_name and last_name and if name has data just show name
in the same columnfair-rose•2y ago