refactor: restructure

monorepo with apps/ and services/
  directories

apps/picture/packages/mobile-ui/components/navigation/HeaderButton/HeaderButton.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+import { Pressable, ViewStyle, PressableProps } from 'react-native';
+import { Icon } from '../../ui/Icon';
+
+export type HeaderButtonProps = {
+  /** Icon name */
+  icon: string;
+  /** Press handler */
+  onPress: () => void;
+  /** Icon size */
+  size?: number;
+  /** Icon color */
+  iconColor?: string;
+  /** Button is disabled */
+  disabled?: boolean;
+  /** Additional styles */
+  style?: ViewStyle;
+  /** Hit slop for better touch target */
+  hitSlop?: PressableProps['hitSlop'];
+};
+
+export function HeaderButton({
+  icon,
+  onPress,
+  size = 24,
+  iconColor = '#6B7280',
+  disabled = false,
+  style,
+  hitSlop = { top: 10, bottom: 10, left: 10, right: 10 },
+}: HeaderButtonProps) {
+  return (
+    <Pressable
+      onPress={onPress}
+      disabled={disabled}
+      hitSlop={hitSlop}
+      style={({ pressed }) => [
+        {
+          padding: 8,
+          opacity: disabled ? 0.4 : pressed ? 0.7 : 1,
+        },
+        style,
+      ]}
+    >
+      <Icon name={icon} size={size} color={iconColor} />
+    </Pressable>
+  );
+}