reactjs - 状態が既にあるため、useMemo と useCallback を一緒に使用して不要な API 呼び出しを防ぐにはどうすればよいですか?

Question

ボタンが 2 つあります。

クリックすると、テーブルに入力するリストが返されます。

<LunaNavGroupItem
 isActive={messageFilter === FILTERS.UNRESOLVED}
 label='Unresolved'
 onClick={() => {
  getMessagePath(UNRESOLVED_MESSAGES_PATH)
  }}
/>
<LunaNavGroupItem
 isActive={messageFilter !== FILTERS.UNRESOLVED}
 label='Everything'
 onClick={() => {
 setMessageFilter(false)
 getMessagePath(ALL_MESSAGES_PATH)
 }}
/>

私はこれを行うと思った：

const [
  MessageListDataProvider,
  useMessageListData
] = constate(() => {
  const [messagePath, useMessagePath] = useState(api.UNRESOLVED_MESSAGES_PATH);

  const getMessagePath = useCallback((newPath) => {
    // console.log('value.messages', value.messages)
    useMessagePath(newPath) 
  }, [messagePath])
    

この：

   {useMemo(
        () => orderBy(messages, 'createdAt', 'desc').map(message => (
          <MessageRow
            key={message.id}
            message={message}
            isSelected={isMessageSelected(message)}
            onSelectionChanged={() => {
              isMessageSelected(message)
                ? removeFromSelectedMessages(message)
                : addToSelectedMessages(message)
            }}
          />
        )),
        [messages]
      )}

マップ内のデータのリストの再レンダリングを妨げますか?

つまり、API 呼び出しは既に行っているので、ボタンをクリックすると最初の呼び出しのデータが表示されるのでしょうか? このように素早い経験....

私は何を間違っていますか？