✨#296: 마이페이지 필터링 - 정렬 필터 선택 모달 뷰

- 기존 OptionModalView 재사용

StreetDrop/StreetDrop.xcodeproj/project.pbxproj

@@ -150,6 +150,7 @@
 		6A51EC402C411FB000DEF6F3 /* MusicListTableView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A51EC3F2C411FB000DEF6F3 /* MusicListTableView.swift */; };
 		6A51EC672C48F22600DEF6F3 /* TapListView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A51EC662C48F22600DEF6F3 /* TapListView.swift */; };
 		6A51EC692C48F53400DEF6F3 /* MusicListFilterView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A51EC682C48F53400DEF6F3 /* MusicListFilterView.swift */; };
+		6A51EC6D2C49F2FA00DEF6F3 /* FilterType.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A51EC6C2C49F2FA00DEF6F3 /* FilterType.swift */; };
 		6A7D73D92BB11A0E009340E3 /* LevelUpGuideView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A7D73D82BB11A0E009340E3 /* LevelUpGuideView.swift */; };
 		6A7D73DD2BB14015009340E3 /* GradientProgressBar.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A7D73DC2BB14015009340E3 /* GradientProgressBar.swift */; };
 		6A7D73DF2BB15826009340E3 /* UIView+RoundCorners.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A7D73DE2BB15826009340E3 /* UIView+RoundCorners.swift */; };
@@ -430,6 +431,7 @@
 		6A51EC3F2C411FB000DEF6F3 /* MusicListTableView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MusicListTableView.swift; sourceTree = "<group>"; };
 		6A51EC662C48F22600DEF6F3 /* TapListView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TapListView.swift; sourceTree = "<group>"; };
 		6A51EC682C48F53400DEF6F3 /* MusicListFilterView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MusicListFilterView.swift; sourceTree = "<group>"; };
+		6A51EC6C2C49F2FA00DEF6F3 /* FilterType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FilterType.swift; sourceTree = "<group>"; };
 		6A7D73D82BB11A0E009340E3 /* LevelUpGuideView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LevelUpGuideView.swift; sourceTree = "<group>"; };
 		6A7D73DC2BB14015009340E3 /* GradientProgressBar.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GradientProgressBar.swift; sourceTree = "<group>"; };
 		6A7D73DE2BB15826009340E3 /* UIView+RoundCorners.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UIView+RoundCorners.swift"; sourceTree = "<group>"; };
@@ -1096,15 +1098,12 @@
 			isa = PBXGroup;
 			children = (
 				1867C81F2A4DDB8C00F8EC48 /* MyPageViewController.swift */,
-				6A51EC662C48F22600DEF6F3 /* TapListView.swift */,
-				6A51EC682C48F53400DEF6F3 /* MusicListFilterView.swift */,
-				1867C8232A4FFCDF00F8EC48 /* MusicListCell.swift */,
 				18EF9FC82A5C51FB00266D27 /* NicknameEditViewController.swift */,
-				1816ED3B2A680608005009FC /* MusicListSectionHeaderView.swift */,
-				0856524F2AFBB73100FD9BCB /* MyPageType.swift */,
+				6A51EC6A2C49F29C00DEF6F3 /* TabBar */,
+				6A51EC6B2C49F2BA00DEF6F3 /* MusicList */,
 				6A7D73D82BB11A0E009340E3 /* LevelUpGuideView.swift */,
 				6A7D73DC2BB14015009340E3 /* GradientProgressBar.swift */,
-				6A51EC3F2C411FB000DEF6F3 /* MusicListTableView.swift */,
+				6A51EC6C2C49F2FA00DEF6F3 /* FilterType.swift */,
 			);
 			path = View;
 			sourceTree = "<group>";
@@ -1416,6 +1415,26 @@
 			path = NetworkManagerTest;
 			sourceTree = "<group>";
 		};
