zustand + trpc (basic data fetching)

Question

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()((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()((set, get) = ({
  allTickets: {},
  fetch: () = {
    const data = trpc.ticketService.getByTenantId.useQuery().data;
    set({ allTickets: data });
  },
}));

and this...

React.useEffect(() = {
    fetch(trpc.ticketService.getByTenantId.useQuery());
  }, []);

const fetch = useTenantStore((state) = state.fetch);

export const useTenantStore = create()((set, get) = ({
  allTickets: {},
  fetch: async (url: any) = {
    const data = url.data;
    set({ allTickets: data });
  },
}));

`

zustand + trpc (basic data fetching)

Looking for more? Join the community!