feat(@desktop/privacyMode): Added missing files for mobile screens in light and

dark mode + desktop dark mode of placeholders when ThirdParty services are
disabled

src/app/global/feature_flags.nim

@@ -23,7 +23,7 @@ const DEFAULT_FLAG_SIMPLE_SEND_ENABLED = true
 const DEFAULT_FLAG_MARKET_ENABLED = true
 const DEFAULT_FLAG_HOMEPAGE_ENABLED = true
 const DEFAULT_FLAG_LOCAL_BACKUP_ENABLED = true
-const DEFAULT_FLAG_PRIVACY_MODE_FEATURE_ENABLED = false
+const DEFAULT_FLAG_PRIVACY_MODE_FEATURE_ENABLED = true
 
 # Compile time feature flags
 const DEFAULT_FLAG_DAPPS_ENABLED  = true

ui/StatusQ/CMakeLists.txt

@@ -140,6 +140,18 @@ if (${STATUSQ_SHADOW_BUILD})
         src/assets/png/png.qrc
         src/assets/twemoji/twemoji.qrc
         src/assets/twemoji/twemoji-svg.qrc)
+
+    # Platform-specific PNG bundles
+    if(ANDROID OR IOS)
+        list(APPEND STATUSQ_QRC_FILES
+            src/assets/png/png-mobile.qrc
+        )
+    else()
+        list(APPEND STATUSQ_QRC_FILES
+            src/assets/png/png-desktop.qrc
+        )
+    endif()
+
     if (${STATUSQ_STATIC_LIB})
         # randlib would complain about the generated .o files. Generate cpp files instead.
         qt_add_resources(STATUSQ_QRC_COMPILED ${STATUSQ_QRC_FILES})

ui/StatusQ/src/assets/png/png-desktop.qrc

@@ -0,0 +1,16 @@
+<RCC>
+    <qresource prefix="/assets/png">
+        <file>market/tradeCenter-light.png</file>
+        <file>market/swap-light.png</file>
+        <file>market/tradeCenter-dark.png</file>
+        <file>market/swap-dark.png</file>
+        <file>wallet/placeholders/buyView-dark.png</file>
+        <file>wallet/placeholders/collectiblesView-dark.png</file>
+        <file>wallet/placeholders/swapView-dark.png</file>
+        <file>wallet/placeholders/mainView-dark.png</file>
+        <file>wallet/placeholders/swapView-light.png</file>
+        <file>wallet/placeholders/mainView-light.png</file>
+        <file>wallet/placeholders/collectiblesView-light.png</file>
+        <file>wallet/placeholders/buyView-light.png</file>
+    </qresource>
+</RCC>

ui/StatusQ/src/assets/png/png-mobile.qrc

@@ -0,0 +1,16 @@
+<RCC>
+    <qresource prefix="/assets/png">
+        <file>market/tradeCenter-light-small.png</file>
+        <file>market/swap-light-small.png</file>
+        <file>market/tradeCenter-dark-small.png</file>
+        <file>market/swap-dark-small.png</file>
+        <file>wallet/placeholders/mainView-light-small.png</file>
+        <file>wallet/placeholders/collectiblesView-light-small.png</file>
+        <file>wallet/placeholders/buyView-light-small.png</file>
+        <file>wallet/placeholders/swapView-light-small.png</file>
+        <file>wallet/placeholders/mainView-dark-small.png</file>
+        <file>wallet/placeholders/collectiblesView-dark-small.png</file>
+        <file>wallet/placeholders/buyView-dark-small.png</file>
+        <file>wallet/placeholders/swapView-dark-small.png</file>
+    </qresource>
+</RCC>

ui/StatusQ/src/assets/png/png.qrc

@@ -924,11 +924,5 @@
         <file>status-logo-icon.png</file>
         <file>status-preparing.png</file>
         <file>unfurling-image.png</file>
-        <file>wallet/placeholders/buyView.png</file>
-        <file>wallet/placeholders/swapView.png</file>
-        <file>wallet/placeholders/collectiblesView.png</file>
-        <file>wallet/placeholders/mainView.png</file>
-        <file>market/tradeCenter.png</file>
-        <file>market/swap.png</file>
     </qresource>
 </RCC>

ui/StatusQ/src/typesregistration.cpp

