codefordenver / partner-finder

Using an open dataset with registered colorado business to build a tool that manages outreach to potential CFD partners.
3 stars 14 forks source link

Feature/refactor leads #130

Closed clairefields15 closed 2 years ago

clairefields15 commented 2 years ago

Refactored Home component by moving LeadTable rendering into its own component. Also moved the LeadRow return into LeadRow component and render a leadrow when mapping over each lead in the array.

Did a minimal refactor of the fetch call in Home so that there is slightly more robust error handling and a .catch for the fetch request. For a future todo, instead of console.logging the error message, should set it in state and display a message to the user if the fetch fails.

  const checkForErrors = (response) => {
    if (response.status === 200) {
      return response.json();
    } else if (response.status === 401) {
      history.push('/login');
    } else {
      throw new Error('Something went wrong');
    }
  };

  useEffect(() => {
    const url = `${API_HOST}/leads?page=${page}&perpage=${perpage}`;
    const token = localStorage.getItem('partnerFinderToken');
    if (!token) {
      history.push('/login');
    }
    fetch(url, {
      headers: {
        'Content-Type': 'application/json',
        Authorization: `Bearer ${token}`,
      },
    })
      .then((response) => checkForErrors(response))
      .then((data) => setLeads(data.leads))
      // TODO: create state for error and set state instead of just console.error
      // conditional rendering if there is an error
      .catch((error) => console.error(error.message));
  }, [page, perpage]);

closes #115