Feature/밈상세화면 구현 #23 (#26)

* feat: memeDetail 모듈 추가

* feat: kingfisher 추가

* design: ㅋ, 개웃겨 리소스 추가

* feat: MemeDetail 모델 구현

* feat: MemeDetail UI 구현

* chore: 코드리뷰 봇 무시

* refactor: 재사용 가능한 뷰 분리

.github/workflows/codeReview.yml

@@ -1,27 +1,27 @@
-name: Code Review
+# name: Code Review
 
-permissions:
-  contents: read
-  pull-requests: write
+# permissions:
+#   contents: read
+#   pull-requests: write
 
-on:
-  pull_request:
-    types: [opened, reopened, synchronize]
+# on:
+#   pull_request:
+#     types: [opened, reopened, synchronize]
 
-jobs:
-  test:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: anc95/ChatGPT-CodeReview@main
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
-          LANGUAGE: Korean
-          OPENAI_API_ENDPOINT: https://api.openai.com/v1
-          MODEL: gpt-4o
-        #   PROMPT: # example: Please check if there are any confusions or irregularities in the following code diff:
-          top_p: 1
-          temperature: 1
-          max_tokens: 4096
-          MAX_PATCH_LENGTH: 10000
+# jobs:
+#   test:
+#     runs-on: ubuntu-latest
+#     steps:
+#       - uses: anc95/ChatGPT-CodeReview@main
+#         env:
+#           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+#           OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
+#           LANGUAGE: Korean
+#           OPENAI_API_ENDPOINT: https://api.openai.com/v1
+#           MODEL: gpt-4o
+#         #   PROMPT: # example: Please check if there are any confusions or irregularities in the following code diff:
+#           top_p: 1
+#           temperature: 1
+#           max_tokens: 4096
+#           MAX_PATCH_LENGTH: 10000
 

Projects/Core/PPACModels/Sources/Meme/MemeDetail.swift

@@ -0,0 +1,49 @@
+//
+//  MemeDetail.swift
+//  PPACModels
+//
+//  Created by kimchansoo on 6/28/24.
+//
+
+import Foundation
+
+public struct MemeDetail {
+
+  // MARK: - Properties
+
+  public let title: String
+  public let keywords: [String]
+  public let imageUrlString: String
+  public let source: String
+  public let isTodayMeme: Bool
+  public let reaction: Int
+
+  // MARK: - Initializers
+
+  public init(
+    title: String,
+    keywords: [String],
+    imageUrlString: String,
+    source: String,
+    isTodayMeme: Bool,
+    reaction: Int
+  ) {
+    self.title = title
+    self.keywords = keywords
+    self.imageUrlString = imageUrlString
+    self.source = source
+    self.isTodayMeme = isTodayMeme
+    self.reaction = reaction
+  }
+}
+
+public extension MemeDetail {
+  static let mock = MemeDetail(
+    title: "나는 공부를 찢어",
+    keywords: ["공부", "학생", "시험기간"],
+    imageUrlString: "https://avatars.githubusercontent.com/u/26344479?s=64&v=4",
+    source: "깃허브",
+    isTodayMeme: true,
+    reaction: 4
+  )
+}

Projects/Features/MemeDetail/Project.swift

@@ -0,0 +1,30 @@
+//
+//  Project.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 2024/06/28
+//
+
+import ProjectDescription
+import ProjectDescriptionHelpers
+
+let project = Project(
+    name: "MemeDetail",
+    targets: [
+        .configure(
+            name: "MemeDetail",
+            product: .framework,
+            infoPlist: .default,
+            sources: "Sources/**",
+            resources: "Resources/**",
+            dependencies: [
+                .ThirdParty.Dependency,
+                .ThirdParty.Kingfisher,
+                .ResourceKit,
+                .Core.DesignSystem,
+                .Core.PPACModels,
+            ]
+        )
+    ]
+)
+

Projects/Features/MemeDetail/Resources/dummy.swift

@@ -0,0 +1 @@
+//더미임미다

Projects/Features/MemeDetail/Sources/HashTagView.swift

@@ -0,0 +1,40 @@
+//
+//  HashTagView.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 6/29/24.
+//
+
+import SwiftUI
+
+public struct HashTagView: View {
+
+  // MARK: - Properties
+
+  private let keywords: [String]
+
+  // MARK: - Initializers
+
+  public init(keywords: [String]) {
+    self.keywords = keywords
+  }
+
+  // MARK: - UI
+
+  var body: some View {
+    HStack(alignment: .center, spacing: 6) {
+      ForEach(keywords, id: \.self) { title in
+        hashTag(title: title)
+      }
+    }
+    .frame(maxWidth: .infinity, alignment: .center)
+    .cornerRadius(40)
+  }
+
+  func hashTag(title: String) -> some View {
+    Text("#\(title)")
+      .font(Font.Body.large)
+      .foregroundColor(Color.Text.tertiary)
+  }
+
+}

