From 84cf3fdca563a360fb754c84d96eed3deabb8b19 Mon Sep 17 00:00:00 2001
From: "Joshua A. Horton" <joshua_horton@sil.org>
Date: Fri, 12 May 2023 14:25:21 +0700
Subject: [PATCH] fix(web): banner state management after predict-mode toggling

---
 .../src/text/prediction/languageProcessor.ts           | 10 ++++++++++
 web/src/engine/osk/src/banner/bannerView.ts            |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/common/web/input-processor/src/text/prediction/languageProcessor.ts b/common/web/input-processor/src/text/prediction/languageProcessor.ts
index 0516b7e2d6..8aea39eedc 100644
--- a/common/web/input-processor/src/text/prediction/languageProcessor.ts
+++ b/common/web/input-processor/src/text/prediction/languageProcessor.ts
@@ -415,9 +415,19 @@ export default class LanguageProcessor extends EventEmitter<LanguageProcessorEve
       // If it there was one and we've reached this point, we're globally
       // deactivating, so we're fine.
       if(this.activeModel) {
+        // If someone toggles predictions on and off without changing the model, it is possible
+        // that the model is already configured!
         let state: StateChangeEnum = flag ? 'active' : 'inactive';
+
+        // We always signal the 'active' state here, even if 'configured', b/c of an
+        // anti-banner-flicker optimization in the Android app.
         this._state = state;
         this.emit('statechange', state);
+
+        if(this.isConfigured) {
+          this._state = 'configured';
+          this.emit('statechange', 'configured');
+        }
       }
     }
   }
diff --git a/web/src/engine/osk/src/banner/bannerView.ts b/web/src/engine/osk/src/banner/bannerView.ts
index 5ff85b8376..556ec61762 100644
--- a/web/src/engine/osk/src/banner/bannerView.ts
+++ b/web/src/engine/osk/src/banner/bannerView.ts
@@ -296,7 +296,7 @@ export class BannerController {
    */
   selectBanner(state: StateChangeEnum) {
     // Only display a SuggestionBanner when LanguageProcessor states it is active.
-    if(state == 'active') {
+    if(state == 'active' || state == 'configured') {
       this.setBanner('suggestion');
     } else if(state == 'inactive') {
       if(this.alwaysShow) {