Can't get dropbox icon to show in Dashboard using CDN

Uppy
1

I’m loading in the CDN code for Uppy way above this, and then have this as the JS configuration with a tiny amount of data injected from PHP. Uppy works great, even talking to the server on the back end, but I don’t get the dropbox icon to show as an option. I’ve tried others, including Webcam, and those don’t show either. Does anyone have any clues?

<script>
const Dropbox = Uppy.Dropbox
const Tus = Uppy.Tus

var uppy = Uppy.Core()
    .use(Uppy.Dashboard, {
        autoProceed: false,
        inline: true,
        target: '#drag-drop-area',
        height: 300,
        showProgressDetails: true,
        showLinkToFileUploadResult: false, // I don't like these links - not a good idea to expose
        disableStatusBar: false,
        disableInformer: false,
        note: 'You can upload any file, of any size, into you job.',
    })

    .use(Tus, {
        endpoint: 'https://<?= APACHE_HOST ?>/uppy/upload',
        autoProceed: false,
        resume: true,
        autoRetry: true,    // I've not tested this.
        retryDelays: [0, 1000, 3000, 5000],
    })

    .use(Dropbox, {
        target: Dashboard,
        companionUrl: 'https://companion.uppy.io/',
    })


// Set the metadata that comes out in the array so we know where to put this file.
uppy.setMeta({job_uuid: '<?= $job_obj->uuid ?>'})
</script>
2

Welcome to the forum!

As for this issue, it seems very strange. I assume it’s a CDN related issue, as the icon is declared in JSX code, rather than being loaded from an external source.

    this.icon = () => (
      <svg aria-hidden="true" focusable="false" width="32" height="32" viewBox="0 0 32 32">
        <g fill="none" fill-rule="evenodd">
          <rect fill="#0D2481" width="32" height="32" rx="16" />
          <path d="M11 8l5 3.185-5 3.186-5-3.186L11 8zm10 0l5 3.185-5 3.186-5-3.186L21 8zM6 17.556l5-3.185 5 3.185-5 3.186-5-3.186zm15-3.185l5 3.185-5 3.186-5-3.186 5-3.185zm-10 7.432l5-3.185 5 3.185-5 3.186-5-3.186z" fill="#FFF" fill-rule="nonzero" />
        </g>
      </svg>
    )

And it is included in CDN link as well. In all honesty, maybe just make sure that you’re on the latest version. It might also be a browser compatibility issue, but I doubt it because the CDN code also ships with Polyfills

Although, I’d recommend not using the CDN. The docs warn about it here

:warning: The bundle consists of all plugins maintained by the Uppy team. This method is therefore not recommended for production, as your users will have to download all plugins, even if you are only using a few of them.

But I also don’t know how well module bundlers support PHP. But in general, it’s a better idea to use the NPM packages over the CDN

Sorry I couldn’t help too much. If you figured out what the issue was, let me know.

Best wishes,
- Andrew