@oxyhq/services 23.0.2 → 23.1.0

package/lib/module/ui/components/ProfileButton.js

@@ -0,0 +1,342 @@
+"use strict";
+
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { View, Pressable, StyleSheet, Platform } from 'react-native';
+import MaterialCommunityIcons from '@expo/vector-icons/MaterialCommunityIcons';
+import { Avatar } from '@oxyhq/bloom/avatar';
+import * as Skeleton from '@oxyhq/bloom/skeleton';
+import { Text } from '@oxyhq/bloom/typography';
+import { useTheme } from '@oxyhq/bloom/theme';
+import { getAccountDisplayName, getAccountFallbackHandle } from '@oxyhq/core';
+import { useAuth } from "../hooks/useAuth.js";
+import { useOxy } from "../context/OxyContext.js";
+import { useI18n } from "../hooks/useI18n.js";
+import { registerAccountDialogConsumerHooks } from "../navigation/accountDialogManager.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const isWeb = Platform.OS === 'web';
+
+/**
+ * Web-only Bluesky-style hover animation timings, mirrored from
+ * `social-app/src/view/shell/desktop/LeftNav.tsx`. The row background and the
+ * name/handle/chevron opacity cross-fade quickly; the avatar shrink+slide is
+ * slower and more deliberate. A short delay on the LEAVE transition keeps the
+ * row from flickering when the pointer crosses a child boundary.
+ */
+const BG_TRANSITION_MS = 150;
+const AVATAR_TRANSITION_MS = 250;
+const OPACITY_TRANSITION_MS = 150;
+const LEAVE_DELAY_MS = 50;
+
+/** Shrunk-avatar scale on hover, matching Bluesky's `scale: 2/3`. */
+const ACTIVE_AVATAR_SCALE = 2 / 3;
+
+/**
+ * Reads the OS "reduce motion" preference on web. Guards `window`/`matchMedia`
+ * so it is safe during SSR and on native (where it is never called). When
+ * reduced motion is on, the avatar transform snaps instead of transitioning.
+ */
+const prefersReducedMotion = () => {
+  if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {
+    return false;
+  }
+  return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+};
+/**
+ * Self-contained sidebar account trigger, modeled on Bluesky's ProfileCard and
+ * the Oxy inbox's `MailboxDrawer` footer. Pressing it opens the unified
+ * {@link OxyAccountDialogScreen} — the single account switcher + sign-in surface — via
+ * `useOxy().openAccountDialog`.
+ *
+ * Three auth states from {@link useAuth}:
+ *  - **Undetermined** (`!isAuthResolved || isPrivateApiPending`): a neutral
+ *    avatar-sized skeleton circle, no press.
+ *  - **Signed in**: a pressable row — Bloom `Avatar` + display name + `@handle`
+ *    + a chevron. Press opens the dialog on its `accounts` view.
+ *  - **Signed out**: a "Sign in" row that calls `useAuth().signIn()` (which opens
+ *    the dialog on its `signin` view).
+ *
+ * Styling uses react-native `StyleSheet` + the Bloom theme (via `useTheme`) so
+ * the layout renders identically in EVERY consumer — including apps that do not
+ * use NativeWind (e.g. the accounts app). Only the web hover animation keeps
+ * dynamic inline `style` (the CSS transition/transform values), which is what
+ * the `react-native-web-style.d.ts` augmentation exists for.
+ */
+const ProfileButton = ({
+  expanded = true,
+  avatarSize,
+  onNavigateManage,
+  onAddAccount,
+  onNavigateProfile,
+  className,
+  style
+}) => {
+  const {
+    user,
+    isAuthenticated,
+    isAuthResolved,
+    isPrivateApiPending,
+    signIn
+  } = useAuth();
+  const {
+    openAccountDialog,
+    oxyServices
+  } = useOxy();
+  const {
+    colors
+  } = useTheme();
+  const {
+    t,
+    locale
+  } = useI18n();
+
+  // Web-only hover/focus tracking for the Bluesky-style reveal animation.
+  // Native has no hover, so these stay false and the row renders statically.
+  const [hovered, setHovered] = useState(false);
+  const [focused, setFocused] = useState(false);
+  const resolvedAvatarSize = avatarSize ?? (expanded ? 40 : 32);
+  const openDialog = useCallback(() => {
+    openAccountDialog('accounts');
+  }, [openAccountDialog]);
+  useEffect(() => {
+    if (!onNavigateManage && !onAddAccount && !onNavigateProfile) {
+      return undefined;
+    }
+    return registerAccountDialogConsumerHooks({
+      onNavigateManage,
+      onAddAccount,
+      onNavigateProfile
+    });
+  }, [onNavigateManage, onAddAccount, onNavigateProfile]);
+  const avatarUrl = useMemo(() => user?.avatar ? oxyServices.getFileDownloadUrl(user.avatar, 'thumb') : undefined, [user?.avatar, oxyServices]);
+
+  // ── Undetermined: skeleton circle, no interaction. ──────────────────────
+  if (!isAuthResolved || isPrivateApiPending) {
+    return /*#__PURE__*/_jsx(View, {
+      className: className,
+      style: style,
+      accessibilityElementsHidden: true,
+      importantForAccessibility: "no-hide-descendants",
+      children: /*#__PURE__*/_jsx(Skeleton.Circle, {
+        size: resolvedAvatarSize
+      })
+    });
+  }
+
+  // ── Signed out: "Sign in" row. ──────────────────────────────────────────
+  if (!isAuthenticated || !user) {
+    const signInLabel = t('common.actions.signIn') || 'Sign in';
+    return /*#__PURE__*/_jsxs(Pressable, {
+      className: className,
+      style: [styles.row, expanded && styles.rowExpanded, style],
+      onPress: () => {
+        void signIn();
+      },
+      accessibilityRole: "button",
+      accessibilityLabel: signInLabel,
+      children: [/*#__PURE__*/_jsx(View, {
+        style: [styles.avatarBadge, {
+          width: resolvedAvatarSize,
+          height: resolvedAvatarSize,
+          backgroundColor: colors.backgroundSecondary
+        }],
+        children: /*#__PURE__*/_jsx(MaterialCommunityIcons, {
+          name: "login",
+          size: Math.round(resolvedAvatarSize * 0.5),
+          color: colors.icon
+        })
+      }), expanded ? /*#__PURE__*/_jsx(Text, {
+        style: [styles.signInLabel, {
+          color: colors.text
+        }],
+        numberOfLines: 1,
+        children: signInLabel
+      }) : null]
+    });
+  }
+
+  // ── Signed in: avatar + identity + chevron. ─────────────────────────────
+  const displayName = getAccountDisplayName(user, locale);
+  const handle = getAccountFallbackHandle(user);
+  const handleLine = handle ? `@${handle}` : null;
+  const avatarNode = /*#__PURE__*/_jsx(Avatar, {
+    source: avatarUrl,
+    variant: "thumb",
+    name: displayName,
+    size: resolvedAvatarSize
+  });
+
+  // `active` combines hover and keyboard focus — exactly like Bluesky's
+  // `state.hovered || state.focused`. Only web ever sets these, so on native
+  // the row renders statically.
+  const active = hovered || focused;
+  const accountLabel = t('accountSwitcher.switchWhileSignedInAs', {
+    name: displayName
+  });
+
+  // Web-only pointer/focus handlers. RN-Web forwards `onHoverIn`/`onHoverOut`
+  // to the underlying element; native Pressable ignores them harmlessly, but
+  // we only attach them on web to keep the native path pristine.
+  const webInteractionProps = isWeb ? {
+    onHoverIn: () => setHovered(true),
+    onHoverOut: () => setHovered(false),
+    onFocus: () => setFocused(true),
+    onBlur: () => setFocused(false)
+  } : undefined;
+  if (!expanded) {
+    // Collapsed: avatar-only. On web, hovering just fades a subtle round
+    // background behind the avatar — no shrink, no text.
+    const collapsedBgStyle = isWeb ? {
+      backgroundColor: active ? colors.backgroundSecondary : 'transparent',
+      transitionProperty: 'background-color',
+      transitionDuration: `${BG_TRANSITION_MS}ms`,
+      transitionDelay: active ? '0ms' : `${LEAVE_DELAY_MS}ms`
+    } : undefined;
+    return /*#__PURE__*/_jsx(View, {
+      className: className,
+      style: style,
+      children: /*#__PURE__*/_jsx(Pressable, {
+        style: [styles.collapsedTrigger, collapsedBgStyle],
+        onPress: openDialog,
+        accessibilityRole: "button",
+        accessibilityLabel: accountLabel,
+        ...webInteractionProps,
+        children: avatarNode
+      })
+    });
+  }
+
+  // ── Expanded row animation ──────────────────────────────────────────────
+  // On native everything is statically visible (no hover exists). On web we
+  // reproduce Bluesky's reveal: the row fills with a subtle contrast bg, the
+  // avatar shrinks + slides left, and the name/handle/chevron fade in. The
+  // negative left margin tucks the identity block under the shrunk avatar so
+  // it slides out from behind it as the avatar contracts.
+  const reducedMotion = isWeb && prefersReducedMotion();
+
+  // Slide the shrunk avatar left so its visual left edge stays put as it
+  // contracts. The avatar loses `size * (1 - scale)` of width; half of that
+  // (the left half, since scale is centered) is the offset, plus the row's
+  // left padding (8px) so it hugs the row edge like Bluesky's.
+  const activeAvatarTranslateX = -(resolvedAvatarSize * (1 - ACTIVE_AVATAR_SCALE)) / 2 - 8;
+  const rowStyle = isWeb ? {
+    backgroundColor: active ? colors.backgroundSecondary : 'transparent',
+    transitionProperty: 'background-color',
+    transitionDuration: `${BG_TRANSITION_MS}ms`,
+    transitionDelay: active ? '0ms' : `${LEAVE_DELAY_MS}ms`
+  } : undefined;
+  const avatarWrapperStyle = isWeb ? {
+    zIndex: 10,
+    ...(reducedMotion ? {} : {
+      transitionProperty: 'transform',
+      transitionDuration: `${AVATAR_TRANSITION_MS}ms`,
+      transitionDelay: active ? '0ms' : `${LEAVE_DELAY_MS}ms`
+    }),
+    transform: active ? [{
+      scale: ACTIVE_AVATAR_SCALE
+    }, {
+      translateX: activeAvatarTranslateX
+    }] : [{
+      scale: 1
+    }, {
+      translateX: 0
+    }]
+  } : undefined;
+  const identityStyle = isWeb ? {
+    marginLeft: -resolvedAvatarSize / 2,
+    opacity: active ? 1 : 0,
+    transitionProperty: 'opacity',
+    transitionDuration: `${OPACITY_TRANSITION_MS}ms`,
+    transitionDelay: active ? '0ms' : `${LEAVE_DELAY_MS}ms`
+  } : undefined;
+  const chevronStyle = isWeb ? {
+    opacity: active ? 1 : 0,
+    transitionProperty: 'opacity',
+    transitionDuration: `${OPACITY_TRANSITION_MS}ms`,
+    transitionDelay: active ? '0ms' : `${LEAVE_DELAY_MS}ms`
+  } : undefined;
+  return /*#__PURE__*/_jsx(View, {
+    className: className,
+    style: [styles.fullWidth, style],
+    children: /*#__PURE__*/_jsxs(Pressable, {
+      style: [styles.row, styles.rowExpanded, rowStyle],
+      onPress: openDialog,
+      accessibilityRole: "button",
+      accessibilityLabel: accountLabel,
+      ...webInteractionProps,
+      children: [/*#__PURE__*/_jsx(View, {
+        style: avatarWrapperStyle,
+        children: avatarNode
+      }), /*#__PURE__*/_jsxs(View, {
+        style: [styles.identity, identityStyle],
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: [styles.displayName, {
+            color: colors.text
+          }],
+          numberOfLines: 1,
+          children: displayName
+        }), handleLine ? /*#__PURE__*/_jsx(Text, {
+          style: [styles.handle, {
+            color: colors.textSecondary
+          }],
+          numberOfLines: 1,
+          children: handleLine
+        }) : null]
+      }), /*#__PURE__*/_jsx(View, {
+        style: chevronStyle,
+        children: /*#__PURE__*/_jsx(MaterialCommunityIcons, {
+          name: "dots-horizontal",
+          size: 18,
+          color: colors.textSecondary
+        })
+      })]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  fullWidth: {
+    width: '100%'
+  },
+  // Shared trigger row (`flex-row items-center gap-3 rounded-full px-2 py-2`).
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 12,
+    borderRadius: 9999,
+    paddingHorizontal: 8,
+    paddingVertical: 8
+  },
+  // `w-full` on the expanded row + its signed-out variant.
+  rowExpanded: {
+    width: '100%'
+  },
+  // Signed-out login badge (`items-center justify-center rounded-full`).
+  avatarBadge: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: 9999
+  },
+  // Signed-out label (`flex-1 font-semibold`).
+  signInLabel: {
+    flex: 1,
+    fontWeight: '600'
+  },
+  // Collapsed avatar-only trigger (`rounded-full`).
+  collapsedTrigger: {
+    borderRadius: 9999
+  },
+  // Identity block (`min-w-0 flex-1`).
+  identity: {
+    flex: 1,
+    minWidth: 0
+  },
+  // Display name (`font-bold`).
+  displayName: {
+    fontWeight: '700'
+  },
+  // Handle line (`text-xs`).
+  handle: {
+    fontSize: 12
+  }
+});
+export default ProfileButton;
+//# sourceMappingURL=ProfileButton.js.map

