nuxt-modules / cloudinary

Cloudinary Module for Nuxt
https://cloudinary.nuxtjs.org
MIT License
249 stars 34 forks source link

[Feature] CldUploadWidget Helper Functions #226

Closed colbyfayock closed 1 month ago

colbyfayock commented 1 month ago

Feature Request

Is your feature request related to a problem? Please describe.

Adopt new upload widget helper functions along with other front end frameworks that consume the URL Loader API.

Via https://github.com/cloudinary-community/cloudinary-util/pull/166

Example implementation: https://github.com/cloudinary-community/next-cloudinary/pull/492

Describe the solution you'd like

Usage:

import { generateSignatureCallback, generateUploadWidgetResultCallback, getUploadWidgetOptions, UPLOAD_WIDGET_EVENTS } from '@cloudinary-util/url-loader'

const signatureCallback = generateSignatureCallback({
  signatureEndpoint: '/asdf',
  fetch
})

const uploadOptions = getUploadWidgetOptions({
  signatureCallback
}, {
  cloud: {
    cloudName: 'testcloud',
    apiKey: 'abcd1234'
  }
});

const resultsCallback = generateUploadWidgetResultCallback({
  onError: (uploadError) => {
    // Example on storing error
    // setError(uploadError);
  },
  onResult: (uploadResult) => {
    // Example of storing results on any event
    // setResults(uploadResult);
  },
  onSuccess: (uploadResult) => {
    // Tapping into individual events
  }
});

cloudinary.createUploadWidget(uploadOptions, resultsCallback);

// UPLOAD_WIDGET_EVENTS can replace WIDGET_EVENTS manually managed in front end code
Baroshem commented 1 month ago

Hey, I have added this feature in https://github.com/nuxt-modules/cloudinary/pull/228 :)