Feature/#231 커스텀 alert 구현

[leemhyungyu]

이슈 #231

완료된 기능

• 커스텀 Alert 구현

고민했던 사항

TCA의 AlertState를 사용하면서 Custom Alert 구현하기

Custom Alert를 구현하는 방법에는 알아본 결과 2가지가 존재했음

1. Custom View를 만들어서 FullScreenCover로 View를 띄운다.
2. Custom Alert View와 Custom Alert Store를 통해 ViewModifier를 통해 띄운다.

이 두가지는 현재 구조에서 많은 변화가 있을 것이라고 예상되었고
현재 TCA의 AlertState를 그대로 사용하면서 현재 기본으로 보여지는 SwiftUI의 Alert를 Custom Alert로 교체하면 코드상 새롭게 바뀌는게 거의 없을 것이라고 판단

결국 TCA 내부 코드를 보면서 어떤 방식으로 Alert를 띄우는지 확인했고 이를 토대로 View만 Custom View로 바꾸는 작업으로 진행했음

기존의 코드의 틀에서 거의 벗어나지 않고 Modifier만 alert에서 새롭게 만든 bottleAlert로 변경하면 됨

변경 전

      .alert($store.scope(state: \.destination?.alert, action: \.destination.alert))

Custom Alert 적용 후

      .BottleAlert($store.scope(state: \.destination?.alert, action: \.destination.alert))

      case .doneButtonDidTapped:
        state.destination = .alert(.init(
          title: { TextState("신고하기")},
          actions: { ButtonState(
            role: .destructive,
            action: .confirmReport,
            label: { TextState("신고하기") }) },
          message: { TextState("접수 후 취소할 수 없으며 해당 사용자는 차단되요.\n정말 신고하시겠어요?")}))
        return .none

하지만! 기존의 alert를 사용하는 경우에 AlertState를 생성할 때 ButtonState의 role을 .destructive로 설정하면 자동으로 cancel 버튼을 만들어주지만
이는 TCA 내부 코드에서 actions의 개수에 따라서 SwiftUI의 Alert를 생성해주고 있었기에 이 부분은 Custom View로 설정해서 할 수 가 없었음

<AlertState 내부 코드>

그래서 만약 cancel 버튼이 필요하면

    case .needUpdateAppVersionErrorOccured:
      state.destination = .alert(.init(
        title: { TextState("신고하기")},
        actions: {
          ButtonState(
            role: .cancel,
            action: .dismiss,
            label: { TextState("취소하기") })
          
          ButtonState(
            role: .destructive,
            action: .needUpdateAppVersion,
            label: { TextState("신고하기") })
        },
        message: { TextState("접수 후 취소할 수 없으며\n해당 사용자는 차단돼요.\n정말 신고하시겠어요?")}))
      

이처럼 ButtonState를 추가해줘야함...

[JongHoooon]

혹시 여기 메소드명 소문자로 시작해야할거같아!

[leemhyungyu]

오케이! 이거랑 나머지 수정할 것들 좀 수정하고 머지할게!