Revert "Playing around"

This reverts commit f58a7fafa1.

src/components/Button.tsx

@@ -76,7 +76,6 @@ export type ButtonProps = Pick<
   | 'onHoverOut'
   | 'onPressIn'
   | 'onPressOut'
-  | 'onLayout'
 > &
   AccessibilityProps &
   VariantProps & {

src/components/Layout/Header/index.tsx

@@ -74,7 +74,6 @@ export function Content({
       style={[
         a.flex_1,
         a.justify_center,
-        a.z_20,
         isIOS && align === 'platform' && a.align_center,
         {minHeight: HEADER_SLOT_SIZE},
       ]}>
@@ -89,7 +88,7 @@ export function Slot({children}: {children?: React.ReactNode}) {
   return (
     <View
       style={[
-        a.z_10,
+        a.z_50,
         {
           width: HEADER_SLOT_SIZE,
         },

src/screens/Profile/components/ProfileSubpageHeader.tsx

@@ -1,20 +1,16 @@
-import {useRef, useState} from 'react'
 import {View, Text as RNText} from 'react-native'
 import {useLingui} from '@lingui/react'
 import {msg, plural, Trans} from '@lingui/macro'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
-import {isWeb} from '#/platform/detection'
 import * as Layout from '#/components/Layout'
-import {atoms as a, useTheme, useBreakpoints, web, useGutters} from '#/alf'
+import {atoms as a, useTheme, useBreakpoints, web} from '#/alf'
 import {UserAvatar} from '#/view/com/util/UserAvatar'
 import {Text} from '#/components/Typography'
 import {Pin_Stroke2_Corner0_Rounded as Pin} from '#/components/icons/Pin'
 import {ChevronBottom_Stroke2_Corner0_Rounded as ChevronDown} from '#/components/icons/Chevron'
 import {Button, ButtonIcon} from '#/components/Button'
 import {sanitizeHandle} from '#/lib/strings/handles'
-import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
-import * as Menu from '#/components/Menu'
 
 export function ProfileSubpageHeader({
   title,
@@ -31,32 +27,10 @@ export function ProfileSubpageHeader({
   const {gtPhone, gtMobile} = useBreakpoints()
   const {_} = useLingui()
   const {top} = useSafeAreaInsets()
-  const [open, setOpen] = useState(false)
-  const baseGutters = useGutters(['compact'])
-
-  const outerSize = useRef({width: 0, height: 0})
-  const buttonSize = useRef({width: 0, height: 0})
-  const outerOffset = ((outerSize.current.width - buttonSize.current.width) / 2) - baseGutters.paddingLeft
 
   return (
-    <>
-      {open && !isWeb && (
-        <View style={[
-          a.fixed,
-          a.inset_0,
-          a.z_40,
-          { backgroundColor: t.palette.black, opacity: 0.7 },
-        ]} />
-      )}
-
     <Layout.Center
-        style={[t.atoms.bg, a.z_50, {paddingTop: top}, web([a.sticky, {top: 0}])]}
-        onLayout={({nativeEvent}) => {
-          outerSize.current = {
-            width: nativeEvent.layout.width,
-            height: nativeEvent.layout.height,
-          }
-        }}
+      style={[t.atoms.bg, a.z_10, {paddingTop: top}, web([a.sticky, a.z_10, {top: 0}])]}
     >
       <Layout.Header.Outer>
         <Layout.Header.BackButton />
@@ -70,15 +44,7 @@ export function ProfileSubpageHeader({
                 paddingHorizontal: 8,
                 paddingRight: 12,
               },
-              ]}
-              onPress={() => setOpen(!open)}
-              onLayout={({nativeEvent}) => {
-                buttonSize.current = {
-                  width: nativeEvent.layout.width,
-                  height: nativeEvent.layout.height,
-                }
-              }}
-            >
+            ]}>
             {({hovered}) => (
               <>
                 <View
@@ -88,50 +54,13 @@ export function ProfileSubpageHeader({
                     a.rounded_sm,
                     a.transition_transform,
                     t.atoms.bg_contrast_25,
-                      (hovered && !open) && {
+                    hovered && {
                       transform: [{scaleX: 1.01}, {scaleY: 1.1}],
                     },
                   ]}
                 />
-                  <View
-                    style={[
-                      a.absolute,
-                      a.inset_0,
-                      a.rounded_sm,
-                      a.transition_transform,
-                      a.z_20,
-                      t.atoms.bg_contrast_25,
-                      {
-                        opacity: 0,
-                      },
-                      open && [t.atoms.shadow_lg, {
-                        opacity: 1,
-                        bottom: 'auto',
-                        left: outerOffset * -1,
-                        right: outerOffset * -1,
-                      }]
-                    ]}
-                  >
-                    {open && (
-                      <View style={[baseGutters]}>
-                        <View style={[a.flex_row, a.align_center, a.gap_sm]}>
-                          <UserAvatar
-                            type='algo'
-                            size={58}
-                            avatar={avatar}
-                          />
-                          <View style={[
-                          ]}>
-                            <Text style={[a.text_xl, a.font_heavy]}>{title}</Text>
-                          </View>
-                        </View>
-                      </View>
-                    )}
-                  </View>
 
-                  <View style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm, open && {
-                    left: outerOffset * -1,
-                  }]}>
+                <View style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
                   {avatar && (
                     <UserAvatar size={32} type="algo" avatar={avatar} />
                   )}
@@ -192,6 +121,5 @@ export function ProfileSubpageHeader({
         </Layout.Header.Slot>
       </Layout.Header.Outer>
     </Layout.Center>
-    </>
   )
 }