// Metro module 11022 (f11023).
import { useState } from "react";
import { AnalyticEvents } from "../../../Constants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import { intl, t } from "../../../intl/index.native";
import { RaidLockdownFeedbackType } from "../../guild_automod/AutomodFeedback";
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
import { ActionSheet } from "../../../design/components/Sheet/native/ActionSheet.native";
import { BottomSheetTitleHeader } from "../../../design/components/Sheet/native/BottomSheetTitleHeader.native";
import KeyboardAwareView from "../../keyboard/native/KeyboardAwareView";
import { TableRowGroup } from "../../../design/components/TableRow/native/TableRowGroup.native";
import { TableCheckboxRow } from "../../../design/components/TableRow/native/TableCheckboxRow.native";
import { TextArea } from "../../../design/components/TextInput/native/TextArea.native";
import { Button } from "../../../design/components/Button/native/Button.native";
import { trackWithMetadata } from "../../app_analytics/AppAnalyticsUtils";
const useStyles = createStyles({
  container: {
    display: "flex",
    gap: 24
  }
});
export default function GuildRaidLockdownFeedbackActionSheet(props) {
  const guildId = props.guildId;
  const styles = useStyles();
  const [state, setState] = useState([]);
  const [state2, setState2] = useState();
  const r17 = [{
    text: intl.string(t["//3pvi"]),
    value: RaidLockdownFeedbackType.DM_SPAM
  }, {
    text: intl.string(t.SdVsip),
    value: RaidLockdownFeedbackType.MENTION_SPAM
  }, {
    text: intl.string(t.uTiSVL),
    value: RaidLockdownFeedbackType.CHANNEL_SPAM
  }, {
    text: intl.string(t.GQczU8),
    value: RaidLockdownFeedbackType.SUS_NEW_MEMBERS
  }, {
    text: intl.string(t.AAgqy3),
    value: RaidLockdownFeedbackType.CHANGING_SETTINGS
  }, {
    text: intl.string(t.ryPKb7),
    value: RaidLockdownFeedbackType.OTHER
  }];
  return <ActionSheet startExpanded header={<BottomSheetTitleHeader title={intl.string(t.f5hd9P)} />}>
    <KeyboardAwareView style={styles.container}>
      <TableRowGroup hasIcons={false}>
        {r17.map(({ text, value }) => <TableCheckboxRow key={value} onPress={() => {
          const value2 = value;
          setState(state.includes(value) ? (a0) => a0.filter((item) => item !== value2) : (a0) => [...a0, value2]);
        }} checked={state.includes(value)} label={text} />)}
      </TableRowGroup>
      {state.includes(RaidLockdownFeedbackType.OTHER) && <TextArea autoComplete="off" value={state2} placeholder={intl.string(t["PAM+JR"])} onChange={function onChange(event) {
        setState2(event);
      }} />}
      <Button onPress={function onPress() {
        trackWithMetadata(AnalyticEvents.GUILD_RAID_LOCKDOWN_FEEDBACK, {
          raid_lockdown_feedback_type: state,
          raid_lockdown_feedback_other_reason: state2,
          guild_id: guildId
        });
        ActionSheetActionCreators.hideActionSheet("GuildRaidLockdownFeedbackActionSheet");
      }} text={intl.string(t.nAt0rE)} />
    </KeyboardAwareView>
  </ActionSheet>;
};