Skip to content

[iOS 26] Replace custom tab dot with native tab badge when Liquid Glass design is enabled #16161

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 8 commits into from
Oct 14, 2025
Merged

[iOS 26] Replace custom tab dot with native tab badge when Liquid Glass design is enabled #16161

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
417ae75
Enable liquid glass design in iOS 26.
jaclync Sep 8, 2025
224ec68
Replace custom tab dot with native tab badge.
jaclync Sep 8, 2025
3603a57
Replace custom tab dot with native tab badge under a local feature flag.
jaclync Sep 22, 2025
5f31fb3
Revert "Enable liquid glass design in iOS 26."
jaclync Sep 22, 2025
b364034
Merge branch 'trunk' into backlog/WOOMOB-1223-ios26-tabbar-badge-fix
jaclync Oct 8, 2025
8a86168
Rename feature flag to `liquidGlassDesign` to be more clear when it c…
jaclync Oct 8, 2025
c743243
Merge branch 'trunk' into backlog/WOOMOB-1223-ios26-tabbar-badge-fix
jaclync Oct 13, 2025
d968d88
Replace local feature flag check for liquid glass design enabled stat…
jaclync Oct 13, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions Modules/Sources/Experiments/DefaultFeatureFlagService.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,8 @@ public struct DefaultFeatureFlagService: FeatureFlagService {
return buildConfig == .localDeveloper || buildConfig == .alpha
case .ciabBookings:
return buildConfig == .localDeveloper || buildConfig == .alpha
case .liquidGlassDesign:
return buildConfig == .localDeveloper || buildConfig == .alpha
Copy link
Contributor

@staskus staskus Oct 9, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest having something a bit different logic from a normal feature flag.

Suggested change
return buildConfig == .localDeveloper || buildConfig == .alpha
let requiresCompatibility = Bundle.main.infoDictionary?["UIDesignRequiresCompatibility"] as? Bool ?? false
let isIOS26OrHigher = ProcessInfo.processInfo.operatingSystemVersion.majorVersion >= 26
return !requiresCompatibility && isIOS26OrHigher

Since we already have a flag within the Info.plist that will enable Liquid Glass, I think at that point we will want to have our changes such as this enabled as well, otherwise the app could crash in production if we keep it as buildConfig == .localDeveloper || buildConfig == .alpha.

With the updated logic, our liquid glass design changes will only be enabled if:

  • UIDesignRequiresCompatibility flag doesn't exist or is set on NO
  • User is on iOS 26 or higher version. We don't want our new badges to be shown to users who are on iOS 18.5 even if we enable liquid glass for iOS 26 users.

Wdyt?

Copy link
Contributor Author

@jaclync jaclync Oct 13, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the suggestion. Originally, I used a local feature flag so that it's more obvious that the code can be removed once the Liquid Glass design is launched. However, it does rely on a strict sync with the removal of the Info.plist entry, which cannot be guaranteed if some miscommunication happens. I made an update in d968d88 to replace the feature flag check with the Info.plist check as you suggested.

Regarding the iOS 26+ check, I'm leaving it out so that the native tab badge is applied to all iOS versions once the Liquid Glass design is enabled. iOS version adoption is usually pretty fast, and I don't think showing the native tab badge design causes critical UI/UX issues. We can remove the legacy fragile code sooner.

default:
return true
}
Expand Down
5 changes: 5 additions & 0 deletions Modules/Sources/Experiments/FeatureFlag.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -207,4 +207,9 @@ public enum FeatureFlag: Int {
/// Enables a new Bookings tab for CIAB sites
///
case ciabBookings

/// Should be enabled when the Liquid Glass design is enabled (via the Info.plist `UIDesignRequiresCompatibility`).
/// Current changes behind this feature flag: replacing the Menu tab custom "dot" badge with the native tab bar badge.
///
case liquidGlassDesign
}
14 changes: 12 additions & 2 deletions WooCommerce/Classes/ViewRelated/MainTabBarController.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -929,9 +929,19 @@ private extension MainTabBarController {
func updateMenuTabBadge(with action: NotificationBadgeActionType) {
let tab = WooTab.hubMenu
let tabIndex = tab.visibleIndex(isPOSTabVisible: isPOSTabVisible, isBookingsTabVisible: isBookingsTabVisible)
let input = NotificationsBadgeInput(action: action, tab: tab, tabBar: self.tabBar, tabIndex: tabIndex)

self.notificationsBadge.updateBadge(with: input)
guard featureFlagService.isFeatureFlagEnabled(.liquidGlassDesign) else {
let input = NotificationsBadgeInput(action: action, tab: tab, tabBar: tabBar, tabIndex: tabIndex)
notificationsBadge.updateBadge(with: input)
return
}

switch action {
case .show:
tabBar.items?[tabIndex].badgeValue = "•"
case .hide:
tabBar.items?[tabIndex].badgeValue = nil
}
}
}

Expand Down