start refacto home and fix description

src/layouts/Page.js

@@ -1,19 +1,18 @@
 /* eslint-disable react/display-name */
-import { Image, View } from "react-native";
+import { Alert, Image, Pressable, Text, View, Platform } from "react-native";
 import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
 import { SafeAreaView } from "react-native-safe-area-context";
-import React, { setGlobal, useEffect, useState } from "reactn";
-
+import React, { setGlobal, useEffect } from "reactn";
 import { responsiveHeight } from "../actions/responsiveSizes.js";
-
-import { gutters } from "../styles";
-
+import { gutters, Palette } from "../styles";
 import BaseHeader from "../components/BaseHeader";
 import NavigateHeader from "../components/NavigateHeader";
-
-import { background } from "../assets/index.js";
+import { background, icons } from "../assets";
 import { isDesktop, isWeb } from "../hooks/useLayoutType.js";
 import { useUserData } from "../providers/UserDataProvider.js";
+import { BlurView } from "expo-blur";
+import { FONT_FAMILY } from "../styles/Fonts";
+import ShareBtnWeb from "../components/ShareBtnWeb";
 
 export default ({
   children,
@@ -37,21 +36,15 @@ export default ({
   backgroundImg = background.writingBG,
   headerTitleStyle = {},
   hideBackButton = false,
+  shareBtn = false,
 }) => {
   const { currentUID } = useUserData();
 
-  const [scrollPosition, setScrollPosition] = useState(0);
-
   const PageContainer =
     containerType === "SAFE_AREA_VIEW" ? SafeAreaView : View;
 
   const ContentContainer = scrollEnabled ? KeyboardAwareScrollView : View;
 
-  const handleScroll = (event) => {
-    const position = event.nativeEvent.contentOffset.y;
-    setScrollPosition(position);
-  };
-
   // On web, push the background image to a global so AppLayout can render
   // a full-screen background behind the phone frame. We avoid rendering
   // the per-screen background inside the phone on web to prevent duplication.
@@ -104,7 +97,6 @@ export default ({
           style={{ flex: 1, ...contentContainerStyle }}
           {...(scrollEnabled
             ? {
-                onScroll: handleScroll,
                 scrollEventThrottle: 80,
                 showsVerticalScrollIndicator: false,
                 contentContainerStyle: { paddingBottom: responsiveHeight(55) },
@@ -117,6 +109,9 @@ export default ({
       </PageContainer>
 
       {bottomStickyContent?.()}
+      {shareBtn && (
+        <ShareBtnWeb style={{ position: "absolute", top: 24, right: 24 }} />
+      )}
     </>
   );
 };