검색 결과가 없을 때 버그가 났습니다. saga를 통해 error가 발생하고 status가 failure일 상태일 때 처리를 해주면 됩니다. 삼항 연산자를 이용해 성공과 실패 시 조건부 렌더링을 진행했습니다.
const isSuccess = status === STATUS.Success
<main className={styles.wrapper}>
<Stack gaps={RESULT_GAP}>
<SearchForm />
<LinkToFilter />
{isSuccess ? (
<>
<Books items={items} />
<Pagination />
{isLoading && <Loading />}
</>
) : (
<div>데이터가 존재하지 않습니다.</div>
)}
</Stack>
</main>
간단하게 Routes 컴포넌트에서 처리했습니다. Switch의 특징을 이용해 맞는 url이 없다면 NotFound 페이지를 렌더링하도록 구현했습니다.
<Switch location={location}>
<Route exact path={ROUTES.HOME} component={Main} />
<Route path={ROUTES.RESULT} component={Result} />
<Route path={ROUTES.FILTERS} component={Filters} />
<Route component={NotFound} />
</Switch>
public 폴더 manifest.json에 logo192.png , logo512.png 파일이 없는데 참조하고 있습니다. manifest.json에서 두 파일을 지우면 해결됩니다.