+		6A51EC6A2C49F29C00DEF6F3 /* TabBar */ = {
+			isa = PBXGroup;
+			children = (
+				6A51EC662C48F22600DEF6F3 /* TapListView.swift */,
+				6A51EC682C48F53400DEF6F3 /* MusicListFilterView.swift */,
+			);
+			path = TabBar;
+			sourceTree = "<group>";
+		};
+		6A51EC6B2C49F2BA00DEF6F3 /* MusicList */ = {
+			isa = PBXGroup;
+			children = (
+				6A51EC3F2C411FB000DEF6F3 /* MusicListTableView.swift */,
+				1867C8232A4FFCDF00F8EC48 /* MusicListCell.swift */,
+				1816ED3B2A680608005009FC /* MusicListSectionHeaderView.swift */,
+				0856524F2AFBB73100FD9BCB /* MyPageType.swift */,
+			);
+			path = MusicList;
+			sourceTree = "<group>";
+		};
 		9AF428BDAA5509AEF1F4FB64 /* Frameworks */ = {
 			isa = PBXGroup;
 			children = (
@@ -2027,6 +2046,7 @@
 				C4D16FCC2A1B98B0008B076F /* UILabel+LineHeight.swift in Sources */,
 				1876F04A2A66EDF10064B887 /* MyMusic.swift in Sources */,
 				C419724A2ABDC94A00211222 /* DefaultDeletingMusicUseCase.swift in Sources */,
+				6A51EC6D2C49F2FA00DEF6F3 /* FilterType.swift in Sources */,
 				C41972462ABDC45000211222 /* DefaultClaimingCommentUseCase.swift in Sources */,
 				C45A4CB02A3710AC00EE9C36 /* ImageCacheError.swift in Sources */,
 				08F5745D2C46992500635B54 /* DefaultFetchingMyLevelUseCase.swift in Sources */,

StreetDrop/StreetDrop/Domain/Entity/ModalOption.swift

@@ -11,4 +11,5 @@ struct ModalOption {
     let icon: UIImage?
     let title: String
     let acton: UIAction
+    var isSelected: Bool = false
 }

StreetDrop/StreetDrop/Presentation/CommunityView/View/CommunityViewController.swift

@@ -870,6 +870,7 @@ private extension CommunityViewController {
         )
 
         let modalView = OptionModalViewController(
+            type: .music,
             firstOption: shareOption,
             secondOption: claimOption,
             thirdOption: blockOption
@@ -924,6 +925,7 @@ private extension CommunityViewController {
         )
 
         let modalView = OptionModalViewController(
+            type: .music,
             firstOption: shareOption,
             secondOption: claimOption,
             thirdOption: blockOption

StreetDrop/StreetDrop/Presentation/MyPage/View/FilterType.swift

@@ -0,0 +1,25 @@
+//
+//  FilterType.swift
+//  StreetDrop
+//
+//  Created by thoonk on 7/19/24.
+//
+
+import Foundation
+
+enum FilterType {
+    case newest
+    case oldest
+    case mostPopular
+
+    var title: String {
+        switch self {
+        case .newest:
+            return "최신순"
+        case .oldest:
+            return "오래된순"
+        case .mostPopular:
+            return "인기순"
+        }
+    }
+}

StreetDrop/StreetDrop/Presentation/MyPage/View/MyPageViewController.swift

@@ -28,6 +28,7 @@ final class MyPageViewController: UIViewController, Toastable, Alertable {
     private let selectedMusicEvent = PublishRelay<Int>()
     private let disposeBag = DisposeBag()
     private let totalMusicsCountRelay: ReplayRelay<Int> = .create(bufferSize: 1)
+    private let selectedFilterType: BehaviorRelay<FilterType> = .init(value: .newest)
 
     // MARK: - Init
 
@@ -399,6 +400,7 @@ private extension MyPageViewController {
             .disposed(by: disposeBag)
 
         bindTapButtonAction(in: tapListView)
+        bindFilterButtonAction(in: musicListFilterView)
 
         return tabBarView
     }
@@ -444,7 +446,25 @@ private extension MyPageViewController {
                 owner.updateScrollOffset()
             }
             .disposed(by: disposeBag)
-
+    }
+
+    func bindFilterButtonAction(in musicListFilterView: MusicListFilterView) {
+        musicListFilterView.rx.onSortFilterTap
+            .withLatestFrom(selectedFilterType)
+            .bind(with: self) { owner, type in
+                owner.showFilteringOptionsModal(with: type)
+            }
+            .disposed(by: disposeBag)
+
+        musicListFilterView.rx.onRegionFilterTap
+            .bind(with: self) { owner, _ in
+
+            }
+            .disposed(by: disposeBag)
+
+        selectedFilterType
+            .bind(to: musicListFilterView.rx.setSortButtonText)
+            .disposed(by: disposeBag)
     }
 
     func bindAction() {
@@ -645,7 +665,7 @@ private extension MyPageViewController {
     }
 }
 
-// MARK: - UICollectionView Methods
+// MARK: - Private Methods
 
 private extension MyPageViewController {
     func configureMusicDataSource() -> MusicDataSource {
@@ -671,6 +691,51 @@ private extension MyPageViewController {
 
         musicDataSource.apply(snapshot, animatingDifferences: true)
     }
+
+    func showFilteringOptionsModal(with selectedType: FilterType) {
+        let newestOption = ModalOption(
+            icon: UIImage(named: "icon-selected"),
+            title: FilterType.newest.title,
+            acton: filterMusicList(by: .newest),
+            isSelected: selectedType == .newest
+        )
+
+        let oldestOption = ModalOption(
+            icon: UIImage(named: "icon-selected"),
+            title: FilterType.oldest.title,
+            acton: filterMusicList(by: .oldest),
+            isSelected: selectedType == .oldest
+        )
+
+        let mostPopularOption = ModalOption(
+            icon: UIImage(named: "icon-selected"),
+            title: FilterType.mostPopular.title,
+            acton: filterMusicList(by: .mostPopular),
+            isSelected: selectedType == .mostPopular
+        )
+
+        let modalView = OptionModalViewController(
+            type: .filterMusicList,
+            firstOption: newestOption,
+            secondOption: oldestOption,
+            thirdOption: mostPopularOption
+        )
+
+        modalView.modalPresentationStyle = .overCurrentContext
+        self.navigationController?.present(modalView, animated: true)
+    }
+
+    func filterMusicList(by type: FilterType) -> UIAction {
+        return UIAction { [weak self] _ in
+            self?.selectedFilterType.accept(type)
+            self?.navigationController?.dismiss(animated: true)
+
+            /*
+             TODO:
+             - API 개발후 작업 예정
+             */
+        }
+    }
 }
 
 // MARK: - UITableViewDelegate

StreetDrop/StreetDrop/Presentation/MyPage/View/MusicListFilterView.swift → StreetDrop/StreetDrop/Presentation/MyPage/View/TabBar/MusicListFilterView.swift

@@ -26,6 +26,7 @@ final class MusicListFilterView: UIView {
         button.titleLabel?.font = .pretendard(size: 14, weightName: .regular)
         button.setImage(UIImage(named: "icon-arrow-down"), for: .normal)
         button.semanticContentAttribute = .forceRightToLeft
+//        button.imageEdgeInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: -10)
 
         return button
     }()
@@ -89,6 +90,12 @@ extension Reactive where Base: MusicListFilterView {
         }
     }
 
+    var setSortButtonText: Binder<FilterType> {
+        Binder(base) { base, type in
+            base.sortFilterButton.setTitle(type.title, for: .normal)
+        }
+    }
+
     var onSortFilterTap: Observable<Void> {
         base.sortFilterButton.rx.tap.mapVoid()
             .throttle(.seconds(2), scheduler: MainScheduler.instance)