SolidJS•2y ago

Right way of getting errors out of async context functions

I have a context that has methods that are async, the method itself on the context is sync, but that calls an Async method. This async method can throw an Unauthorized exception, it that happens i would like to redirect the user to "/signin". Would the correct way here be to have "error" signal that is read somewhere else on the UI thread and if that contains an error throw it, or are there a better way to do this?

export function PortfolioProvider(props: ProviderProps) {
  const { user, isAuthenticated } = useUser();

  const [loading, setLoading] = createSignal(false);
  const [transactions, setTransactions] = createSignal<Transaction[]>();
  const [pagination, setPagination] = createSignal<Pagination>();
  const [currentRequest, setCurrentRequest] = createSignal<TransactionRequest>();

  createEffect(() => {
    console.log("Fetching transactions", currentRequest());
    if (isAuthenticated() && currentRequest()) {
      _fetch(currentRequest());
    }
  });

  const _fetch = async (request: TransactionRequest | undefined) => {
    if (!request) return;
    setLoading(true);
    try {
      let response = await urqlClient(ContextHelpers.getAuthToken()).query(Queries.GetTransactions, request).toPromise();
      ContextHelpers.verifyGraphQLReponse(response);
      setTransactions(response.data.transactions.transactions as Transaction[]);
      setPagination(response.data.transactions.pagination as Pagination);
    } finally {
      setLoading(false);
    }
  };

  const response = {
    transactions,
    loading,
    fetch: (request: TransactionRequest) => {
      setCurrentRequest(request);
    },
  };

  return <TransactionContext.Provider value={response}>{props.children}</TransactionContext.Provider>;
}

export function PortfolioProvider(props: ProviderProps) {
  const { user, isAuthenticated } = useUser();

  const [loading, setLoading] = createSignal(false);
  const [transactions, setTransactions] = createSignal<Transaction[]>();
  const [pagination, setPagination] = createSignal<Pagination>();
  const [currentRequest, setCurrentRequest] = createSignal<TransactionRequest>();

  createEffect(() => {
    console.log("Fetching transactions", currentRequest());
    if (isAuthenticated() && currentRequest()) {
      _fetch(currentRequest());
    }
  });

  const _fetch = async (request: TransactionRequest | undefined) => {
    if (!request) return;
    setLoading(true);
    try {
      let response = await urqlClient(ContextHelpers.getAuthToken()).query(Queries.GetTransactions, request).toPromise();
      ContextHelpers.verifyGraphQLReponse(response);
      setTransactions(response.data.transactions.transactions as Transaction[]);
      setPagination(response.data.transactions.pagination as Pagination);
    } finally {
      setLoading(false);
    }
  };

  const response = {
    transactions,
    loading,
    fetch: (request: TransactionRequest) => {
      setCurrentRequest(request);
    },
  };

  return <TransactionContext.Provider value={response}>{props.children}</TransactionContext.Provider>;
}

1 Reply

lxsmnsyc•2y ago

yes that's one of the possible solutions

Gaming

Programming

Right way of getting errors out of async context functions