[#268] CodeViewer의 예제 코드로 ProfileImageView의 code 영역 구현

yourssu · Jun 4, 2024 · 55352e5 · 55352e5
1 parent 3b0653d
commit 55352e5
Showing 1 changed file with 53 additions and 18 deletions.
diff --git a/YDS-Storybook/SwiftUI/Atom/ProfileImagePageView.swift b/YDS-Storybook/SwiftUI/Atom/ProfileImagePageView.swift
@@ -4,7 +4,7 @@
 //
 //  Created by 심상현 on 2023/09/04.
 //
-// 
+//
 
 import SwiftUI
 import YDS_SwiftUI
@@ -15,27 +15,62 @@ struct ProfileImagePageView: View {
     @State var imageSelectedIndex: Int = 0
     @State var sizeSelectedIndex: Int = 4
     @State var image: SwiftUIImage? = YDSSwiftUIImage.images[0]
+    @State var code: String = ""
 
     var body: some View {
-        StorybookPageView(sample: {
-            VStack {
-                image?.image.map {
-                    YDSProfileImageView(
-                        image: $0,
-                        size: YDSProfileImageView.ProfileImageViewSize.allCases[sizeSelectedIndex])
+        let contentView = StorybookPageView(
+            sample: {
+                VStack {
+                    image?.image.map {
+                        YDSProfileImageView(
+                            image: $0,
+                            size: YDSProfileImageView.ProfileImageViewSize.allCases[sizeSelectedIndex])
+                    }
                 }
-            }
-        }, options: [
-            Option.optionalImage(
-                description: "image",
-                images: YDSSwiftUIImage.images,
-                selectedImage: $image),
-            Option.enum(
-                description: "size",
-                cases: YDSProfileImageView.ProfileImageViewSize.allCases,
-                selectedIndex: $sizeSelectedIndex)
-        ])
+            }, options: [
+                Option.optionalImage(
+                    description: "image",
+                    images: YDSSwiftUIImage.images,
+                    selectedImage: $image),
+                Option.enum(
+                    description: "size",
+                    cases: YDSProfileImageView.ProfileImageViewSize.allCases,
+                    selectedIndex: $sizeSelectedIndex)
+            ],
+            code: $code
+        )
         .navigationTitle(title)
+        .onAppear {
+            updateCodeText()
+        }
+
+        // onChange 관련 함수가 iOS 17.0부터 deprecated 되어 분기
+        if #available(iOS 17.0, *) {
+            contentView
+                .onChange(of: image) { _ in updateCodeText() }
+                .onChange(of: sizeSelectedIndex) { _ in updateCodeText() }
+        } else {
+            contentView
+                .onChange(of: image, perform: { _ in updateCodeText() })
+                .onChange(of: image, perform: { _ in updateCodeText() })
+        }
+    }
+
+    func updateCodeText() {
+        let imageName = image?.name ?? ""
+        let sizeName = YDSProfileImageView.ProfileImageViewSize.allCases[sizeSelectedIndex]
+        code = """
+YDSProfileImageView(
+    image: \(imageName),
+    size: .\(sizeName)
+)
+"""
+    }
+}
+
+extension SwiftUIImage: Equatable {
+    public static func == (lhs: SwiftUIImage, rhs: SwiftUIImage) -> Bool {
+        return lhs.name == rhs.name
     }
 }