How to use the activestorage.DirectUpload function in activestorage

this.uppy.log(`[XHRUpload] ${id} progress: ${ev.loaded} / ${ev.total}`);
        timer.progress();

        if (ev.lengthComputable) {
          this.uppy.emit('upload-progress', file, {
            uploader: this,
            bytesUploaded: ev.loaded,
            bytesTotal: ev.total
          })
        }
      }
      directHandlers.directUploadWillStoreFileWithXHR = (request) => {
        request.upload.addEventListener("progress", event => directHandlers.directUploadDidProgress(event))
      }

      const upload = new DirectUpload(file.data, this.opts.directUploadUrl, directHandlers);
      const id = cuid();

      upload.create((error, blob) => {
        this.uppy.log(`[XHRUpload] ${id} finished`);
        timer.done();

        if(error) {
          const response = {
            status: 'error',
          };

          this.uppy.setFileState(file.id, { response });

          this.uppy.emit('upload-error', file, error);
          return reject(error);
        } else {

constructor(file, directUploadUrl, blobUrlTemplate, callback, progress) {
    this.file = file
    this.directUploadUrl = directUploadUrl
    this.blobUrlTemplate = blobUrlTemplate
    this.callback = callback
    this.progress = progress
    this.directUpload = new DirectUpload(file, this.directUploadUrl, this)
  }

constructor(file: File, options: Options) {
    this.options = { ...Upload.defaultOptions, ...compactObject(options) }
    this.directUpload = new ActiveStorage.DirectUpload(
      file,
      this.directUploadsUrl,
      this
    )

    this.handleChangeFile({ state: 'waiting', id: this.id, file })
  }

constructor (input: HTMLInputElement, file: File) {
    validate(input, file)
    const form = input.closest('form')
    const iconContainer = document.getElementById(input.dataset.iconContainerId)
    if (!(form instanceof HTMLFormElement && iconContainer)) return

    this.input = input
    this.form = form
    this.url = this.input.dataset.directUploadUrl
    this.iconContainer = iconContainer
    this.file = file
    this.upload = new DirectUpload(this.file, this.url, this)
    const event = this.dispatch('initialize')
    initializeUI(event)
  }

constructor(file, directUploadUrl, blobUrlTemplate, callback) {
    this.file = file
    this.directUploadUrl = directUploadUrl
    this.blobUrlTemplate = blobUrlTemplate
    this.callback = callback
    this.directUpload = new DirectUpload(file, this.directUploadUrl, this)
  }