react useState set empty array not working

Question

I have the following structure, and I don't know why it doesn't work.

Concept is transferring data from table to table. My structure is "A table" - "data Center" - "B table".

Here's my "data Center" code first

  const [selectedRows, setSelectedRows] = useState<String[]>([])
  const [transferedRows, setTransferedRows] = useState<String[]>([])

  const onClick = () => {
    onTransfer()
    //it works, when set empty array in here
    // setSelectedRows([])
  }

  const onTransfer = () => {
    const clone = _.cloneDeep(selectedRows)
    const merge = [...clone, ...transferedRows]
    
    restApi.call() //something rest api
    .then((response) => {
        if (response.result) {
          updateState(merge)
        } else {
          throw new Error()
        }
      })
  }

  const updateState = (merge: String[]) => {
    let data = _.cloneDeep(merge)
    data.map(()=>{...})
    
    selectedRows.map((item) => (...))

    setTransferedRows(data)
    //not working here, not update state immediately
    setSelectedRows([])
   }
...
return (
<>
<BTable
      ...
      selectedRows={selectedRows}
      setSelectedRows={setSelectedRows}
/>
</>

BTable code is here

  useEffect(() => {
    if (selectedRows.length === 0) {
      setSelectedRowKeys([])
    }
  }, [selectedRows])

I want to set selectedRows to be empty when onclick event is triggered.

It works when I setSelectedRows([]) on "onclick" function, but doesn't work on "updateState" function.

Anyone can explain why setSelectedRows([]) not working on "updateState" function?