Code to Move Column Up or Down within a .Map() Function in Gutenberg

Use this inside your array function.

{/* Move Up Button */}
<Button
style={{ border: '1px solid', marginTop: '10px' }}
onClick={() => {
	if (index === 0) return; // Prevent moving the first item up
	const newTestimonials = [...testimonials];
	const temp = newTestimonials[index - 1];
	newTestimonials[index - 1] = newTestimonials[index];
	newTestimonials[index] = temp;
	setAttributes({ testimonials: newTestimonials });
}}
disabled={index === 0} // Disable if it's the first item
>
{__('Move Up')}
</Button>

{/* Move Down Button */}
<Button
style={{ border: '1px solid', marginTop: '10px' }}
onClick={() => {
	if (index === testimonials.length - 1) return; // Prevent moving the last item down
	const newTestimonials = [...testimonials];
	const temp = newTestimonials[index + 1];
	newTestimonials[index + 1] = newTestimonials[index];
	newTestimonials[index] = temp;
	setAttributes({ testimonials: newTestimonials });
}}
disabled={index === testimonials.length - 1} // Disable if it's the last item
>
{__('Move Down')}
</Button>

Here’s the button to remove the column

<Button
style={{border:'1px solid'}}
isDestructive
onClick={() => {
const newTestimonials = [...testimonials];
newTestimonials.splice(index, 1);
setAttributes({ testimonials: newTestimonials });
}}
>
{__('Remove Testimonial')}
</Button>

Here’s the code to Duplicate the column

{/* Duplicate Button */}
<Button
style={{ border: '1px solid', marginTop: '10px' }}
onClick={() => {
const newTestimonials = [...testimonials];
const duplicateFeature = { ...testimonial }; // Copy the testimonial object
newTestimonials.splice(index + 1, 0, duplicateFeature); // Insert the copy after the current testimonial
setAttributes({ testimonials: newTestimonials });
}}
>
{__('Duplicate Feature')}
</Button>

Add column below

<Button
    style={{border:'1px solid'}}
    onClick={() => {
        const newTestimonials = [...testimonials]; // Create a copy of the columns array
        const newColumn = { // Define a new column object
            col_class: '',
            col_style: '',
            col_id: '',
			data_aos: 'fade-up',
			data_aos_delay: '',
			img: '',
			img_alt:'',
			title: '',
			content: '',
			code_block: ''
        };
        newTestimonials.splice(index + 1, 0, newColumn); // Insert the new column at the current index
        setAttributes({ testimonials: newTestimonials }); // Update the columns attribute with the new array
    }}
>
    {__('Add Testimonial Below')}
</Button>

Add button above

<Button
    style={{border:'1px solid'}}
    onClick={() => {
        const newTestimonials = [...testimonials]; // Create a copy of the columns array
        const newColumn = { // Define a new column object
            col_class: '',
            col_style: '',
            col_id: '',
			data_aos: 'fade-up',
			data_aos_delay: '',
			img: '',
			img_alt:'',
			title: '',
			content: '',
			code_block: ''
        };
        newTestimonials.splice(index, 0, newColumn); // Insert the new column at the current index
        setAttributes({ testimonials: newTestimonials }); // Update the columns attribute with the new array
    }}
>
    {__('Add Testimonial Above')}
</Button>