How to query with async/await

I'm trying to initialise my react context store on mount with data coming from trpc.
I'm using the t3 stack right now, and it's not immediately obvious on how to wait for the data to load before setting it in the store..
I'm using zustand and he is a snippet of my code

export const defaultInitState: State = {
  user: null,
  session: null,
  permissions: {
    user: false,
    admin: false
  },
  tenants: [],
  users: null
};

// Store
export const createUserStore = (initState: State = defaultInitState) => {
  return createStore<Store>()((set) => ({
    ...initState,
    reloadUsers: async () => {
      const query = api.users.all.useQuery();
      /// wait for query to be loaded and set the store's user data to the query data
    },
    reloadTenants: async () => {},

    reset: async () => {
      set(defaultInitState);

    }
  }));
};

export const defaultInitState: State = {
  user: null,
  session: null,
  permissions: {
    user: false,
    admin: false
  },
  tenants: [],
  users: null
};

// Store
export const createUserStore = (initState: State = defaultInitState) => {
  return createStore<Store>()((set) => ({
    ...initState,
    reloadUsers: async () => {
      const query = api.users.all.useQuery();
      /// wait for query to be loaded and set the store's user data to the query data
    },
    reloadTenants: async () => {},

    reset: async () => {
      set(defaultInitState);

    }
  }));
};

export const defaultInitState: State = {
  user: null,
  session: null,
  permissions: {
    user: false,
    admin: false
  },
  tenants: [],
  users: null
};

// Store
export const createUserStore = (initState: State = defaultInitState) => {
  return createStore<Store>()((set) => ({
    ...initState,
    reloadUsers: async () => {
      const query = api.users.all.useQuery();
      /// wait for query to be loaded and set the store's user data to the query data
    },
    reloadTenants: async () => {},

    reset: async () => {
      set(defaultInitState);

    }
  }));
};

export const defaultInitState: State = {
  user: null,
  session: null,
  permissions: {
    user: false,
    admin: false
  },
  tenants: [],
  users: null
};

// Store
export const createUserStore = (initState: State = defaultInitState) => {
  return createStore<Store>()((set) => ({
    ...initState,
    reloadUsers: async () => {
      const query = api.users.all.useQuery();
      /// wait for query to be loaded and set the store's user data to the query data
    },
    reloadTenants: async () => {},

    reset: async () => {
      set(defaultInitState);

    }
  }));
};

How to query with async/await

Similar Threads