import { useBoundStore } from '../store/store';
import { FieldMappingForm } from './importer/field-mapping-form';
import { CSVImportForm } from './importer/csv-import-form';
import { PricingRulesEditor } from './pricing-rules-editor/pricing-rules-editor';
import { ImportNotices } from './import-notices';
import { Banners } from './banners';

function ViewRouter() {
	const { activeView } = useBoundStore();

	switch (activeView) {
		case 'importer.field-mappings-form': {
			return <FieldMappingForm />;
		}
		case 'importer.csv-import-form': {
			return <CSVImportForm />;
		}
		default: {
			return <PricingRulesEditor />;
		}
	}
}

export function MainSettingsSection() {
	return (
		<>
			<ImportNotices />
			<Banners />
			<ViewRouter />
		</>
	);
}