add animated toggle on the onboarding input selection screen

[LukasPaczos]

Task/Issue URL: https://app.asana.com/1/137249556945/project/1208671518894266/task/1213981966750223?focus=true

Description

Replaces static ImageView drawables with Lottie animations for the AI Chat toggle on the onboarding input selection screen. Animations loop with a 2-second delay between repeats. When the user switches between options, the Lottie crossfade preserves the current animation progress for a seamless transition.

Steps to test this PR

Apply patch

Subject: [PATCH] onboarding
---
Index: app/src/main/java/com/duckduckgo/app/onboarding/ui/OnboardingViewModel.kt
IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
===================================================================
diff --git a/app/src/main/java/com/duckduckgo/app/onboarding/ui/OnboardingViewModel.kt b/app/src/main/java/com/duckduckgo/app/onboarding/ui/OnboardingViewModel.kt
--- a/app/src/main/java/com/duckduckgo/app/onboarding/ui/OnboardingViewModel.kt	(revision 06d747bcc29beada0a444df876b05f55f0dbb4d5)
+++ b/app/src/main/java/com/duckduckgo/app/onboarding/ui/OnboardingViewModel.kt	(date 1775628931668)
@@ -45,7 +45,7 @@
     val viewState = _viewState.asStateFlow()
 
     fun initializePages() {
-        pageLayoutManager.buildPageBlueprints()
+        pageLayoutManager.buildBrandDesignUpdatePageBlueprints()
     }
 
     fun pageCount(): Int {
@@ -70,7 +70,7 @@
     }
 
     fun initializeOnboardingSkipper() {
-        if (!appBuildConfig.canSkipOnboarding) return
+        return
 
         // delay showing skip button until privacy config downloaded
         viewModelScope.launch {

• Launch the app with a fresh install / clear data to trigger the onboarding flow
• Go through onboarding to the AI chat toggle screen (after address bar position)
• Progress to the input selection screen (search bar configuration)
• Verify the "Search + AI Chat" toggle shows an animated Lottie (expanding input bar effect) that loops with a brief pause
• Tap to switch between "Search only" and "Search + AI Chat" - verify the crossfade transition is smooth and the animation continues from the same point
• Rotate the device - verify the animation restarts correctly after configuration change
• Restart the onboarding flow (clear data)
• Go to AI chat toggle step again but as the view fades in, click it to skip the transition
• Verify the toggle animations still plays correctly
• Switch between light/dark modes and verify the pictograms and animations look correct

UI changes

onboarding-input-toggle-animation-v2.mp4

---

Note

Medium Risk
UI-only change but adds new Lottie animation assets plus coroutine-driven looping/crossfade logic that could regress onboarding rendering or leak/cancel incorrectly across lifecycle events.

Overview
Adds animated Lottie-based visuals for the onboarding input selection toggle ("Search only" vs "Search + AI Chat"), replacing the previous static assets and selecting light/dark variants.

Updates the onboarding screen logic to manage toggle state transitions via InputToggleTransition, including seamless crossfades that preserve Lottie progress and a delayed repeat loop; also tightens lifecycle cleanup by cancelling jobs, listeners, and animations on teardown.

Moves/introduces new resources: vector drawables for the non-AI state and four Lottie JSONs for the AI state, while removing the old duckchat-impl searchbox vector assets.

^{Reviewed by Cursor Bugbot for commit 3f02c05. Bugbot is set up for automated code reviews on this repo. Configure here.}

[mikescamell]

bugbot run

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 3685596. Configure here.}

[mikescamell]

@LukasPaczos It definitely works! 🚀

But I'm noticing that it takes quite a while for the animation to play when landing on the screen, and I wonder if it's almost too long so people will actually never see it. I'm guessing everything is according to spec? Regardless, I think we would benefit with playing it a little quicker

[mikescamell]

Works as expected!

But I think it's worth clarifying with design if we really want to wait that long for the animation to play, but it might be my bias as I know the onboarding steps 😅 #8254 (comment)

[LukasPaczos]

The initial 2 seconds delay is by design. Feels a little too long for me too but it might be our bias - I think we can adjust as we go and as people start playing around with it in test builds.