Projects/Features/MemeDetail/Sources/LikeButton.swift

@@ -0,0 +1,23 @@
+//
+//  LikeButton.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 6/29/24.
+//
+
+import SwiftUI
+
+import ResourceKit
+
+public struct LikeButton: View {
+  var body: some View {
+    HStack(alignment: .center, spacing: 6) {
+      ResourceKitAsset.Icon.ㅋ.swiftUIImage
+      ResourceKitAsset.Icon.개웃겨.swiftUIImage
+    }
+    .frame(maxWidth: .infinity)
+    .frame(height: 46, alignment: .center)
+    .background(Color.Skeleton.primary)
+    .cornerRadius(10)
+  }
+}

Projects/Features/MemeDetail/Sources/MemeDetailCardView.swift

@@ -0,0 +1,71 @@
+//
+//  MemeDetailCardView.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 6/29/24.
+//
+
+import SwiftUI
+
+import PPACModels
+import Kingfisher
+import ResourceKit
+
+struct MemeDetailCardView: View {
+
+  // MARK: - Properties
+
+  let meme: MemeDetail
+
+  // MARK: - UI
+
+  var body: some View {
+    VStack(alignment: .center, spacing: 0) {
+
+      MemeImageView(imageUrlString: meme.imageUrlString)
+        .padding(.bottom, 25)
+
+      titleLabel
+        .padding(.bottom, 5)
+
+      HashTagView(keywords: meme.keywords)
+        .padding(.bottom, 11)
+
+      subtitleLabel
+        .padding(.bottom, 20)
+
+      LikeButton()
+        .padding(.bottom, 20)
+    }
+    .padding(10)
+    .background(.white)
+    .cornerRadius(20)
+    .overlay(
+      RoundedRectangle(cornerRadius: 20)
+        .inset(by: 1)
+        .stroke(.black, lineWidth: 2)
+    )
+    .padding(.horizontal, 24)
+  }
+
+  // MARK: - Methods
+
+  var titleLabel: some View {
+    Text(meme.title)
+      .font(Font.Heading.large.weight(.semibold))
+      .multilineTextAlignment(.center)
+      .foregroundColor(Color.Text.primary)
+      .frame(maxWidth: .infinity, alignment: .center)
+  }
+
+  var subtitleLabel: some View {
+    Text("출처: \(self.meme.source)")
+      .font(Font.Body.xsmall)
+      .multilineTextAlignment(.center)
+      .foregroundColor(Color.Icon.assistive)
+  }
+}
+
+#Preview {
+  MemeDetailCardView(meme: .mock)
+}

Projects/Features/MemeDetail/Sources/MemeDetailView.swift

@@ -0,0 +1,32 @@
+//
+//  MemeDetailView.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 6/28/24.
+//
+
+import SwiftUI
+
+import PPACModels
+
+struct MemeDetailView: View {
+
+  // MARK: - Properties
+  private let meme: MemeDetail
+
+  // MARK: - Initializers
+
+  init(meme: MemeDetail) {
+    self.meme = meme
+  }
+
+  // MARK: - UI
+
+  var body: some View {
+    MemeDetailCardView(meme: meme)
+  }
+}
+
+#Preview {
+  MemeDetailView(meme: .mock)
+}

Projects/Features/MemeDetail/Sources/MemeImageView.swift

@@ -0,0 +1,36 @@
+//
+//  MemeImageView.swift
+//  MemeDetail
+//
+//  Created by kimchansoo on 6/29/24.
+//
+
+import SwiftUI
+
+import Kingfisher
+
+struct MemeImageView: View {
+
+  // MARK: - Properties
+
+  private let imageUrlString: String
+
+  // MARK: - Initializers
+
+  init(imageUrlString: String) {
+    self.imageUrlString = imageUrlString
+  }
+
+  // MARK: - UI
+
+  var body: some View {
+    KFImage(URL(string: imageUrlString))
+      .resizable()
+      .loadDiskFileSynchronously()
+      .cacheMemoryOnly()
+      .fade(duration: 0.25)
+      .frame(maxWidth: .infinity)
+      .aspectRatio(0.9375, contentMode: .fit)
+      .cornerRadius(10)
+  }
+}

Projects/ResourceKit/Resources/Icon.xcassets/ㅋ.imageset/Contents.json

@@ -0,0 +1,23 @@
+{
+  "images" : [
+    {
+      "filename" : "ㅋ.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "ㅋ@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "ㅋ@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Projects/ResourceKit/Resources/Icon.xcassets/개웃겨.imageset/Contents.json

@@ -0,0 +1,23 @@
+{
+  "images" : [
+    {
+      "filename" : "개웃겨.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "개웃겨@2x 1.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "개웃겨@3x 1.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}