Custom Block Inspiration

[Michelle_Valent]

Do you have a block idea that could transform your workflow but are not familiar with React?

Chime in with your ideas here! And if you’re a developer who is exploring the community forum for ideas, hopefully this thread can become a resource for inspiration and user feedback.

[Russell_Bishop1]

Fantastic idea.

Personally, I’ve been trying to wrap my head around a script that would take a selected record and split the value of one of it’s cells with a duplicate. This would really help for personal budgeting. So:

£155.34 | Supermarket

Split Record…

Creates a duplicate that I can enter an amount in…

£55.00 | Home
£100.34 | Supermarket

And the remainder is the new value on the old record.

You would need a <select> to choose which column you were splitting, and perhaps later would ask how many duplicates you wanted.

[Billy_Littlefie]

Hi @Russell_Bishop1 – the custom record-splitting you’re describing is definitely something that could be implemented with a new custom block, but it’s also very well-suited for the scripting block!

You got me curious, so I took a first-pass at what a script like that could look like – hopefully this can be a good starting point for your personal budgeting base. Here’s a quick video demo of the script running, and here’s the script itself:

const table = await input.tableAsync('Pick a table to split items in');
const field = await input.fieldAsync('Which field holds the value to split?', table);
const record = await input.recordAsync('Which record would you like to split?', table);

const recordsCreated = [];
const startingAmount = record.getCellValue(field);
let amountLeft = parseInt(startingAmount);

while (true) {
    output.clear();
    output.markdown(`### You have $${amountLeft} remaining to split. Continue splitting?`);

    const result = await input.buttonsAsync('', [{label: 'Split', variant: 'primary'}, 'All done']);
    if (result === 'All done') {
        break;
    }

    let amountToSplit;
    while (true) {
        const amountToSplitAsString = await input.textAsync('How much would you like to split out?');
        amountToSplit = parseInt(amountToSplitAsString);
        if (amountToSplit <= amountLeft) {
            break;
        }
        output.text('⚠️ That exceeds the amount left, try a lower value');
    }

    const name = await input.textAsync('What would you like to name this record?');
    const newRecordId = await table.createRecordAsync({
        [table.fields[0].id]: name, // Should probably replace `table.fields[0].id` here with a specific field name / ID
        [field.id]: amountToSplit
        // Add any additional fields you may want to set here (potentially using more inputs to choose a category, etc)
    });
    recordsCreated.push({recordId: newRecordId, oldValue: '-', newValue: amountToSplit});
    amountLeft -= amountToSplit;
    await table.updateRecordAsync(record, {
        [field.id]: amountLeft
    })
}
output.clear();
output.markdown(`### Created ${recordsCreated.length} new records`);

const resultTable = [
    {recordId: record.id, oldValue: startingAmount, newValue: amountLeft},
    ...recordsCreated
]
output.table(resultTable);

[Olpy_Acaflo]

Michelle_Valentine:

Do you have a block idea that could transform your workflow but are not familiar with React?

Chime in with your ideas here! And if you’re a developer who is exploring the community forum for ideas, hopefully this thread can become a resource for inspiration and user feedback.

hello @Michelle_Valentine,
I recently talked about it with @Kasra: I was writting:
"…/… make the scripting block better for me would be :

• SCRIPTABLE (or OPEN as Flowchart , Base-schema are) Page designer Block !

I really would try to enhance Page designer by SCRIPTing."

In addition to this self-quote, I would add Extended Export Options to this wishful Block project:

• RTF ;
• html-embed ;
• PDF as already existing .

Best,

olπ

[Russell_Bishop1]

Wow! Maybe you should work for Airtable… :winking_face:

That’s incredibly helpful @Billy_Littlefield, especially with the video explanation.

I made a few small edits to fit my scenario. The first was to swap parseInt to parseFloat (thanks Stackoverflow) because the first test run was dropping my decimal places. Gotta’ count the change…

The other is to remove the ‘What to name it?’ as my primary field is actually computed.

My final steps to explore now…

• Duplicate all of the content from the original entry
• Fill in the Linked Record for ‘Budget’
• Run this script on the Selected row

Thanks for this foundation Billy – really helped me make progress!

[Oliver_Holtz]

Thanks for the initiative, Michelle! I would like to get into react more, but I simply can’t find the time for it. Here is something I’ve been thinking about:

I store interview transcripts in Airtable, where individual statements are stored as individual records, called “Observations”. However, the overview of the transcript easily gets los. They are only linked to a particular session as a record in another table.
What I would like to create is a block that allows me to select the session I am interested in, and displays the linked observations in a certain format, including the speaker and time stamp, which are fields in the observations table.

A more general version of this might be a block that displays linked records in a more customisable way. So for example, I could imagine a block that helps me in this situation by displaying a summary of a linked record field that I select, which has multiple records linked. I would select the linked observations in my sessions table, for example, and have the linked observations displayed in a certain format. This could also be customizable so that other records that have links to multiple observations, e.g. tags that I am using to code my interview, can have their own custom summary of those observations.

I’ve used page designer before to re-create my transcripts, but it’s a very roundabout way to look for records in the page designer block when I’m going through them in my sessions table.

[Oliver_Holtz]

Another one where I was wondering if it’s possible: A block that previews audio and video attachments in the base. Similar to the URL preview block, but for attachments. Is this possible?

[andupotorac]

Can you actually attach audios and videos in the base? If yes, and if that’s something we can access using the APIs, we could make it. :slightly_smiling_face:

[Oliver_Holtz]

There’s an attachment field type, which I’ve used with both audio and video files. you can’t preview them inside of Airtable, but you can download them.

[andupotorac]

I was saying that we can build a block such that if you send the path to the video file in airtable, we can play it back in a video player. For example see this sample code:

jsbin.com

JS Bin

A live pastebin for HTML, CSS & JavaScript and a range of processors, including SCSS, CoffeeScript, Jade and more...