package/lib/module/ui/components/ProfileButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useEffect","useMemo","useState","View","Pressable","StyleSheet","Platform","MaterialCommunityIcons","Avatar","Skeleton","Text","useTheme","getAccountDisplayName","getAccountFallbackHandle","useAuth","useOxy","useI18n","registerAccountDialogConsumerHooks","jsx","_jsx","jsxs","_jsxs","isWeb","OS","BG_TRANSITION_MS","AVATAR_TRANSITION_MS","OPACITY_TRANSITION_MS","LEAVE_DELAY_MS","ACTIVE_AVATAR_SCALE","prefersReducedMotion","window","matchMedia","matches","ProfileButton","expanded","avatarSize","onNavigateManage","onAddAccount","onNavigateProfile","className","style","user","isAuthenticated","isAuthResolved","isPrivateApiPending","signIn","openAccountDialog","oxyServices","colors","t","locale","hovered","setHovered","focused","setFocused","resolvedAvatarSize","openDialog","undefined","avatarUrl","avatar","getFileDownloadUrl","accessibilityElementsHidden","importantForAccessibility","children","Circle","size","signInLabel","styles","row","rowExpanded","onPress","accessibilityRole","accessibilityLabel","avatarBadge","width","height","backgroundColor","backgroundSecondary","name","Math","round","color","icon","text","numberOfLines","displayName","handle","handleLine","avatarNode","source","variant","active","accountLabel","webInteractionProps","onHoverIn","onHoverOut","onFocus","onBlur","collapsedBgStyle","transitionProperty","transitionDuration","transitionDelay","collapsedTrigger","reducedMotion","activeAvatarTranslateX","rowStyle","avatarWrapperStyle","zIndex","transform","scale","translateX","identityStyle","marginLeft","opacity","chevronStyle","fullWidth","identity","textSecondary","create","flexDirection","alignItems","gap","borderRadius","paddingHorizontal","paddingVertical","justifyContent","flex","fontWeight","minWidth","fontSize"],"sourceRoot":"../../../../src","sources":["ui/components/ProfileButton.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/ui/components/ProfileSummaryCard.js

