T
tRPC

zustand + trpc (basic data fetching)

zustand + trpc (basic data fetching)

TTCI11/9/2022
im trying to use zustand with trpc, but having trouble setting some data to global state. What am i missing here?
import create from 'zustand';
import { trpc } from '../../utils/trpc';

interface TenantState {
tickets: [];
setTickets: any;
}

export const useTenantStore = create<TenantState>()((set, get) => ({
tickets: [],
setTickets: async (newTicket: any[]) => {
set(() => ({ tickets: trpc.ticketService.getByTenantId.useQuery().data })); // problem area
},
}));
import create from 'zustand';
import { trpc } from '../../utils/trpc';

interface TenantState {
tickets: [];
setTickets: any;
}

export const useTenantStore = create<TenantState>()((set, get) => ({
tickets: [],
setTickets: async (newTicket: any[]) => {
set(() => ({ tickets: trpc.ticketService.getByTenantId.useQuery().data })); // problem area
},
}));
i've also tried this with no luck
export const useTenantStore = create<TenantState>()((set, get) => ({
allTickets: {},
fetch: () => {
const data = trpc.ticketService.getByTenantId.useQuery().data;
set({ allTickets: data });
},
}));
export const useTenantStore = create<TenantState>()((set, get) => ({
allTickets: {},
fetch: () => {
const data = trpc.ticketService.getByTenantId.useQuery().data;
set({ allTickets: data });
},
}));
and this...
React.useEffect(() => {
fetch(trpc.ticketService.getByTenantId.useQuery());
}, []);
React.useEffect(() => {
fetch(trpc.ticketService.getByTenantId.useQuery());
}, []);
const fetch = useTenantStore((state) => state.fetch);
const fetch = useTenantStore((state) => state.fetch);
export const useTenantStore = create<TenantState>()((set, get) => ({
allTickets: {},
fetch: async (url: any) => {
const data = url.data;
set({ allTickets: data });
},
}));
export const useTenantStore = create<TenantState>()((set, get) => ({
allTickets: {},
fetch: async (url: any) => {
const data = url.data;
set({ allTickets: data });
},
}));
UUUnknown User11/9/2022
Message Not Public
Sign In & Join Server To View
JSJ枚kull S贸lberg11/9/2022
I would also perhaps advise against this pattern ... the react-query cache is as global as zustand, so why not use that instead? Maybe I'm missing something 馃檪
TTCI11/14/2022
Thank you for the clarification

Looking for more? Join the community!

T
tRPC

zustand + trpc (basic data fetching)

Join Server