// Metro module 10185 (f10186).
import * as Module19 from "react";
import { forwardRef, useRef, useState, useMemo, useCallback, useEffect, useImperativeHandle } from "react";
import { ScrollView, View } from "react-native";
import ChannelStore from "../../../stores/ChannelStore";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import useSafeAreaInsetsKeyboardAware_native from "../../safe_area/useSafeAreaInsetsKeyboardAware.native";
import { useStateFromStores } from "../../../_bundle/Module589";
import useChannelName from "../../channel/useChannelName";
import useInitialValue from "../../../hooks/useInitialValue";
import AvatarUtils from "../../../utils/AvatarUtils";
import useAnnounceAsyncCompletion_native from "../../a11y/native/useAnnounceAsyncCompletion.native";
import ChannelActionCreators from "../../../actions/ChannelActionCreators";
import { intl, t } from "../../../intl/index.native";
import ToastActionCreators from "../../toast/native/ToastActionCreators";
import { CircleErrorIcon } from "../../../design/components/Icon/native/redesign/generated/CircleErrorIcon";
import IconUploader from "../../../components_native/common/IconUploader";
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
import { Text } from "../../../design/components/Text/native/Text";
import { TextInput } from "../../../design/components/TextInput/native/TextInput.native";
import { Button } from "../../../design/components/Button/native/Button.native";
import CountDown from "../../../components_native/common/CountDown";
let c6791_11 = "CLEARED_ICON";
const useStyles = createStyles({
  container: {
    backgroundColor: Module712.colors.MOBILE_ACTIONSHEET_BACKGROUND
  },
  iconUploader: {
    marginTop: Module712.space.PX_24,
    alignSelf: "center"
  },
  iconClear: {
    marginTop: Module712.space.PX_8,
    alignSelf: "center"
  },
  textInput: {
    marginVertical: Module712.space.PX_16
  },
  rateLimitedContainer: {
    marginTop: Module712.space.PX_8,
    gap: Module712.space.PX_8,
    flexDirection: "row",
    alignItems: "center"
  },
  rateLimitedText: {
    fontSize: 12,
    color: Module712.colors.TEXT_FEEDBACK_CRITICAL
  }
});
const r73 = Module19.memo(forwardRef(function({ channelId, onFinish }, a1) {
  let r210;
  let c17749_3, ref, state, c17749_6, state2, setState, callback, state3, setState2, setState3, c17749_13;
  c17749_3 = void 0;
  ref = void 0;
  state = void 0;
  c17749_6 = void 0;
  state2 = void 0;
  setState = void 0;
  callback = void 0;
  state3 = void 0;
  setState2 = void 0;
  setState3 = void 0;
  c17749_13 = void 0;
  const styles = useStyles();
  const insets = useSafeAreaInsetsKeyboardAware_native({
    includeKeyboardHeight: true
  }).insets;
  const stateFromStores = useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId));
  let r48 = useChannelName(stateFromStores);
  if (r48 == null) {
    r48 = "";
  }
  const initialValue = useInitialValue(r48);
  c17749_3 = initialValue;
  ref = useRef(null);
  let onChange;
  [state, onChange] = useState(void 0);
  let r3 = state != null;
  const placeholder = r48;
  if (r3) {
    r3 = state.length > 0;
  }
  if (r3) {
    r3 = state !== initialValue;
  }
  c17749_6 = r3;
  [state2, setState] = useState(void 0);
  const icon = state2 !== c6791_11 ? state2 == null ? stateFromStores?.icon : state2 : void 0;
  const r7 = (stateFromStores == null ? void 0 : stateFromStores.isManaged()) !== true;
  const r66 = r7 && (state2 != null && state2 !== c6791_11 || stateFromStores?.icon != null);
  const memo = useMemo(() => ({
    makeURL: (a0) => AvatarUtils.getChannelIconURL({
      id: channelId,
      icon: a0,
      applicationId: stateFromStores == null ? void 0 : stateFromStores.getApplicationId(),
      size: 64
    }),
    clear: () => {
      setState(stateFromStores?.icon != null ? c6791_11 : void 0);
    }
  }), [stateFromStores, channelId]);
  callback = useCallback(() => state2 != null || c17749_6, [r3, state2]);
  [state3, setState2] = useState(null);
  let isDisabled;
  [isDisabled, setState3] = useState(false);
  const announceAsyncCompletion_native = useAnnounceAsyncCompletion_native();
  c17749_13 = announceAsyncCompletion_native;
  const callback2 = useCallback(async () => {
    let c26629_2;
    let c26629_3 = 0;
    let c30201_0;
    L16: {
      try {
        L14: {
          c26629_3 = 2;
          setState3(true);
          if (state2 != null) {
            await ChannelActionCreators.setIcon(channelId, state2 !== c6791_11 ? state2 : null);
            if (state != null && state.length > 0) {
              await ChannelActionCreators.setName(channelId, state);
            }
          } else {
            if (!(state != null && state.length > 0)) {
              await c17749_13(intl.string(t.ZhunuI));
              break L14;
            }
            await ChannelActionCreators.setName(channelId, state);
          }
          await c17749_13(intl.string(t.ZhunuI));
        }
        (0, onFinish)();
        c26629_3 = 1;
        c26629_3 = 0;
        (0, setState3)(false);
      } catch ($e) {
        const r40 = $e;
        let r7 = r40;
        c26629_2 = r40;
        let r41 = c26629_3;
        if (r41 !== 0) {
          while (true) {
            if (r41 === 1) {
              try {
                const r280 = c26629_2;
                c26629_3 = 0;
                (0, setState3)(false);
                throw r280;
              } catch (r278) {
                r7 = r278;
                c26629_2 = r278;
                r41 = c26629_3;
                if (r41 === 0) {
                  break;
                }
              }
            } else {
              try {
                const r229 = c26629_2;
                c26629_3 = 1;
                c30201_0 = r229;
                if (c30201_0.body?.retry_after != null) {
                  setState2(c30201_0.body?.retry_after);
                } else {
                  ToastActionCreators.open({
                    key: "GCM_ERROR_GENERIC",
                    IconComponent: CircleErrorIcon,
                    content: intl.formatToPlainString(t.r477WB, {
                      code: c30201_0.status
                    })
                  });
                }
                c26629_3 = 0;
                (0, setState3)(false);
                break L16;
              } catch (r227) {
                r7 = r227;
                c26629_2 = r227;
                r41 = c26629_3;
                if (r41 === 0) {
                  break;
                }
              }
            }
          }
        }
        throw r7;
      }
    }
  }, [announceAsyncCompletion_native, channelId, state, state2, onFinish]);
  useEffect(() => {
    if (ref.current != null) {
      ref.current.setText(c17749_3);
    }
  }, [initialValue]);
  useEffect(() => {
    if (state3 != null) {
      setTimeout(() => setState2(null), 1000 * state3);
    }
  }, [state3]);
  useImperativeHandle(a1, () => ({
    hasUnsavedChanges: callback
  }));
  if (stateFromStores == null) {
    r210 = <ScrollView style={styles.container} />;
  } else {
    const r121 = [<IconUploader style={styles.iconUploader} onUpload={setState} icon={icon} makeURL={memo.makeURL} disabled={!r7} />, r66 ? <PressableOpacity onPress={memo.clear} accessibilityRole="button">
      <Text style={styles.iconClear} variant="text-sm/semibold" color="text-link">
        {intl.string(t["uY+Nk/"])}
      </Text>
    </PressableOpacity> : null, <View style={styles.textInput}>
      <TextInput ref={ref} label={intl.string(t.GEGW3P)} placeholder={placeholder} onChange={onChange} isDisabled={isDisabled} isClearable />
    </View>, , ,];
    const props = {
      onPress: callback2,
      text: intl.string(t.K344S7),
      variant: callback() ? "primary" : "secondary",
      disabled: null,
      loading: null
    };
    const r176 = callback();
    props.disabled = r176 ? state3 != null : !r176;
    props.loading = isDisabled;
    r121[3] = <Button {...props} />;
    r121[4] = state3 != null ? <View style={styles.rateLimitedContainer}>
      <Text variant="text-sm/semibold" color="text-feedback-critical">
        {intl.string(t.Whhv4w)}
      </Text>
      <CountDown style={styles.rateLimitedText} deadline={Date.now() + 1000 * state3} />
    </View> : null;
    r210 = <ScrollView style={styles.container} contentContainerStyle={{
      paddingHorizontal: Module712.space.PX_16,
      paddingBottom: insets.bottom
    }}>{r121}</ScrollView>;
  }
  return r210;
}));
export default r73;