@@ -0,0 +1,74 @@
+"use strict";
+
+import { View } from 'react-native';
+import { H4, Text } from '@oxyhq/bloom/typography';
+import { Avatar } from '@oxyhq/bloom/avatar';
+import { Card } from '@oxyhq/bloom/card';
+import { PressableScale } from '@oxyhq/bloom/pressable-scale';
+import AvatarCameraBadge from "./AvatarCameraBadge.js";
+
+/**
+ * ProfileSummaryCard — the shared "who am I" summary block rendered at the top
+ * of {@link ManageAccountScreen} and {@link EditProfileScreen}.
+ *
+ * A Bloom filled {@link Card} containing a centered {@link Avatar}, the display
+ * name and any number of secondary lines (handle, email, …). When
+ * `onAvatarPress` is supplied the avatar becomes a {@link PressableScale} entry
+ * point (used to open the avatar picker) and can render an optional camera
+ * badge overlay.
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const cardStyle = {
+  borderRadius: 20,
+  marginBottom: 16
+};
+const pressableStyle = {
+  position: 'relative'
+};
+const ProfileSummaryCard = ({
+  displayName,
+  avatarUri,
+  avatarSize = 72,
+  lines,
+  onAvatarPress,
+  showCameraBadge = false,
+  avatarAccessibilityLabel
+}) => {
+  const avatar = /*#__PURE__*/_jsx(Avatar, {
+    source: avatarUri,
+    name: displayName,
+    size: avatarSize
+  });
+  const avatarNode = onAvatarPress ? /*#__PURE__*/_jsxs(PressableScale, {
+    onPress: onAvatarPress,
+    accessibilityRole: "button",
+    accessibilityLabel: avatarAccessibilityLabel,
+    style: pressableStyle,
+    className: "mb-space-12",
+    children: [avatar, showCameraBadge ? /*#__PURE__*/_jsx(AvatarCameraBadge, {}) : null]
+  }) : /*#__PURE__*/_jsx(View, {
+    className: "mb-space-12",
+    children: avatar
+  });
+  const subtitleLines = (lines ?? []).filter(line => typeof line === 'string' && line.length > 0);
+  return /*#__PURE__*/_jsx(Card, {
+    variant: "filled",
+    style: cardStyle,
+    children: /*#__PURE__*/_jsxs(View, {
+      className: "items-center px-space-20 py-space-24",
+      children: [avatarNode, /*#__PURE__*/_jsx(H4, {
+        className: "text-text",
+        numberOfLines: 1,
+        children: displayName
+      }), subtitleLines.map((line, index) => /*#__PURE__*/_jsx(Text
+      // Subtitle order is stable within a render; index keys are safe here.
+      , {
+        className: "text-text-secondary text-sm mt-space-2",
+        numberOfLines: 1,
+        children: line
+      }, `${index}-${line}`))]
+    })
+  });
+};
+export default ProfileSummaryCard;
+//# sourceMappingURL=ProfileSummaryCard.js.map