@@ -103,6 +103,11 @@ void registerStatusQTypes() {
     Q_INIT_RESOURCE(fonts);
     Q_INIT_RESOURCE(img);
     Q_INIT_RESOURCE(png);
+#if defined(Q_OS_ANDROID) || defined(Q_OS_IOS)
+    Q_INIT_RESOURCE(png_mobile);
+#else
+    Q_INIT_RESOURCE(png_desktop);
+#endif
     Q_INIT_RESOURCE(twemoji);
     Q_INIT_RESOURCE(twemoji_svg);
 #endif

ui/imports/shared/panels/PrivacyWallCarousel.qml

@@ -20,6 +20,22 @@ Control {
     signal openDiscussPageRequested()
     signal enableThirdpartyServicesRequested()
 
+    QtObject {
+        id: d
+        readonly property var window: root.contentItem.Window.window
+        readonly property int windowWidth: window ? window.width: Screen.width
+        readonly property int windowHeight: window ? window.height: Screen.height
+        readonly property bool isSmallPortraitScreen: windowHeight > windowWidth
+                                            // The max width of a phone in portrait mode
+                                            && windowWidth <= Theme.portraitBreakpoint.width
+        function getImagePath(currentIndex) {
+            const imageName = root.model.get(currentIndex).image
+            const platformPostfix = isSmallPortraitScreen ? "-small": ""
+            const imagePath =  "%1-%2%3".arg(imageName).arg(Theme.palette.name).arg(platformPostfix)
+            return Theme.png(imagePath)
+        }
+    }
+
     verticalPadding: Theme.xlPadding
     horizontalPadding: Theme.xlPadding * 2
 
@@ -28,30 +44,49 @@ Control {
 
         Item { Layout.fillHeight: true }
 
-        StatusBaseText {
+        ColumnLayout {
+            readonly property int maxChildrenHeight: (primaryText.maximumLineCount * primaryText.lineHeight) +
+                                                      (secondaryText.maximumLineCount * secondaryText.lineHeight)
+
             Layout.fillWidth: true
+            Layout.preferredHeight: maxChildrenHeight
+            Layout.maximumHeight: maxChildrenHeight
+            spacing: 0
 
-            horizontalAlignment: Text.AlignHCenter
-            font.weight: Font.Bold
-            font.pixelSize: 22
-            lineHeightMode: Text.FixedHeight
-            lineHeight: 30
-            wrapMode: Text.WordWrap
+            Item { Layout.fillHeight: true }
 
-            text: root.model.get(pageIndicator.currentIndex).primary
-        }
+            StatusBaseText {
+                id: primaryText
 
-        StatusBaseText {
-            Layout.topMargin: -parent.spacing
-            Layout.fillWidth: true
+                Layout.fillWidth: true
+                Layout.alignment: Qt.AlignBottom
 
-            horizontalAlignment: Text.AlignHCenter
-            font.pixelSize: Theme.additionalTextSize
-            lineHeightMode: Text.FixedHeight
-            lineHeight: 18
-            wrapMode: Text.WordWrap
+                horizontalAlignment: Text.AlignHCenter
+                font.weight: Font.Bold
+                font.pixelSize: 22
+                wrapMode: Text.WordWrap
+                lineHeightMode: Text.FixedHeight
+                lineHeight: 30
+                maximumLineCount: 2
 
-            text: root.model.get(pageIndicator.currentIndex).secondary
+                text: root.model.get(pageIndicator.currentIndex).primary
+            }
+
+            StatusBaseText {
+                id: secondaryText
+
+                Layout.fillWidth: true
+                Layout.alignment: Qt.AlignBottom
+
+                horizontalAlignment: Text.AlignHCenter
+                font.pixelSize: Theme.additionalTextSize
+                lineHeightMode: Text.FixedHeight
+                lineHeight: 18
+                wrapMode: Text.WordWrap
+                maximumLineCount: 2
+
+                text: root.model.get(pageIndicator.currentIndex).secondary
+            }
         }
 
         Image {
@@ -74,7 +109,7 @@ Control {
                 id: fadeSwap
                 OpacityAnimator { target: placeholderImage; from: 1; to: 0; duration: 500;}
                 PropertyAction   { target: placeholderImage; property: "source";
-                                   value: Theme.png(root.model.get(pageIndicator.currentIndex).image) }
+                                   value: d.getImagePath(pageIndicator.currentIndex) }
                 OpacityAnimator { target: placeholderImage; from: 0; to: 1; duration: 500; }
             }
 
@@ -89,7 +124,7 @@ Control {
             }
 
             Component.onCompleted: {
-                placeholderImage.source = Theme.png(root.model.get(pageIndicator.currentIndex).image)
+                placeholderImage.source = d.getImagePath(pageIndicator.currentIndex)
                 initialized = true
             }
         }
@@ -101,6 +136,7 @@ Control {
             Layout.maximumWidth: parent.width
 
             count: root.model.count
+            visible: count > 1
         }
 
         StatusBaseText {

ui/nim-status-client.pro

@@ -42,6 +42,8 @@ RESOURCES += resources.qrc \
             StatusQ/src/assets/fonts/fonts.qrc \
             StatusQ/src/assets/img/img.qrc \
             StatusQ/src/assets/png/png.qrc \
+            StatusQ/src/assets/png/png-desktop.qrc \
+            StatusQ/src/assets/png/png-mobile.qrc \
             StatusQ/src/assets/twemoji/twemoji.qrc \
             StatusQ/src/assets/twemoji/twemoji-big.qrc \
             StatusQ/src/assets/twemoji/twemoji-svg.qrc \