Unable to return function and usestate from reusable component

I have a react app that allows multipule file uploads to fire base. I am trying to create the component to be resusable however I have run into an issue where I am unable to return the function and also the usestate araay.

const useUploader = (data, foldername) => {
  const [upLoadcomplete, setuploacomplete] = useState()

  const uploadFiles = async () => {
    // function doing things.. one of which is to setuploacomplete depending on outcome.  
    }
  return uploadFiles
}
export default useUploader

On another jsx there is a button which uses an on submit to call the custom hook, I would like for that hook to carry out the function, but also be able to update another div with the status if complete or now.. however I can’t seem to figure out how to do it. I was trying useEffects, but this caused the function to run before the submit button was pressed.. which isn’t want I wanted!

Any help would be great!!