package/lib/module/ui/components/ProfileSummaryCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","H4","Text","Avatar","Card","PressableScale","AvatarCameraBadge","jsx","_jsx","jsxs","_jsxs","cardStyle","borderRadius","marginBottom","pressableStyle","position","ProfileSummaryCard","displayName","avatarUri","avatarSize","lines","onAvatarPress","showCameraBadge","avatarAccessibilityLabel","avatar","source","name","size","avatarNode","onPress","accessibilityRole","accessibilityLabel","style","className","children","subtitleLines","filter","line","length","variant","numberOfLines","map","index"],"sourceRoot":"../../../../src","sources":["ui/components/ProfileSummaryCard.tsx"],"mappings":";;AACA,SAASA,IAAI,QAAwB,cAAc;AACnD,SAASC,EAAE,EAAEC,IAAI,QAAQ,yBAAyB;AAClD,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,IAAI,QAAQ,mBAAmB;AACxC,SAASC,cAAc,QAAQ,8BAA8B;AAC7D,OAAOC,iBAAiB,MAAM,wBAAqB;;AAEnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AA8BA,MAAMC,SAAoB,GAAG;EACzBC,YAAY,EAAE,EAAE;EAChBC,YAAY,EAAE;AAClB,CAAC;AAED,MAAMC,cAAyB,GAAG;EAC9BC,QAAQ,EAAE;AACd,CAAC;AAED,MAAMC,kBAAqD,GAAGA,CAAC;EAC3DC,WAAW;EACXC,SAAS;EACTC,UAAU,GAAG,EAAE;EACfC,KAAK;EACLC,aAAa;EACbC,eAAe,GAAG,KAAK;EACvBC;AACJ,CAAC,KAAK;EACF,MAAMC,MAAM,gBAAGhB,IAAA,CAACL,MAAM;IAACsB,MAAM,EAAEP,SAAU;IAACQ,IAAI,EAAET,WAAY;IAACU,IAAI,EAAER;EAAW,CAAE,CAAC;EAEjF,MAAMS,UAAU,GAAGP,aAAa,gBAC5BX,KAAA,CAACL,cAAc;IACXwB,OAAO,EAAER,aAAc;IACvBS,iBAAiB,EAAC,QAAQ;IAC1BC,kBAAkB,EAAER,wBAAyB;IAC7CS,KAAK,EAAElB,cAAe;IACtBmB,SAAS,EAAC,aAAa;IAAAC,QAAA,GAEtBV,MAAM,EACNF,eAAe,gBAAGd,IAAA,CAACF,iBAAiB,IAAE,CAAC,GAAG,IAAI;EAAA,CACnC,CAAC,gBAEjBE,IAAA,CAACR,IAAI;IAACiC,SAAS,EAAC,aAAa;IAAAC,QAAA,EAAEV;EAAM,CAAO,CAC/C;EAED,MAAMW,aAAa,GAAG,CAACf,KAAK,IAAI,EAAE,EAAEgB,MAAM,CACrCC,IAAI,IAAqB,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,CAACC,MAAM,GAAG,CACxE,CAAC;EAED,oBACI9B,IAAA,CAACJ,IAAI;IAACmC,OAAO,EAAC,QAAQ;IAACP,KAAK,EAAErB,SAAU;IAAAuB,QAAA,eACpCxB,KAAA,CAACV,IAAI;MAACiC,SAAS,EAAC,sCAAsC;MAAAC,QAAA,GACjDN,UAAU,eACXpB,IAAA,CAACP,EAAE;QAACgC,SAAS,EAAC,WAAW;QAACO,aAAa,EAAE,CAAE;QAAAN,QAAA,EACtCjB;MAAW,CACZ,CAAC,EACJkB,aAAa,CAACM,GAAG,CAAC,CAACJ,IAAI,EAAEK,KAAK,kBAC3BlC,IAAA,CAACN;MACG;MAAA;QAEA+B,SAAS,EAAC,wCAAwC;QAClDO,aAAa,EAAE,CAAE;QAAAN,QAAA,EAEhBG;MAAI,GAJA,GAAGK,KAAK,IAAIL,IAAI,EAKnB,CACT,CAAC;IAAA,CACA;EAAC,CACL,CAAC;AAEf,CAAC;AAED,eAAerB,kBAAkB","ignoreList":[]}