Get dominant color from image in React JS

Question

I'm trying to get dominant color from a load image using this repo.

Here my try:

import React, { useState } from 'react';
import { ColorExtractor } from 'react-color-extractor';

const App = () => {

    const [colors, setColors] = useState([]);
    const getColors = color => {
        setColors([...colors, ...color])
    }

    const ColorGet = (file) => {
        //file.preview = blob
        return <>
            <ColorExtractor src={file.preview} getColors={getColors} />
            {console.log('colors: ', colors)}
        </>
    }

    const handleSubmit = async (values) => {
        ColorGet(values.upl_Picture[0]);
        //...
    }

    return <form onSubmit={handleSubmit} autoComplete="off" className="form">
        {/* ... */}
    </form>
}

export default App;

Why inside ColorGet the output for colors is an empty array?