Skip to content

Commit

Permalink
docs: clarify assemblyOptions for @uppy/transloadit (#5226)
Browse files Browse the repository at this point in the history
Co-authored-by: Antoine du Hamel <antoine@transloadit.com>
  • Loading branch information
Murderlon and aduh95 authored Jun 10, 2024
1 parent f72aed7 commit 9ff3746
Showing 1 changed file with 17 additions and 39 deletions.
56 changes: 17 additions & 39 deletions docs/uploader/transloadit.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -224,43 +224,27 @@ The object you can pass or return from a function has this structure:
be
[used dynamically in your template](https://transloadit.com/docs/topics/assembly-instructions/#form-fields-in-instructions).

<details>
<summary>Examples</summary>
:::info

**As a function**
All your files end up in a single assembly and your `fields` are available
globally in your template. The metadata in your Uppy files is also sent along so
you can do things dynamically per file with `file.user_meta` in your template.

A custom `assemblyOptions()` option should return an object or a promise for an
object.
:::

```js
uppy.use(Transloadit, {
assemblyOptions(file) {
return {
params: {
auth: { key: 'TRANSLOADIT_AUTH_KEY_HERE' },
template_id: 'xyz',
},
fields: {
caption: file.meta.caption,
},
};
},
});
```
<details>
<summary>Examples</summary>

The `${fields.caption}` variable will be available in the Assembly spawned from
Template `xyz`. You can use this to dynamically watermark images for example.
**As a function**

`assemblyOptions()` may also return a Promise, so it could retrieve signed
Assembly parameters from a server. For example, assuming an endpoint
`/transloadit-params` that responds with a JSON object with
`{ params, signature }` properties:
Most likely you want to use a function to call your backend to generate a
signature and return your configuration.

```js
uppy.use(Transloadit, {
async assemblyOptions(file) {
const res = await fetch('/transloadit-params');
return response.json();
return res.json();
},
});
```
Expand All @@ -287,17 +271,10 @@ pass user input from a `<form>` to a Transloadit Assembly:
// This will add form field values to each file's `.meta` object:
uppy.use(Form, { getMetaFromForm: true });
uppy.use(Transloadit, {
getAssemblyOptions(file) {
return {
params: {
/* ... */
},
// Pass through the fields you need:
fields: {
message: file.meta.message,
},
};
},
async assemblyOptions() {
const res = await fetch('/transloadit-params');
return res.json();
};
});
```

Expand Down Expand Up @@ -379,7 +356,8 @@ uppy.use(Transloadit, {
```

Tranloadit will download the files and expose them to your Template as
`:original`, as if they were directly uploaded from the Uppy client.
`:original`, as if they were directly uploaded from the Uppy client.

:::note

For this to work, the upload plugin must assign a publicly accessible
Expand Down

0 comments on commit 9ff3746

Please sign in to comment.