Skip to content

Commit eeb0be6

Browse files
authored
Merge pull request #4993 from woocommerce/issue/4383-store-picker-error-ui
2 parents 3490198 + 8acbeff commit eeb0be6

File tree

2 files changed

+106
-0
lines changed

2 files changed

+106
-0
lines changed
Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
import SwiftUI
2+
3+
/// Hosting controller wrapper for `StorePickerError`
4+
///
5+
final class StorePickerErrorHostingController: UIHostingController<StorePickerError> {
6+
init() {
7+
super.init(rootView: StorePickerError())
8+
}
9+
10+
required dynamic init?(coder aDecoder: NSCoder) {
11+
fatalError("init(coder:) has not been implemented")
12+
}
13+
}
14+
15+
16+
/// Generic Store Picker error view that allows the user to contact support.
17+
///
18+
struct StorePickerError: View {
19+
var body: some View {
20+
VStack(alignment: .center, spacing: Layout.mainVerticalSpacing) {
21+
// Title
22+
Text(Localization.title)
23+
.headlineStyle()
24+
25+
// Main image
26+
Image(uiImage: .errorImage)
27+
28+
// Body text
29+
Text(Localization.body)
30+
.multilineTextAlignment(.center)
31+
.bodyStyle()
32+
33+
VStack(spacing: Layout.buttonsSpacing) {
34+
// Primary Button
35+
Button(Localization.troubleshoot) {
36+
print("Troubleshooting Tips tapped")
37+
}
38+
.buttonStyle(PrimaryButtonStyle())
39+
40+
// Secondary button
41+
Button(Localization.contact) {
42+
print("Contact support tapped")
43+
}
44+
.buttonStyle(SecondaryButtonStyle())
45+
46+
// Dismiss button
47+
Button(Localization.back) {
48+
print("Back to site")
49+
}
50+
.buttonStyle(LinkButtonStyle())
51+
}
52+
}
53+
.padding([.leading, .trailing, .bottom])
54+
.padding(.top, Layout.topPadding)
55+
.background(Color(.tertiarySystemBackground))
56+
.cornerRadius(Layout.rounderCorners)
57+
}
58+
}
59+
60+
// MARK: Constant
61+
62+
private extension StorePickerError {
63+
enum Localization {
64+
static let title = NSLocalizedString("We couldn't load your site", comment: "Title for the default store picker error screen")
65+
static let body = NSLocalizedString("Please try again or reach out to us and we'll be happy to assist you!",
66+
comment: "Body text for the default store picker error screen")
67+
static let troubleshoot = NSLocalizedString("Read our Troubleshooting Tips",
68+
comment: "Text for the button to navigate to troubleshooting tips from the store picker error screen")
69+
static let contact = NSLocalizedString("Contact Support",
70+
comment: "Text for the button to contact support from the store picker error screen")
71+
static let back = NSLocalizedString("Back to Sites",
72+
comment: "Text for the button to dismiss the store picker error screen")
73+
}
74+
75+
enum Layout {
76+
static let rounderCorners: CGFloat = 10
77+
static let mainVerticalSpacing: CGFloat = 25
78+
static let buttonsSpacing: CGFloat = 15
79+
static let topPadding: CGFloat = 30
80+
}
81+
}
82+
83+
// MARK: Previews
84+
85+
struct StorePickerError_Preview: PreviewProvider {
86+
static var previews: some View {
87+
VStack {
88+
StorePickerError()
89+
}
90+
.padding()
91+
.background(Color.gray)
92+
.previewLayout(.sizeThatFits)
93+
94+
VStack {
95+
StorePickerError()
96+
}
97+
.padding()
98+
.background(Color.gray)
99+
.environment(\.colorScheme, .dark)
100+
.previewLayout(.sizeThatFits)
101+
}
102+
}

