테스트 필요

flatlist에 renderItem 안에서 함수를 선언해서 전달하는 경우

const renderItem = useCallback(
    ({ item, index }) => {
      const isActive = currentIndex === index;
      const fontColor = isActive ? 'content.inversePrimary' : 'content.primary';

      const handlePressTab = (): void => {
        const isLockedDayPressed = index > DUMMY_DATA.currentOnboardingDay - 1;

        if (isLockedDayPressed) {
          onOpen({
            text: '미션을 준비중이에요 🚧',
            subText:
              '해당 일차 미션이 준비중에 있어요. 오늘의 미션을 완료하고 이후 미션도 기대해주세요 😘',
            buttons: [
              {
                id: 'confirm',
                onPress: onClose,
                text: '확인',
              },
            ],
          });
          return;
        }

        setCurrentIndex(index);
      };

      return (
        <Touchable onPress={handlePressTab}>
          <TabWrapper isActive={isActive}>
            <OnboardingDayIcon
              isActive={isActive}
              isLocked={item.day > DUMMY_DATA.currentOnboardingDay}
              isCompleted={item.isCompleted}
              isCurrentDay={item.day === DUMMY_DATA.currentOnboardingDay}
            />

            <Typography label-4 color={fontColor}>
              {item.name}
            </Typography>
          </TabWrapper>
        </Touchable>
      );
    },
    [currentIndex, onClose, onOpen],
  );