[Feat] #217 - 다른 클립으로 링크 이동 및 UI 구현

[Genesis2010]

✨ 해결한 이슈

• Resolved: [Feat] 링크 이동 API, UI 와 로직 구현 #217

🛠️ 작업내용

• 다른 클립으로 링크 이동

구현 내용	SE	13 mini	15 pro
GIF

• 링크 제목 15자 제한 해제

구현 내용	13 mini
GIF

🖥️ 주요 코드 설명

ToasterBottomSheetViewController 높이 관련 로직 수정

extension ToasterBottomSheetViewController {
    func setupSheetPresentation(bottomHeight: CGFloat) {
        if let sheet = self.sheetPresentationController {
            sheet.detents = [.custom(resolver: { _ in bottomHeight - (self.view.hasNotch ? 34 : 0)})]
            sheet.preferredCornerRadius = 20
        }
    }
    // ...
}

BottomSheet 가 올라오고 닫은 후 다시 올라올 때 높이가 다른 현상과 함께 SE 에서 UI 가 잘리는 현상이 발생했습니다.

SE 에서 UI 가 잘리는 현상은 bottomHeigth 에서 40을 빼고 있어서 발생되는 현상이였습니다. 해당 부분을 제거하면 SE 에서는 해결되었지만 다른 기기에서 BottomSheet 가 더 높아지는 현상이 발생했습니다.

하단 SafeArea 크기 만큼 뺴주면 되겠다 생각했지만 다음과 같이 이상한 현상이 또 발생했습니다..

2024-10-24.1.27.16.mov

처음으로 bottomSheet 가 올라왔을때 self.view.safeAreaInsets.bottom 값이 0 으로 출력 되고 두번째로 올라왔을때는 정확하게 크기가 출력되는 것을 확인할 수 있었습니다.

ViewController 생명주기와 연관되어 있을거라 생각하였고 Autolayout 이 설정되어 높이가 정확하게 측정되는 사이클인 viewDidLayoutSubviews 에서 가장 먼저 출력되는 것을 확인했습니다.

viewDidLayoutSubviews 는 Auto Layout 이 모든 제약 조건을 처리하고 View 의 크기와 위치를 결정한 직후에 호출되는 역할을 담당하기 때문에 해당 사이클에서 높이를 측정할 수 있었던 것입니다!

즉, 처음엔 0 을 뻈었고 두번째로 34 를 뺴고 있었기 때문에 높이가 다른 bottomSheet 가 올라왔던 것 입니다

다만.. viewDidLayoutSubviews 을 추가하고 기존의 setupSheetPresentation 을 완전히 변경을 하려고 시도하려 했지만 너무 큰 작업이였고 여러 곳에서 bottomSheet 을 사용하고 있기 때문에 위험성을 낮추고 싶었습니다.

그래서 다음과 같이 해당 기기의 노치 여부를 확인해서 해당 크기를 직접 할당하여 뺼 수 있도록 구현했습니다

✅ Checklist

• 필요없는 주석, 프린트문 제거했는지 확인
• 컨벤션 지켰는지 확인

[mini-min]

고생하셨습니다!
뷰모델도 동시에 손보시고, 예상치 못한 시트 높이 이슈에, 계속된 기능추가로 헷갈려진 네이밍까지 친절하게 바꿔주시느라 생각보다 작업량이 많아보이네요 ㅎㅅㅎ..

버그가 하나 있는 것 같아서 지금은 코리단 것만 확인해주시고, 나중에 Fix 이슈하나 더 파서 작업해주시면 감사하겠습니다ㅜㅜ

해당 화면에서 툴팁을 작업해야해서 일단 머지하고 저도 작업을 진행해야 할것 같습니ㄷㅏ..ㅎㅅㅎ

클립 이동 시에 최초는 "완료 버튼 비활성화 -> 클립 선택 -> 완료 버튼 활성화 -> 완료 버튼 클릭 시에 클립 이동 진행"이 순서대로 이루어지는 것에 반해,
동일한 뷰에서 두 번째 작업부터는 "진입 시부터 완료 버튼 활성화 -> 클립 선택과 동시(완료 버튼은 누르지 않음)에 클립 이동 진행"으로 동작하고 있습니다!

이해 안되면 영상 확인해주시거나, 디코에 남겨주시면 더 자세하게 설명드릴게유~~
긴 작업 잘해주셔서 감사합니다!

ScreenRecording_10-25-2024.14-23-46_1.MP4

[mcrkgus]

고생하셨습니당 Combine 참고해서 저도 적용해볼게요🤤🤭

[Genesis2010]

8b50d14

민재님께서 말씀해주신 것처럼 클립이동 BottomSheet 가 올라올때 확인 버튼이 활성화 되어있는 부분을 확인했고 수정했습니다!

/// 이동할 클립을 선택 시 버튼의 UI 를 변경하는 동작
        let isCompleteButtonEnable = Publishers.Merge(
            input.changeButtonTap.map { false },  // bottomSheet 열릴 때 false
            input.selectedClip.map { _ in true }  // 클립 선택 시 true
        ).eraseToAnyPublisher()

다음과 같이 ChangeClipViewModel 에서 클립 이동을 눌렀을때 초기 버튼을 비활성화 할 수 있도록 Merge Publihser 를 추가했습니다.
Merge 는 여러개의 publisher 를 하나도 합칠때 사용되고 발생하는 이벤트를 시간 순서대로 하나의 스트림으로 만들어 줍니다.

즉, BottomSheet 을 여는 스트림과 변경할 클립을 선택하는 스트림, 독립적이지만 chageButtonTap 을 했을때는 BottomSheet 가 올라오면서 버튼을 항상 비활성화 하도록 false 를 전달, selectedClip 을 했을때는 true 를 전달합니다!