import { TextComponent } from 'obsidian';

export function setupArrayTextSetting(
	text: TextComponent,
	initialArray: string[],
	onChange: (array: string[]) => Promise<void>,
) {
	text.setValue(initialArray.join(', ')).onChange(async (value) => {
		const array = value
			.split(',')
			.map((field) => field.trim())
			.filter((field) => field.length > 0);

		await onChange(array);
	});

	text.inputEl.addEventListener('blur', () => {
		const currentValue = text.inputEl.value;
		const cleaned = currentValue
			.split(',')
			.map((field) => field.trim())
			.filter((field) => field.length > 0)
			.join(', ');

		if (currentValue !== cleaned) {
			text.setValue(cleaned);
		}
	});
}