Skip to content

Latest commit

 

History

History
115 lines (98 loc) · 3.63 KB

MIGRATE.md

File metadata and controls

115 lines (98 loc) · 3.63 KB
Raw

Migration Guide

From Uploader (uploader)

Steps:

  1. Install @bytescale/upload-widget
  2. Uninstall uploader
  3. Replace "uploader" with "@bytescale/upload-widget" in your import statements.
  4. Replace uploader with upload-widget in all CSS class name overrides (if you have any).
  5. Replace Uploader({apiKey}).open(params) with UploadWidget.open({apiKey, ...params })
    1. As such .open(...) now takes a mandatory configuration object, with apiKey being the only required field.
  6. Replace onUpdate: (files) => {} with onUpdate: ({uploadedFiles}) => {}.
  7. beginAuthSession and endAuthSession are now static methods on AuthManager from the @bytescale/sdk NPM package.
  8. url is now a static method on UrlBuilder from the @bytescale/sdk NPM package.
  9. onValidate has been replaced with onPreUpload: you should return an object of {errorMessage: "your error message"} instead of "your error message". (This can also be a promise.)

Before

import { Uploader } from "uploader";

const uploader = Uploader({
  apiKey: "free"
});

//
// Uploading files...
//
uploader
  .open({
    multi: true,
    onValidate: async file => "My Custom Error Message"
  })
  .then(files => {
    if (files.length === 0) {
      console.log("No files selected.");
    } else {
      console.log("Files uploaded:");
      console.log(files.map(f => f.fileUrl));
    }
  })
  .catch(err => {
    console.error(err);
  });

//
// Making URLs...
//
uploader.url("/my-uploaded-image.jpg", "thumbnail");

//
// JWT authorization...
//
await uploader.beginAuthSession("https://my-auth-url", async () => ({ Authorization: "Bearer AuthTokenForMyApi" }));

After

import { UploadWidget } from "@bytescale/upload-widget";
import { AuthManager, UrlBuilder } from "@bytescale/sdk";

//
// Uploading files...
//
UploadWidget.open({
  apiKey: "free",
  multi: true,
  onPreUpload: async file => ({ errorMessage: "My Custom Error Message" })
})
  .then(files => {
    if (files.length === 0) {
      console.log("No files selected.");
    } else {
      console.log("Files uploaded:");
      console.log(files.map(f => f.fileUrl));
    }
  })
  .catch(err => {
    console.error(err);
  });

//
// Making URLs...
//
UrlBuilder.url({
  accountId: "your-account-id",
  filePath: "/my-uploaded-image.jpg",
  options: {
    transformation: "preset",
    transformationPreset: "thumbnail"
  }
});

//
// JWT authorization...
//
await AuthManager.beginAuthSession({
  accountId: "your-account-id",
  authUrl: "https://my-auth-url",
  authHeaders: async () => ({ Authorization: "Bearer AuthTokenForMyApi" })
});

See also

Bytescale migration guides listed below: