/**
 * WordPress dependencies
 */
import { useCallback, useMemo } from '@safe-wordpress/element';
import { useDispatch, useSelect } from '@safe-wordpress/data';

/**
 * External dependencies
 */
import type { Maybe } from '@nelio-content/types';

/**
 * Internal dependencies
 */
import { store as NC_SETTINGS } from '../store';
import type { Attributes, FieldId } from '../store/types';

export function useAttributes< A extends Attributes >(
	field: FieldId,
	defaultAttrs: A
): [ A, ( attrs: Partial< A > ) => void ] {
	const attributes = useSelect(
		( select ) => select( NC_SETTINGS ).getAttributes< A >( field ),
		[ field ]
	);
	const { setAttributes } = useDispatch( NC_SETTINGS );
	const setNewAttributes = useCallback(
		( attrs: Partial< A > ) => setAttributes( field, attrs ),
		[ field, setAttributes ]
	);

	const merged = useMemo(
		() => ( { ...defaultAttrs, ...attributes } ) as A,
		[ defaultAttrs, attributes ]
	);
	return [ merged, setNewAttributes ];
}

export function useValue< T >(
	field: FieldId
): [ Maybe< T >, ( v: T ) => void ] {
	const value = useSelect(
		( select ) => select( NC_SETTINGS ).getValue< T >( field ),
		[ field ]
	);
	const { setValue } = useDispatch( NC_SETTINGS );
	const setNewValue = useCallback(
		( newValue: T ) => setValue( field, newValue ),
		[ field, setValue ]
	);
	return [ value, setNewValue ];
}