fix: 메인 홈 - 인기 크리에이터

- 팔로우 수 제거
- 팔로우 버튼 추가
- 배경: 그라데이션 제거, 하나의 색으로 설정

SodaLive/Sources/Home/HomeCreatorRankingItemView.swift

@@ -11,54 +11,55 @@ import Kingfisher
 struct HomeCreatorRankingItemView: View {
     
     let rank: Int
-    let item: GetExplorerSectionCreatorResponse
+    @State var item: GetExplorerSectionCreatorResponse
+    
+    let onClickFollow: (Int, Bool) -> Void
     
     let crowns = ["rank_1", "rank_2", "rank_3"]
     
+    @AppStorage("token") private var token: String = UserDefaults.string(forKey: UserDefaultsKey.token)
+    
     var body: some View {
         ZStack(alignment: .topLeading) {
             VStack(spacing: 0) {
                 KFImage(URL(string: item.profileImageUrl))
                     .cancelOnDisappear(true)
                     .resizable()
-                    .frame(width: 70, height: 70)
+                    .frame(width: 84, height: 84)
                     .clipShape(Circle())
-                
+                               
                 Text(item.nickname)
-                    .font(.custom(Font.preRegular.rawValue, size: 18))
+                    .font(.custom(Font.preRegular.rawValue, size: 16))
                     .foregroundColor(.white)
-                    .padding(.top, 8)
+                    .padding(.top, 20)
                 
-                Text("팔로워")
-                    .font(.custom(Font.preBold.rawValue, size: 14))
-                    .foregroundColor(Color(hex: "78909C"))
-                    .padding(.top, 12)
+                Spacer()
                 
-                Text("\(item.followerCount)")
-                    .font(.custom(Font.preRegular.rawValue, size: 14))
-                    .foregroundColor(Color(hex: "78909C"))
-                    .padding(.top, 4)
+                if item.id != UserDefaults.int(forKey: .userId) {
+                    Text(item.follow ? "팔로잉" : "팔로우")
+                        .font(.custom(Font.preRegular.rawValue, size: 14))
+                        .padding(.vertical, 4)
+                        .frame(maxWidth: .infinity)
+                        .background(
+                            item.follow ? Color(hex: "455a64") : Color.white
+                        )
+                        .cornerRadius(999)
+                        .foregroundColor(
+                            item.follow ? .white : Color(hex: "263238")
+                        )
+                        .onTapGesture {
+                            if !token.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty {
+                                item.follow = !item.follow
+                            }
+                            
+                            onClickFollow(item.id, item.follow)
+                        }
+                }
             }
-            .frame(width: 133, height: 188)
-            .background(
-                LinearGradient(
-                    gradient: Gradient(colors: [Color(hex: "5ACDE1"), Color(hex: "2A339D")]),
-                    startPoint: .topLeading,
-                    endPoint: .bottom
-                )
-            )
+            .padding(16)
+            .frame(width: 144, height: 204)
+            .background(Color(hex: "263238"))
             .cornerRadius(16)
-            .overlay {
-                RoundedRectangle(cornerRadius: 16)
-                    .strokeBorder(
-                        LinearGradient(
-                            gradient: Gradient(colors: [Color(hex: "9AE2F6"), .white.opacity(0)]),
-                            startPoint: .top,
-                            endPoint: .bottom
-                        ),
-                        lineWidth: 1
-                    )
-            }
             .padding(.top, 20)
             
             if rank <= 3 {
@@ -79,7 +80,8 @@ struct HomeCreatorRankingItemView: View {
             nickname: "유빈ASMR",
             tags: "",
             profileImageUrl: "https://cf.sodalive.net/profile/34806/34806-profile-49db6b45-bb1e-4dc7-917e-1a614a853f5f-4232-1752158072656",
-            followerCount: 1000
-        )
+            follow: true
+        ),
+        onClickFollow: { _, _ in }
     )
 }