WooCommerce/WooCommerce.xcodeproj/project.pbxproj

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -390,6 +390,7 @@
390390
262A09A5262F65690033AD20 /* OrderAddOnTopBanner.swift in Sources */ = {isa = PBXBuildFile; fileRef = 262A09A4262F65690033AD20 /* OrderAddOnTopBanner.swift */; };
391391
262A2C2B2537A3330086C1BE /* MockRefunds.swift in Sources */ = {isa = PBXBuildFile; fileRef = 262A2C2A2537A3330086C1BE /* MockRefunds.swift */; };
392392
262C921F26EEF8B100011F92 /* Binding.swift in Sources */ = {isa = PBXBuildFile; fileRef = 262C921E26EEF8B100011F92 /* Binding.swift */; };
393+
262C922126F1370000011F92 /* StorePickerError.swift in Sources */ = {isa = PBXBuildFile; fileRef = 262C922026F1370000011F92 /* StorePickerError.swift */; };
393394
263E37E12641AD8300260D3B /* Codegen in Frameworks */ = {isa = PBXBuildFile; productRef = 263E37E02641AD8300260D3B /* Codegen */; };
394395
263E37E22641AD8300260D3B /* Codegen in Embed Frameworks */ = {isa = PBXBuildFile; productRef = 263E37E02641AD8300260D3B /* Codegen */; settings = {ATTRIBUTES = (CodeSignOnCopy, ); }; };
395396
263E38462641FF3400260D3B /* Codegen in Frameworks */ = {isa = PBXBuildFile; productRef = 263E38452641FF3400260D3B /* Codegen */; };
@@ -1814,6 +1815,7 @@
18141815
262A09A4262F65690033AD20 /* OrderAddOnTopBanner.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OrderAddOnTopBanner.swift; sourceTree = "<group>"; };
18151816
262A2C2A2537A3330086C1BE /* MockRefunds.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MockRefunds.swift; sourceTree = "<group>"; };
18161817
262C921E26EEF8B100011F92 /* Binding.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Binding.swift; sourceTree = "<group>"; };
1818+
262C922026F1370000011F92 /* StorePickerError.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StorePickerError.swift; sourceTree = "<group>"; };
18171819
263EB408242C58EA00F3A15F /* ProductFormActionsFactoryTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProductFormActionsFactoryTests.swift; sourceTree = "<group>"; };
18181820
265284012624937600F91BA1 /* AddOnCrossreferenceUseCase.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AddOnCrossreferenceUseCase.swift; sourceTree = "<group>"; };
18191821
265284082624ACE900F91BA1 /* AddOnCrossreferenceTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AddOnCrossreferenceTests.swift; sourceTree = "<group>"; };
@@ -5362,6 +5364,7 @@
53625364
B5D1AFC520BC7B7300DB0E8C /* StorePickerViewController.swift */,
53635365
B5D1AFC720BC7B9600DB0E8C /* StorePickerViewController.xib */,
53645366
74460D4122289C7A00D7316A /* StorePickerCoordinator.swift */,
5367+
262C922026F1370000011F92 /* StorePickerError.swift */,
53655368
45527A402472C6160078D609 /* SwitchStoreUseCase.swift */,
53665369
45A4221924ACC79C003B1E4C /* SwitchStoreNoticePresenter.swift */,
53675370
);
@@ -7814,6 +7817,7 @@
78147817
028FA46C257E0D9F00F88A48 /* PlainTextSectionHeaderView.swift in Sources */,
78157818
0235595924496D70004BE2B8 /* ProductsSortOrderBottomSheetListSelectorCommand.swift in Sources */,
78167819
57A25C7625ACE9BC00A54A62 /* OrderFulfillmentUseCase.swift in Sources */,
7820+
262C922126F1370000011F92 /* StorePickerError.swift in Sources */,
78177821
4515C89825D6C00E0099C8E3 /* ShippingLabelAddressFormViewModel.swift in Sources */,
78187822
CE24BCCF212DE8A6001CD12E /* HeadlineLabelTableViewCell.swift in Sources */,
78197823
0245465D24EE779D004F531C /* ProductFormEventLogger.swift in Sources */,

0 commit comments

Comments
 (0)