Skip to content

Commit

Permalink
Update preview code editor view
Browse files Browse the repository at this point in the history
  • Loading branch information
ivan-magda committed Sep 27, 2023
1 parent 488a2d9 commit 33ac6f5
Show file tree
Hide file tree
Showing 11 changed files with 139 additions and 65 deletions.
4 changes: 4 additions & 0 deletions iosHyperskillApp/iosHyperskillApp.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -197,6 +197,7 @@
2C5CBBE32948F4B600113007 /* StepQuizSQLViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C5CBBE22948F4B600113007 /* StepQuizSQLViewModel.swift */; };
2C5CBBE52948FA7400113007 /* StepQuizSQLAssembly.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C5CBBE42948FA7400113007 /* StepQuizSQLAssembly.swift */; };
2C5CBBE72948FC7A00113007 /* StepQuizSQLView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C5CBBE62948FC7A00113007 /* StepQuizSQLView.swift */; };
2C5EC2C82AC41CAF0098D126 /* StepQuizCodeEditorView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C5EC2C72AC41CAF0098D126 /* StepQuizCodeEditorView.swift */; };
2C5F4A5A2971C71200677530 /* GamificationToolbarContent.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C5F4A592971C71200677530 /* GamificationToolbarContent.swift */; };
2C62AD582AB43A8F00F3DD5B /* BadgeRankView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C62AD572AB43A8F00F3DD5B /* BadgeRankView.swift */; };
2C6672062A527C0D0040EA2F /* ProgressScreenSectionTitleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2C6672052A527C0D0040EA2F /* ProgressScreenSectionTitleView.swift */; };
Expand Down Expand Up @@ -795,6 +796,7 @@
2C5CBBE22948F4B600113007 /* StepQuizSQLViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StepQuizSQLViewModel.swift; sourceTree = "<group>"; };
2C5CBBE42948FA7400113007 /* StepQuizSQLAssembly.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StepQuizSQLAssembly.swift; sourceTree = "<group>"; };
2C5CBBE62948FC7A00113007 /* StepQuizSQLView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StepQuizSQLView.swift; sourceTree = "<group>"; };
2C5EC2C72AC41CAF0098D126 /* StepQuizCodeEditorView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StepQuizCodeEditorView.swift; sourceTree = "<group>"; };
2C5F4A592971C71200677530 /* GamificationToolbarContent.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GamificationToolbarContent.swift; sourceTree = "<group>"; };
2C62AD572AB43A8F00F3DD5B /* BadgeRankView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BadgeRankView.swift; sourceTree = "<group>"; };
2C6672052A527C0D0040EA2F /* ProgressScreenSectionTitleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProgressScreenSectionTitleView.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -2352,6 +2354,7 @@
2C967435288829E40091B6C9 /* Views */ = {
isa = PBXGroup;
children = (
2C5EC2C72AC41CAF0098D126 /* StepQuizCodeEditorView.swift */,
2CA3B0352888955F00EEF716 /* StepQuizCodeSkeletonView.swift */,
2C967433288824450091B6C9 /* StepQuizCodeView.swift */,
2C96743828882A130091B6C9 /* Details */,
Expand Down Expand Up @@ -4187,6 +4190,7 @@
2C7994B12A129D6100874C16 /* TrackSelectionListSkeletonView.swift in Sources */,
2C1F5875280D0E0000372A37 /* WKWebViewPanelManager.m in Sources */,
2CDF14D228EEF9690060D972 /* AppTabBarController.swift in Sources */,
2C5EC2C82AC41CAF0098D126 /* StepQuizCodeEditorView.swift in Sources */,
2C1F5870280D0CB700372A37 /* WebCacheCleaner.swift in Sources */,
E9D2D673284E0A97000757AC /* StepQuizMatchingItemView.swift in Sources */,
E94BB04E2A9E034700736B7C /* StepQuizParsonsAssembly.swift in Sources */,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{
"images" : [
{
"filename" : "step-quiz-code-editor-expand.pdf",
"idiom" : "universal"
}
],
"info" : {
"author" : "xcode",
"version" : 1
},
"properties" : {
"preserves-vector-representation" : true
}
}
Binary file not shown.
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ enum Images {
static let discussions = "step-quiz-discussions"
static let info = "step-quiz-info"
static let lightning = "step-quiz-lightning"
static let expand = "step-quiz-code-editor-expand"

enum Hints {
static let helpfulReaction = "step_quiz_hints_helpful_reaction"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -154,6 +154,8 @@ enum Strings {
static let fullScreenCodeTab = sharedStrings.step_quiz_code_full_screen_code_tab.localized()
static let emptyLang = sharedStrings.step_quiz_code_empty_lang.localized()
static let reset = sharedStrings.step_quiz_code_reset.localized()

static let codeEditorTitle = sharedStrings.step_quiz_code_editor_title.localized()
}

// MARK: - StepQuizSQL -
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,14 @@ class StepQuizCodeViewModel: ObservableObject {
func logClickedCodeDetailsEvent() {
moduleOutput?.handleChildQuizAnalyticEventMessage(StepQuizFeatureMessageClickedCodeDetailsEventMessage())
}

func handleCodeDidChange(_ newCode: String?) {
viewData.code = newCode

DispatchQueue.main.async {
self.syncReply(code: newCode)
}
}
}

// MARK: - StepQuizCodeViewModel: StepQuizChildQuizInputProtocol -
Expand Down Expand Up @@ -85,11 +93,7 @@ extension StepQuizCodeViewModel: StepQuizChildQuizInputProtocol {

extension StepQuizCodeViewModel: StepQuizCodeFullScreenOutputProtocol {
func handleStepQuizCodeFullScreenUpdatedCode(_ code: String?) {
viewData.code = code

DispatchQueue.main.async {
self.syncReply(code: code)
}
handleCodeDidChange(code)
}

func handleStepQuizCodeFullScreenRetryRequested() {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
import SwiftUI

extension StepQuizCodeEditorView {
struct Appearance {
let codeEditorInsets = LayoutInsets(vertical: LayoutInsets.defaultInset)
let codeEditorMinHeightHeight: CGFloat = 300
}
}

struct StepQuizCodeEditorView: View {
private(set) var appearance = Appearance()

@Binding var code: String?
let codeTemplate: String?

let language: CodeLanguage?

let onExpandButtonTap: () -> Void

@Environment(\.isEnabled) private var isEnabled

var body: some View {
VStack(spacing: 0) {
Divider()

HStack {
Text(Strings.StepQuizCode.codeEditorTitle)
.font(.headline)
.foregroundColor(.primaryText)

if let languageName = language?.humanReadableName {
Text("(\(languageName))")
.font(.subheadline)
.foregroundColor(.tertiaryText)
}

Spacer()

Button(
action: onExpandButtonTap,
label: {
Image(Images.StepQuiz.expand)
.renderingMode(.template)
.font(.headline)
.foregroundColor(.secondaryText)
.aspectRatio(contentMode: .fit)
.opacity(isEnabled ? 1 : 0.38)
}
)
}
.padding(.horizontal)
.padding(.vertical, LayoutInsets.smallInset)
.background(BackgroundView())

Divider()

CodeEditor(
code: $code,
codeTemplate: codeTemplate,
language: language,
isEditable: true,
textInsets: appearance.codeEditorInsets.uiEdgeInsets
)
.frame(
maxWidth: .infinity,
minHeight: appearance.codeEditorMinHeightHeight
)

Divider()
}
}
}

struct StepQuizCodeEditorView_Previews: PreviewProvider {
static var previews: some View {
StepQuizCodeEditorView(
code: .constant(CodeLanguageSamples.sample(for: .java)),
codeTemplate: nil,
language: .java,
onExpandButtonTap: {}
)
}
}
Original file line number Diff line number Diff line change
@@ -1,15 +1,6 @@
import SwiftUI

extension StepQuizCodeView {
struct Appearance {
let codeEditorInsets = LayoutInsets(vertical: LayoutInsets.defaultInset)
let codeEditorHeight: CGFloat = 128
}
}

struct StepQuizCodeView: View {
private(set) var appearance = Appearance()

@StateObject var viewModel: StepQuizCodeViewModel

@Environment(\.isEnabled) private var isEnabled
Expand All @@ -23,21 +14,18 @@ struct StepQuizCodeView: View {
onExpandTapped: viewModel.logClickedCodeDetailsEvent
)

CodeEditor(
code: .constant(viewData.code),
StepQuizCodeEditorView(
code: Binding(
get: { viewModel.viewData.code },
set: { viewModel.handleCodeDidChange($0) }
),
codeTemplate: viewData.codeTemplate,
language: viewData.language,
isEditable: false,
textInsets: appearance.codeEditorInsets.uiEdgeInsets
)
.frame(height: appearance.codeEditorHeight)
.frame(maxWidth: .infinity)
.addBorder()
.onTapGesture {
if isEnabled {
onExpandButtonTap: {
viewModel.navigationState.presentingFullScreen = true
}
}
)
.padding(.horizontal, -LayoutInsets.defaultInset)
}
.fullScreenCover(isPresented: $viewModel.navigationState.presentingFullScreen) {
StepQuizCodeFullScreenAssembly(
Expand Down
Original file line number Diff line number Diff line change
@@ -1,15 +1,6 @@
import SwiftUI

extension StepQuizPyCharmView {
struct Appearance {
let codeEditorInsets = LayoutInsets(vertical: LayoutInsets.defaultInset)
let codeEditorHeight: CGFloat = 128
}
}

struct StepQuizPyCharmView: View {
private(set) var appearance = Appearance()

@StateObject var viewModel: StepQuizPyCharmViewModel

@Environment(\.isEnabled) private var isEnabled
Expand All @@ -18,21 +9,18 @@ struct StepQuizPyCharmView: View {
VStack(alignment: .leading, spacing: LayoutInsets.defaultInset) {
let viewData = viewModel.viewData

CodeEditor(
code: .constant(viewData.code),
StepQuizCodeEditorView(
code: Binding(
get: { viewModel.viewData.code },
set: { viewModel.handleCodeDidChange($0) }
),
codeTemplate: viewData.codeTemplate,
language: viewData.language,
isEditable: false,
textInsets: appearance.codeEditorInsets.uiEdgeInsets
)
.frame(height: appearance.codeEditorHeight)
.frame(maxWidth: .infinity)
.addBorder()
.onTapGesture {
if isEnabled {
onExpandButtonTap: {
viewModel.navigationState.presentingFullScreen = true
}
}
)
.padding(.horizontal, -LayoutInsets.defaultInset)
}
.fullScreenCover(isPresented: $viewModel.navigationState.presentingFullScreen) {
StepQuizCodeFullScreenAssembly(
Expand Down
Original file line number Diff line number Diff line change
@@ -1,15 +1,6 @@
import SwiftUI

extension StepQuizSQLView {
struct Appearance {
let codeEditorInsets = LayoutInsets(vertical: LayoutInsets.defaultInset)
let codeEditorHeight: CGFloat = 128
}
}

struct StepQuizSQLView: View {
private(set) var appearance = Appearance()

@StateObject var viewModel: StepQuizSQLViewModel

@Environment(\.isEnabled) private var isEnabled
Expand All @@ -18,21 +9,18 @@ struct StepQuizSQLView: View {
VStack(alignment: .leading, spacing: LayoutInsets.defaultInset) {
let viewData = viewModel.viewData

CodeEditor(
code: .constant(viewData.code),
StepQuizCodeEditorView(
code: Binding(
get: { viewModel.viewData.code },
set: { viewModel.handleCodeDidChange($0) }
),
codeTemplate: viewData.codeTemplate,
language: viewData.language,
isEditable: false,
textInsets: appearance.codeEditorInsets.uiEdgeInsets
)
.frame(height: appearance.codeEditorHeight)
.frame(maxWidth: .infinity)
.addBorder()
.onTapGesture {
if isEnabled {
onExpandButtonTap: {
viewModel.navigationState.presentingFullScreen = true
}
}
)
.padding(.horizontal, -LayoutInsets.defaultInset)
}
.fullScreenCover(isPresented: $viewModel.navigationState.presentingFullScreen) {
StepQuizCodeFullScreenAssembly(
Expand Down
1 change: 1 addition & 0 deletions shared/src/commonMain/resources/MR/base/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,7 @@
<string name="step_quiz_code_full_screen_code_tab">Code</string>
<string name="step_quiz_code_empty_lang">No lang</string>
<string name="step_quiz_code_reset">Reset</string>
<string name="step_quiz_code_editor_title">Code editor</string>

<!-- Step quiz sql -->
<string name="step_quiz_sql_title">Write an SQL statement</string>
Expand Down

0 comments on commit 33ac6f5

Please sign in to comment.