feat: 🎸 [HCPSDKFIORIUIKIT-2766] sort & filter enhancement, full filte…

…rs (#859)
SAP · Nov 4, 2024 · 49d1272 · 49d1272
1 parent a8e3bfd
commit 49d1272
Show file tree

Hide file tree

Showing 12 changed files with 164 additions and 69 deletions.
diff --git a/Apps/Examples/Examples/FioriSwiftUICore/SortFilter/SortFilterExample.swift b/Apps/Examples/Examples/FioriSwiftUICore/SortFilter/SortFilterExample.swift
@@ -14,7 +14,7 @@ struct SortFilterExample: View {
             .picker(item: .init(name: "Fixed Many Filter", value: [0], valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review Pending Pending Pending Pending Pending", "Accepted Medium", "Pending Medium", "Completed Medium", "Checked", "Unchecked", "Partially Checked", "Checked and Unchecked", "Checked and Partially Checked", "Unchecked and Partially Checked", "Partially Checked and Unchecked", "Checked and Unchecked and Partially Checked", "Unchecked and Partially Checked and Partially Checked", "Partially Checked and Unchecked and Partially Checked", "Checked Finally", "Unchecked Finally", "Partially Checked Finally", "Checked and Unchecked Finally", "Checked and Partially Checked Finally", "Unchecked and Partially Checked Finally", "Partially Checked and Unchecked Finally", "Checked Finally and Partially Checked Finally", "Unchecked Finally and Partially Checked Finally", "Partially Checked Finally and Partially Checked Finally", "Review", "Reviewed", "To be Reviewed", "Pending for Review", "Booked", "To be Booked", "Will Book", "Booking Canceled"], allowsMultipleSelection: false, allowsEmptySelection: true, barItemDisplayMode: .value, icon: "clock", itemLayout: .fixed, displayMode: .filterFormCell), showsOnFilterFeedbackBar: true)
         ],
         [
-            .picker(item: .init(name: "Priority", value: [0], valueOptions: ["High", "Medium", "Low"], allowsMultipleSelection: true, allowsEmptySelection: true, showsValueForSingleSelected: false, icon: "filemenu.and.cursorarrow"), showsOnFilterFeedbackBar: true),
+            .picker(item: .init(name: "Priority", value: [0], valueOptions: ["High", "Medium", "Low"], allowsMultipleSelection: true, allowsEmptySelection: true, barItemDisplayMode: .nameAndValue, icon: "filemenu.and.cursorarrow"), showsOnFilterFeedbackBar: true),
             .filterfeedback(item: .init(name: "Sort Order", value: [0], valueOptions: ["Ascending", "Descending"], allowsMultipleSelection: false, allowsEmptySelection: false, icon: "checkmark")),
             .stepper(item: .init(name: "Quantity", stepperTitle: "Label", value: 1, step: 1, stepRange: 0 ... 100, isDecimalSupported: false, description: "Hint Text"), showsOnFilterFeedbackBar: true)
 

diff --git a/Sources/FioriSwiftUICore/Components/CancellableResettableForm.swift b/Sources/FioriSwiftUICore/Components/CancellableResettableForm.swift
@@ -10,6 +10,8 @@ struct CancellableResettableDialogForm<Title: View, CancelAction: View, ResetAct
     var resetAction: ResetAction
     var applyAction: ApplyAction
 
+    let popoverWidth = 393.0
+
     public init(@ViewBuilder title: () -> Title,
                 @ViewBuilder cancelAction: () -> CancelAction,
                 @ViewBuilder resetAction: () -> ResetAction,
@@ -41,7 +43,7 @@ struct CancellableResettableDialogForm<Title: View, CancelAction: View, ResetAct
             #endif
             self.applyAction
         }
-        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? self.popoverWidth : nil)
         .padding([.top, .bottom], UIDevice.current.userInterfaceIdiom == .pad ? 13 : 16)
         #if !os(visionOS)
             .background(Color.preferredColor(.chromeSecondary))
@@ -60,6 +62,8 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
     var resetAction: ResetAction
     var applyAction: ApplyAction
 
+    let popoverWidth = 393.0
+
     public init(@ViewBuilder title: () -> Title,
                 @ViewBuilder cancelAction: () -> CancelAction,
                 @ViewBuilder resetAction: () -> ResetAction,
@@ -96,7 +100,7 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
                 }
             }
         }
-        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? self.popoverWidth : nil)
         .padding([.bottom], UIDevice.current.userInterfaceIdiom == .pad ? 13 : 16)
         #if !os(visionOS)
             .background(Color.preferredColor(.chromeSecondary))
