import { ScrollView, View } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { Controller } from 'react-hook-form';
import { Typography } from '../../../../core/components/Typography/Typography';
import { Radio } from '../../../../core/components/Radio';
import Header from './components/Header';
import { useStoriesNotificationSetting } from './hooks/useStoriesNotificationSetting';
export function StoriesNotificationSetting({
  community
}) {
  const {
    styles,
    isDirty,
    control,
    disabled,
    onSubmit,
    handleSubmit,
    notifications,
    accessibilityId
  } = useStoriesNotificationSetting({
    community
  });
  return /*#__PURE__*/React.createElement(SafeAreaView, {
    edges: ['top'],
    testID: accessibilityId,
    style: styles.container
  }, /*#__PURE__*/React.createElement(Header, {
    disabled: disabled,
    isFormDirty: isDirty,
    onSave: handleSubmit(onSubmit)
  }), /*#__PURE__*/React.createElement(ScrollView, {
    contentContainerStyle: styles.scrollContainer
  }, notifications.map((item, index, list) => /*#__PURE__*/React.createElement(View, {
    key: item.radio.name
  }, /*#__PURE__*/React.createElement(Controller, {
    control: control,
    name: item.radio.name,
    render: ({
      field: {
        onChange,
        value
      }
    }) => /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
      style: styles.labelContainer
    }, /*#__PURE__*/React.createElement(Typography.BodyBold, {
      style: styles.colorBase
    }, item.title), /*#__PURE__*/React.createElement(Typography.Caption, {
      style: styles.colorBaseShade1
    }, item.description)), /*#__PURE__*/React.createElement(Radio.Group, {
      value: value,
      onChange: onChange
    }, item.radio.items.map(radioItem => /*#__PURE__*/React.createElement(Radio.Option, {
      key: radioItem.value,
      value: radioItem.value
    }, /*#__PURE__*/React.createElement(Radio.Label, null, /*#__PURE__*/React.createElement(Typography.Body, null, radioItem.label)), /*#__PURE__*/React.createElement(Radio.Icon, null)))))
  }), index !== list.length - 1 && /*#__PURE__*/React.createElement(View, {
    style: styles.divider
  })))));
}
//# sourceMappingURL=StoriesNotificationSetting.js.map