async function insert_palette_section(section) {
	// insert new_section to page sections at given index, set other indeces accordingly
	const original_sections = _.cloneDeep(get(stores.sections))
	const original_palette_sections = original_sections.filter((s) => s.palette === section.palette).sort((a, b) => a.index - b.index)

	const updated_palette_sections = [...original_palette_sections.slice(0, section.index), section, ...original_palette_sections.slice(section.index)].map((s, i) => ({ ...s, index: i }))
	const updated_sections = original_sections.flatMap((section) => {
		if (section.palette) {
			const updated_palette_section = updated_palette_sections.find((s) => s.id === section.id)
			return updated_palette_section
		} else return section
	})
	updated_sections.push(section)

	// STORE: set updated sections
	stores.sections.set(updated_sections)

	// DB: update palette section indeces
	await Promise.all(
		updated_palette_sections.map((s) =>
			dataChanged({
				table: 'sections',
				action: 'update',
				id: s.id,
				data: { index: s.index }
			})
		)
	)
}
Inserts a new section into the palette and updates the indices of existing sections.

@param {Object} section - The new section to be inserted.
@param {string} section.id - The ID of the new section.
@param {number} section.index - The index where the new section should be inserted.
@param {string} section.palette - The ID of the palette where the section should be inserted.
@returns {Promise<void>}