fix of the day, payment + sub + music generation

src/layouts/Page.js

@@ -1,5 +1,5 @@
 /* eslint-disable react/display-name */
-import { Image, Pressable, Text, View } from "react-native";
+import { Image, Pressable, Text, View, StyleSheet } from "react-native";
 import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
 import { SafeAreaView } from "react-native-safe-area-context";
 import React from "reactn";
@@ -168,6 +168,19 @@ export default ({
     return <ShareBtn />;
   })();
 
+  const resolvedContainerStyle = React.useMemo(
+    () => StyleSheet.flatten(containerStyle) || {},
+    [containerStyle],
+  );
+  const resolvedHeaderStyle = React.useMemo(
+    () => StyleSheet.flatten(headerStyle) || {},
+    [headerStyle],
+  );
+  const resolvedContentContainerStyle = React.useMemo(
+    () => StyleSheet.flatten(contentContainerStyle) || {},
+    [contentContainerStyle],
+  );
+
   return (
     <View
       style={{
@@ -256,15 +269,15 @@ export default ({
           width: computedWidth,
           maxWidth: maxWidth ? maxWidth : null,
           alignSelf: isWeb ? "center" : "auto",
-          ...containerStyle,
+          ...resolvedContainerStyle,
         }}
       >
         {headerType !== "NONE" ? (
           headerType === "BASE" ? (
-            <BaseHeader containerStyle={{ ...headerStyle }} />
+            <BaseHeader containerStyle={{ ...resolvedHeaderStyle }} />
           ) : (
             <NavigateHeader
-              containerStyle={{ ...headerStyle }}
+              containerStyle={{ ...resolvedHeaderStyle }}
               title={title}
               rightComponent={rightComponent}
               onBackPressed={onBackPressed}
@@ -277,7 +290,7 @@ export default ({
         {topStickyContent?.()}
 
         <ContentContainer
-          style={{ flex: 1, ...contentContainerStyle }}
+          style={{ flex: 1, ...resolvedContentContainerStyle }}
           {...(scrollEnabled
             ? {
                 scrollEventThrottle: 80,