@@ -108,11 +112,12 @@ struct CancellableResettableDialogNavigationForm<Title: View, CancelAction: View
 
 struct ApplyButtonStyle: PrimitiveButtonStyle {
     @Environment(\.isEnabled) private var isEnabled: Bool
-
+    let popoverWidth = 393.0
+
     func makeBody(configuration: Configuration) -> some View {
         if self.isEnabled {
             configuration.label
-                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 * 2 :
+                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 * 2 :
                     Screen.bounds.size.width - 16 * 2)
                 .padding([.top, .bottom], 8)
                 .font(.body)
@@ -131,7 +136,7 @@ struct ApplyButtonStyle: PrimitiveButtonStyle {
                 .padding([.top], UIDevice.current.userInterfaceIdiom == .pad ? 16 : 8)
         } else {
             configuration.label
-                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 * 2 :
+                .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 * 2 :
                     Screen.bounds.size.width - 16 * 2)
                 .padding([.top, .bottom], 8)
                 .font(.body)

diff --git a/Sources/FioriSwiftUICore/Models/ModelDefinitions.swift b/Sources/FioriSwiftUICore/Models/ModelDefinitions.swift
@@ -472,6 +472,8 @@ public protocol FilterFeedbackBarModel: AnyObject {
 // sourcery: virtualPropActionHelper = "@StateObject var context: SortFilterContext = SortFilterContext()"
 // sourcery: add_env_props = "dismiss"
 // sourcery: generated_component_composite
+// sourcery: virtualPropViewSize = "@State var size: CGSize = .zero"
+// sourcery: virtualPropPopoverWidth = "let popoverWidth = 393.0"
 public protocol SortFilterViewModel: AnyObject, TitleComponent {
     // sourcery: bindingProperty
     // sourcery: backingComponent=_SortFilterCFGItemContainer
@@ -532,6 +534,7 @@ public protocol OptionListPickerItemModel: OptionListPickerComponent {
 // sourcery: virtualPropAllowsMultipleSelection = "var allowsMultipleSelection: Bool = false"
 // sourcery: virtualPropAllowsEmptySelection = "var allowsEmptySelection: Bool = false"
 // sourcery: virtualPropIsSearchBarHidden = "var isSearchBarHidden: Bool = false"
+// sourcery: virtualPropPopoverWidth = "let popoverWidth = 393.0"
 public protocol SearchListPickerItemModel: OptionListPickerComponent {
     // sourcery: default.value = nil
     // sourcery: no_view

diff --git a/Sources/FioriSwiftUICore/Views/OptionListPickerItem+View.swift b/Sources/FioriSwiftUICore/Views/OptionListPickerItem+View.swift
@@ -132,11 +132,11 @@ extension OptionListPickerItem: View {
     VStack {
         Spacer()
         OptionListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review review", "Accepted", "Rejected"], hint: nil)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
         OptionListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review", "Accepted", "Rejected"], hint: nil)
             .optionListPickerStyle(font: .title, foregroundColorSelected: Color.red, strokeColorSelected: Color.red, cornerRadius: 25)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
     }
 }

diff --git a/Sources/FioriSwiftUICore/Views/SearchListPickerItem+View.swift b/Sources/FioriSwiftUICore/Views/SearchListPickerItem+View.swift
@@ -86,7 +86,7 @@ extension SearchListPickerItem: View {
                 }
             })
             .listStyle(PlainListStyle())
-            .frame(minWidth: UIDevice.current.userInterfaceIdiom != .phone ? 393 : nil)
+            .frame(minWidth: UIDevice.current.userInterfaceIdiom != .phone ? popoverWidth : nil)
             .scrollContentBackground(.hidden)
             .padding(0)
             .ifApply(!isSearchBarHidden, content: { v in
@@ -138,7 +138,7 @@ extension SearchListPickerItem: View {
     VStack {
         Spacer()
         SearchListPickerItem(value: Binding<[Int]>(get: { [0, 1, 2] }, set: { print($0) }), valueOptions: ["Received", "Started", "Hold", "Transfer", "Completed", "Pending Review review", "Accepted", "Rejected"], hint: nil)
-            .frame(width: 375)
+            .frame(width: 393)
         Spacer()
     }
 }
diff --git a/Sources/FioriSwiftUICore/Views/SliderPickerItem+View.swift b/Sources/FioriSwiftUICore/Views/SliderPickerItem+View.swift
@@ -188,7 +188,7 @@ private struct SliderPickeTestView: View {
             ), minimumValue: 0, maximumValue: 100, hint: "Pick an integer value")
             Spacer()
         }
-        .frame(width: 375)
+        .frame(width: 393)
     }
 }
 

diff --git a/Sources/FioriSwiftUICore/Views/SortFilter/FilterFeedbackBarItem+View.swift b/Sources/FioriSwiftUICore/Views/SortFilter/FilterFeedbackBarItem+View.swift
@@ -122,6 +122,7 @@ struct PickerMenuItem: View {
     @State var isSheetVisible = false
 
     @State var detentHeight: CGFloat = ((UIDevice.current.userInterfaceIdiom == .phone || UIDevice.current.userInterfaceIdiom == .pad) ? 88 : 0)
+    let popoverWidth = 393.0
 
     public init(item: Binding<SortFilterItem.PickerItem>, onUpdate: @escaping () -> Void) {
         self._item = item
@@ -300,6 +301,8 @@ struct DateTimeMenuItem: View {
     @State var detentHeight: CGFloat = 0
 
     var onUpdate: () -> Void
+
+    let popoverWidth = 393.0
 
     public init(item: Binding<SortFilterItem.DateTimeItem>, onUpdate: @escaping () -> Void) {
         self._item = item
@@ -356,10 +359,10 @@ struct DateTimeMenuItem: View {
                         )
                         .datePickerStyle(.graphical)
                         .labelsHidden()
-                        .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 - 13 : Screen.bounds.size.width - 16)
+                        .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth - 13 : Screen.bounds.size.width - 16)
                         .clipped()
                     }
-                    .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? 375 : Screen.bounds.size.width)
+                    .frame(width: UIDevice.current.userInterfaceIdiom == .pad ? self.popoverWidth : Screen.bounds.size.width)
                 }
                 .readHeight()
                 .onPreferenceChange(HeightPreferenceKey.self) { height in

diff --git a/Sources/FioriSwiftUICore/Views/SortFilter/SortFilterView+View.swift b/Sources/FioriSwiftUICore/Views/SortFilter/SortFilterView+View.swift
@@ -38,7 +38,7 @@ extension Fiori {
 
 extension SortFilterView: View {
     public var body: some View {
-        CancellableResettableDialogForm {
+        CancellableResettableDialogNavigationForm {
             title
         } cancelAction: {
             cancelAction
@@ -74,8 +74,16 @@ extension SortFilterView: View {
                 .environment(\.isEnabled, true)
         } components: {
             _items
+                .sizeReader(size: { s in
+                    if size != s {
+                        size = s
+                    }
+                })
                 .environmentObject(context)
         }
+        .frame(width: UIDevice.current.userInterfaceIdiom != .phone ? popoverWidth : nil)
+        .frame(height: UIDevice.current.userInterfaceIdiom != .phone ? size.height + 130 : nil)
+        .presentationDetents([.large])
         .background(Color.preferredColor(.chromeSecondary))
     }
 }