import { Field } from '@rocket.chat/fuselage';
import React from 'react';

import AssetSettingInput from './AssetSettingInput';

export default {
	title: 'admin/settings/inputs/AssetSettingInput',
	component: AssetSettingInput,
	decorators: [
		(storyFn) => (
			<div className='rc-old'>
				<div className='page-settings'>
					<Field>{storyFn()}</Field>
				</div>
			</div>
		),
	],
};

export const _default = () => <AssetSettingInput _id='setting_id' label='Label' />;

export const disabled = () => <AssetSettingInput _id='setting_id' label='Label' disabled />;

export const withValue = () => (
	<AssetSettingInput _id='setting_id' label='Label' value={{ src: 'https://open.rocket.chat/images/logo/logo.svg' }} disabled />
);

export const withFileConstraints = () => (
	<AssetSettingInput _id='setting_id' label='Label' fileConstraints={{ extensions: ['png', 'jpg', 'gif'] }} disabled />
);