Fix syncing flow navigation and designs (#21884)

Author: Parveshdhull

src/status_im/contexts/onboarding/intro/view.cljs

@@ -73,7 +73,6 @@
      [quo/bottom-actions
       (cond->
         {:container-style  (style/bottom-actions-container (safe-area/get-bottom))
-         :actions          :two-vertical-actions
          :description      :bottom
          :description-text [terms]}
 

src/status_im/contexts/onboarding/syncing/progress/style.cljs

@@ -21,9 +21,10 @@
    :background-color (when-not in-onboarding? colors/neutral-80-opa-80-blur)})
 
 (defn page-illustration
-  [width]
+  [width pairing-progress?]
   {:flex            1
    :width           width
    :align-items     :center
+   :margin-vertical (when pairing-progress? 24)
    :align-self      :center
    :justify-content :center})

src/status_im/contexts/onboarding/syncing/progress/view.cljs

@@ -18,11 +18,10 @@
   [quo/text-combinations
    {:container-style                 {:margin-top 56 :margin-horizontal 20}
     :title                           (i18n/label (if pairing-progress?
-                                                   :t/sync-devices-title
+                                                   :t/sync-profile-title
                                                    :t/sync-devices-error-title))
-    :description                     (i18n/label (if pairing-progress?
-                                                   :t/sync-devices-sub-title
-                                                   :t/sync-devices-error-sub-title))
+    :description                     (when-not pairing-progress?
+                                       (i18n/label :t/sync-devices-error-sub-title))
     :title-accessibility-label       :progress-screen-title
     :description-accessibility-label :progress-screen-sub-title}])
 
@@ -43,30 +42,29 @@
 (defn try-again-button
   [profile-color logged-in?]
   [quo/bottom-actions
-   {:actions (if logged-in? :one-action :two-actions)
+   {:actions (if logged-in? :one-action :two-vertical-actions)
     :blur? true
-    :button-one-label (i18n/label :t/recovery-phrase)
-    :button-one-props {:type                :primary
+    :container-style {:height (when-not logged-in? 116)}
+    :button-two-label (i18n/label :t/use-recovery-phrase)
+    :button-two-props {:type                :primary
                        :accessibility-label :try-seed-phrase-button
                        :customization-color profile-color
-                       :container-style     {:flex 1}
                        :size                40
                        :on-press            navigate-to-enter-seed-phrase}
-    (if logged-in? :button-one-label :button-two-label)
+    :button-one-label
     (i18n/label :t/try-again)
-    (if logged-in? :button-one-props :button-two-props)
+    :button-one-props
     {:type                (if logged-in? :primary :grey)
      :accessibility-label :try-again-later-button
      :customization-color profile-color
-     :container-style     {:flex 1}
      :size                40
      :on-press            #(try-again logged-in?)}}])
 
 (defn- illustration
   [pairing-progress?]
   [rn/image
    {:resize-mode :contain
-    :style       (style/page-illustration (:width (rn/get-window)))
+    :style       (style/page-illustration (:width (rn/get-window)) pairing-progress?)
     :source      (resources/get-image (if pairing-progress? :syncing-devices :syncing-wrong))}])
 
 (defn view
@@ -83,7 +81,12 @@
      [quo/page-nav {:type :no-title :background :blur}]
      [page-title pairing-progress?]
      [illustration pairing-progress?]
-     (when-not (pairing-progress pairing-status)
+     (if pairing-progress?
+       [quo/information-box
+        {:type  :default
+         :blur? true
+         :style {:margin-vertical 11 :margin-horizontal 12}}
+        (i18n/label :t/sync-devices-sub-title)]
        [try-again-button profile-color logged-in?])]))
 
 (defn view-onboarding

src/status_im/contexts/profile/login/events.cljs

@@ -82,7 +82,7 @@
                    [:dispatch [:centralized-metrics/track :metric/keycard-login]])]
                 (cond
                   pairing-completed?
-                  [[:dispatch [:update-theme-and-init-root :screen/onboarding.syncing-results]]]
+                  [[:dispatch [:onboarding/finish-onboarding false]]]
 
                   (get db :onboarding/new-account?)
                   [[:dispatch [:onboarding/finalize-setup]]

translations/en.json

@@ -2517,14 +2517,15 @@
   "sync-code-generated": "Sync code generated",
   "sync-devices-complete-sub-title": "Your devices are now in sync",
   "sync-devices-complete-title": "Device sync complete!",
-  "sync-devices-error-sub-title": "Make sure both devices are powered on and connected to the internet.",
-  "sync-devices-error-title": "Oops, something’s wrong",
+  "sync-devices-error-sub-title": "Try again and double-check the instructions",
+  "sync-devices-error-title": "Oops, something’s wrong!",
   "sync-devices-result-sub-title": "Your devices are now in sync",
-  "sync-devices-sub-title": "Please keep both devices switched on and connected to the internet until sync is complete",
+  "sync-devices-sub-title": "Please keep both devices switched on and connected to the same network until sync is complete.",
   "sync-devices-title": "Syncing devices...",
   "sync-in-progress": "Syncing...",
   "sync-new-device": "Sync new device",
   "sync-or-recover-profile": "Sync or recover profile",
+  "sync-profile-title": "Syncing profile...",
   "sync-settings": "Sync settings",
   "sync-synced": "In sync",
   "sync-your-profile": "Sync your profile",

translations/ja.json

@@ -1913,7 +1913,6 @@
     "sync-code-generated": "同期コードが生成されました",
     "sync-devices-complete-sub-title": "お使いのデバイスが同期されました",
     "sync-devices-complete-title": "デバイスの同期が完了しました！",
-    "sync-devices-error-sub-title": "両方のデバイスの電源がオンになっていて、インターネットに接続されていることを確認してください。",
     "sync-devices-error-title": "おっと、何かが間違っています",
     "sync-devices-result-sub-title": "お使いのデバイスが同期されました",
     "sync-devices-sub-title": "同期が完了するまで、両方のデバイスの電源を入れ、インターネットに接続したままにしてください。",