Changing file name in attachment fields

[kennypurnomo]

// Setup start
const mainTable = base.getTable(“Inventory”)
const mainTable_imageFieldName = “image1”
const mainTable_nameFieldName = “Deskera No”
// Setup end
const mainQuery = await mainTable.selectRecordsAsync({
fields:[mainTable_nameFieldName, mainTable_imageFieldName]
})

// Build new attachment data
let updates =
for (let record of mainQuery.records) {
let name = record.getCellValue(mainTable_nameFieldName)
let attachments = record.getCellValue(mainTable_imageFieldName)
if (attachments != null && attachments.length ) {
for (let attachment of attachments){
let parts = attachment.filename.split(“.”)
let ext = parts[parts.length - 1]
let fileNumber = “0” + (attachments.indexOf(attachment) + 1)
let newName = name + “-” + fileNumber+“.”+ext
// let newName = ${name}-${fileNumber}.${ext}
// let attachmentName = name + " - " + attachment.filename

        updates.push({
            id: record.id,
            fields: {   
                [mainTable_imageFieldName]: [{
                    url: attachment.url,
                    // filename: attachmentName
                    filename: newName
                }]
            }
        })
    }
}

}

// Update records
while (updates.length) {
await mainTable.updateRecordsAsync(updates.slice(0, 50))
updates = updates.slice(50)
}

I have this code but then it updates the name but only returns the last image. May i know that is the issue?

[Justin_Barrett]

The issue is with the design of the main loop. What you want to create is an update for each record that contains all of the attached images with their new names. What you actually have, though, is a collection of updates that only contain a single attachment each.

For example, if one of your original records contains five attached images, the updates array will contain one update for each image, meaning that the same record will be updated five times—once per image—with the final image being the only one that remains.

Fixing this will require a redesign of the main loop. Instead of executing the updates.push method once for each renamed attachment, the code needs to aggregate all renamed image data for a single record, and then push all of those changes at the same time before moving on to the next record from the query.

[Kenny_Purnomo]

Thanks Justin. Would you mind tweaking the code for me?

Your help will be appreciated greatly!

[Justin_Barrett]

I’m happy to help guide you through it, but unfortunately I don’t code for free. Here are the basic changes that are needed:

• If you find attachments on a record, make an empty array to contain all changes for them.
• Push each attachment name change as an object to that array, in the same object format that’s required for the attachment field.
• Once all attachments are processed for a given record, then add a single change to the updates array that passes your collection of name change data, which is only a small change to the current updates.push statement.

Take it a step at a time. If you get stuck, feel free to ask for more help.

[kennypurnomo]

Justin, Do we have a “playground” to play around with the code so that I can see what happens in my code first instead of changing it live?

[Justin_Barrett]

There isn’t a built-in playground or sandbox environment inside of Airtable, but it’s not hard to make a quick mockup. In this case it looks like all of your data lives in a single table, so a quick way to test would be to duplicate the table and all of its data, and run all of your tests in the duplicate. It’s a quick matter of changing the table name in your code to the mockup table, then back to your live table once you’ve confirmed that everything is working well. If you have a case where data across multiple tables is being processed, a similar mockup can be made by duplicating the entire base.

For general JavaScript sandbox tests, there are several sites where you can build and test your code. One of my go-to sites is JSFiddle. There’s also CodePen, though that one leans more toward project sharing, whereas JSFiddle presents you with a blank slate immediately.