How to use the @rails/activestorage.DirectUpload function in @rails/activestorage

uploadFile(file) {
      this.existingAvatar = null;
      const url = this.railsDirectUploadsPath;
      const upload = new DirectUpload(file, url, {
        directUploadWillStoreFileWithXHR: (xhr) => {
          // Use this workaround to make sure that Direct Upload-ed images are
          // uploaded with the correct header. Otherwise they will end up being
          // private files.
          xhr.setRequestHeader('x-amz-acl', 'public-read');
        }
      });

      upload.create((error, blob) => {
        if (error) {
          // TODO: Handle this error.
          console.log(error);
        } else {
          this.avatarBlob = blob.signed_id;
        }
      });

uploadFile(file) {
      const url = this.railsDirectUploadsPath;
      const upload = new DirectUpload(file, url, {
        directUploadWillStoreFileWithXHR: (xhr) => {
          // Use this workaround to make sure that Direct Upload-ed images are
          // uploaded with the correct header. Otherwise they will end up being
          // private files.
          xhr.setRequestHeader('x-amz-acl', 'public-read');
        }
      });

      upload.create((error, blob) => {
        if (error) {
          // TODO: Handle this error.
          console.log(error);
        } else {
          this.game.coverBlob = blob.signed_id;
        }
      });

constructor(attachment, element) {
    this.attachment = attachment
    this.element = element
    this.directUpload = new DirectUpload(attachment.file, this.directUploadUrl, this)
  }