@oxyhq/services 30.0.0 → 30.1.0

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

@@ -0,0 +1,345 @@
+"use strict";
+
+/**
+ * `FollowTargetButton` — one button for everything an Oxy user can follow.
+ *
+ * Follows a TARGET of any registered kind: a person, a topic, a channel, a
+ * store, an artist. Nothing in this file branches on what the target is, which
+ * is the property that lets an application this package has never heard of use
+ * it without a release.
+ *
+ * ## Two controls, not one
+ *
+ * The main press does the obvious thing. The chevron beside it opens the
+ * choices that a single press cannot express — follow for a while, stop showing
+ * this here without giving it up everywhere — and those belong behind a
+ * disclosure precisely because they are not what most people want most of the
+ * time. Bloom's `DropdownMenu` is platform-forked inside Bloom, so this is one
+ * component and not a platform fork here.
+ *
+ * ## Verbs
+ *
+ * "Follow" is wrong for half the things in the ecosystem: you subscribe to a
+ * channel, you join a community, you watch a listing. The verb is a prop with a
+ * small vocabulary of defaults and a full override, rather than a lookup keyed
+ * on kind — a kind→verb table in this package would need a release every time
+ * an application invents a kind, which is exactly the coupling #809 removes.
+ *
+ * ## Relationship to the legacy `FollowButton`
+ *
+ * `FollowButton` follows a USER through the Mongo-backed social graph and
+ * remains the correct component for that until the user graph is migrated onto
+ * `/v2/follows`. When it is, that component is deleted and this one takes the
+ * name — not aliased, not deprecated in place.
+ */
+
+import { memo, useCallback, useMemo } from 'react';
+import { View } from 'react-native';
+import { Button } from '@oxyhq/bloom/button';
+import { ChevronBottom_Stroke2_Corner0_Rounded as ChevronDown } from '@oxyhq/bloom/icons';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@oxyhq/bloom/dropdown-menu';
+import { toast } from '@oxyhq/bloom/toast';
+import { useFollowTarget } from "../hooks/useFollowTarget.js";
+import { useFollowTargetStore } from "../stores/followTargetStore.js";
+
+/**
+ * The small vocabulary of verbs the ecosystem actually uses. An application
+ * whose verb is not here passes `labels` instead — the escape hatch exists so
+ * this union never has to grow to accommodate one product's wording.
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const VERB_LABELS = {
+  follow: {
+    idle: 'Follow',
+    active: 'Following',
+    pending: 'Requested',
+    disabled: 'Off here'
+  },
+  subscribe: {
+    idle: 'Subscribe',
+    active: 'Subscribed',
+    pending: 'Requested',
+    disabled: 'Off here'
+  },
+  join: {
+    idle: 'Join',
+    active: 'Joined',
+    pending: 'Requested',
+    disabled: 'Off here'
+  },
+  watch: {
+    idle: 'Watch',
+    active: 'Watching',
+    pending: 'Requested',
+    disabled: 'Off here'
+  }
+};
+
+/** A timed-follow choice offered in the menu. */
+
+const HOUR = 60 * 60;
+
+/**
+ * Defaults chosen for the cases a timed follow is actually for: a live event
+ * tonight, a story running this week. Not a general-purpose duration picker —
+ * an application that needs one passes its own.
+ */
+const DEFAULT_DURATIONS = [{
+  label: '24 hours',
+  seconds: 24 * HOUR
+}, {
+  label: '72 hours',
+  seconds: 72 * HOUR
+}, {
+  label: 'A week',
+  seconds: 7 * 24 * HOUR
+}];
+
+/**
+ * Whether an action leaves the target ACTIVE in this application.
+ *
+ * One table, read by both the primary button and the menu, because the same
+ * action reached from two controls once reported differently — and a rule
+ * living in two switch statements is a rule that drifts. `Record` rather than
+ * a function with a default, so a new action is a compile error instead of a
+ * silent `false`.
+ */
+export const FOLLOW_ACTION_LEAVES_ACTIVE = {
+  follow: true,
+  'follow-timed': true,
+  // Re-enabling here does not change the global follow — the user already had
+  // it — but it does change whether this application acts on it, which is what
+  // a mirror is asking about.
+  'enable-here': true,
+  'disable-here': false,
+  unfollow: false
+};
+
+/** One line in the disclosure menu. */
+
+/**
+ * Which choices exist, given the state.
+ *
+ * Pure and exported because this is the product decision, not a rendering
+ * detail: a timed follow is only offered before following, turning it off here
+ * is only offered while following, and NEITHER is offered before the server has
+ * answered — every one of them addresses a relationship that does not exist
+ * yet, so offering them mid-write would mean sending a guessed id.
+ */
+/**
+ * What the main button should do for the current state.
+ *
+ * Exported because the product rule is not obvious from the label alone: a
+ * follow switched off here still reads as "following" globally, so the primary
+ * press must re-enable here — not unfollow everywhere.
+ */
+export function resolveFollowPrimaryAction(input) {
+  if (!input.isFollowing) return 'follow';
+  if (input.applicationMode === 'disabled') return 'enable-here';
+  return 'unfollow';
+}
+export function buildFollowMenuItems(input) {
+  const items = [];
+  if (!input.following) {
+    if (input.durations === false) return items;
+    for (const d of input.durations) {
+      items.push({
+        key: `for-${d.seconds}`,
+        label: `${input.idleVerb} for ${d.label.toLowerCase()}`,
+        action: {
+          type: 'follow-timed',
+          seconds: d.seconds,
+          durationLabel: d.label
+        }
+      });
+    }
+    return items;
+  }
+  if (!input.hasRelationship || input.isPending) return items;
+  items.push(input.applicationMode === 'disabled' ? {
+    key: 'enable-here',
+    label: `Show in ${input.applicationName}`,
+    action: {
+      type: 'enable-here'
+    }
+  } : {
+    key: 'disable-here',
+    label: `Don’t show in ${input.applicationName}`,
+    action: {
+      type: 'disable-here'
+    }
+  });
+  items.push({
+    // Named for what it does. "Unfollow" beside "don't show here" would read as
+    // the same action twice, and the user would pick the wrong one.
+    key: 'unfollow-everywhere',
+    label: 'Unfollow everywhere',
+    action: {
+      type: 'unfollow'
+    }
+  });
+  return items;
+}
+export const FollowTargetButton = /*#__PURE__*/memo(function FollowTargetButton({
+  targetId,
+  verb = 'follow',
+  labels,
+  size = 'medium',
+  style,
+  disabled = false,
+  showOptions = true,
+  durations = DEFAULT_DURATIONS,
+  applicationName,
+  initialStatus,
+  onChange
+}) {
+  const {
+    status,
+    isFollowing,
+    isUnknown,
+    isPending,
+    follow,
+    unfollow,
+    disableHere,
+    enableHere
+  } = useFollowTarget(targetId, {
+    initialStatus
+  });
+  const reportMutationFailure = useCallback(() => {
+    const message = useFollowTargetStore.getState().errors[targetId] ?? 'Could not update follow status';
+    toast.error(message);
+  }, [targetId]);
+  const text = useMemo(() => ({
+    ...VERB_LABELS[verb],
+    ...labels
+  }), [verb, labels]);
+  const label = useMemo(() => {
+    if (status.globalState === 'requested') return text.pending;
+    if (!isFollowing) return text.idle;
+    // Followed globally but switched off here. `effectiveState` reports
+    // `not_following` for this, correctly — the question it answers is "does
+    // this act here" — so the label has to be derived from the other two.
+    return status.applicationMode === 'disabled' ? text.disabled : text.active;
+  }, [isFollowing, status.globalState, status.applicationMode, text]);
+
+  // `onChange` fires ONLY when the server accepted the write.
+  //
+  // The mutations never reject — a refusal becomes error state so the button
+  // can render it — so an unconditional `onChange` after `await` reports
+  // INTENT rather than outcome. A caller mirroring the follow somewhere else
+  // (a local shelf, a ranking signal) would then mirror failures too, and the
+  // button beside it would show the server's truth while the mirror showed a
+  // press that did not happen. Same shape of trap as reading `effectiveState`
+  // as "does the user follow this".
+  const handlePrimary = useCallback(async () => {
+    switch (resolveFollowPrimaryAction({
+      isFollowing,
+      applicationMode: status.applicationMode
+    })) {
+      case 'enable-here':
+        if (await enableHere()) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE['enable-here']);else reportMutationFailure();
+        return;
+      case 'unfollow':
+        if (await unfollow()) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE.unfollow);else reportMutationFailure();
+        return;
+      case 'follow':
+        if (await follow()) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE.follow);else reportMutationFailure();
+    }
+  }, [isFollowing, status.applicationMode, follow, unfollow, enableHere, onChange, reportMutationFailure]);
+  const handleTimed = useCallback(async (seconds, durationLabel) => {
+    if (!(await follow({
+      expiresIn: seconds
+    }))) {
+      reportMutationFailure();
+      return;
+    }
+    onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE['follow-timed']);
+    // The confirmation is the point: a follow that ends on its own is a
+    // promise, and a user who does not see it made will not believe it.
+    // Which is also why it must not appear when the promise was not made.
+    toast.success(`Following for ${durationLabel.toLowerCase()}`);
+  }, [follow, onChange, reportMutationFailure]);
+  const menuItems = useMemo(() => buildFollowMenuItems({
+    following: isFollowing,
+    applicationMode: status.applicationMode,
+    hasRelationship: Boolean(status.relationshipId),
+    isPending,
+    durations,
+    idleVerb: text.idle,
+    applicationName: applicationName ?? 'this app'
+  }), [isFollowing, status.applicationMode, status.relationshipId, isPending, durations, text.idle, applicationName]);
+  const runItem = useCallback(item => {
+    switch (item.action.type) {
+      case 'follow-timed':
+        void handleTimed(item.action.seconds, item.action.durationLabel);
+        return;
+      // Every branch reports through `onChange`, and they must agree with
+      // the primary button: the same action reached from two controls that
+      // reported differently was a real bug — a user picking "don't show
+      // here" kept the target on the app's own shelf, which is the state the
+      // menu item exists to end.
+      case 'enable-here':
+        void enableHere().then(ok => {
+          if (ok) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE['enable-here']);else reportMutationFailure();
+        });
+        return;
+      case 'disable-here':
+        void disableHere().then(ok => {
+          if (ok) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE['disable-here']);else reportMutationFailure();
+        });
+        return;
+      case 'unfollow':
+        void unfollow().then(ok => {
+          if (ok) onChange?.(FOLLOW_ACTION_LEAVES_ACTIVE.unfollow);else reportMutationFailure();
+        });
+    }
+  }, [handleTimed, enableHere, disableHere, unfollow, onChange, reportMutationFailure]);
+  const primary = /*#__PURE__*/_jsx(Button, {
+    variant: isFollowing ? 'secondary' : 'primary',
+    size: size
+    // Unknown is not "not following": the button stays inert until the first
+    // read settles rather than inviting a follow that may already exist.
+    ,
+    disabled: disabled || isUnknown,
+    loading: isPending,
+    onPress: () => void handlePrimary(),
+    accessibilityLabel: label,
+    children: label
+  });
+  if (!showOptions || menuItems.length === 0) {
+    return /*#__PURE__*/_jsx(View, {
+      style: style,
+      children: primary
+    });
+  }
+  return /*#__PURE__*/_jsxs(View, {
+    style: [{
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 4
+    }, style],
+    children: [primary, /*#__PURE__*/_jsxs(DropdownMenu, {
+      children: [/*#__PURE__*/_jsx(DropdownMenuTrigger, {
+        asChild: true,
+        disabled: disabled || isUnknown,
+        children: /*#__PURE__*/_jsx(Button, {
+          variant: "secondary",
+          size: size === 'large' ? 'large' : 'small',
+          icon: /*#__PURE__*/_jsx(ChevronDown, {
+            width: 16
+          }),
+          disabled: disabled || isUnknown,
+          accessibilityLabel: `${label} options`,
+          accessibilityHint: "Opens follow options"
+        })
+      }), /*#__PURE__*/_jsx(DropdownMenuContent, {
+        label: `${label} options`,
+        children: menuItems.map(item => /*#__PURE__*/_jsx(DropdownMenuItem, {
+          onPress: () => runItem(item),
+          children: item.label
+        }, item.key))
+      })]
+    })]
+  });
+});
+//# sourceMappingURL=FollowTargetButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["memo","useCallback","useMemo","View","Button","ChevronBottom_Stroke2_Corner0_Rounded","ChevronDown","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuTrigger","toast","useFollowTarget","useFollowTargetStore","jsx","_jsx","jsxs","_jsxs","VERB_LABELS","follow","idle","active","pending","disabled","subscribe","join","watch","HOUR","DEFAULT_DURATIONS","label","seconds","FOLLOW_ACTION_LEAVES_ACTIVE","unfollow","resolveFollowPrimaryAction","input","isFollowing","applicationMode","buildFollowMenuItems","items","following","durations","d","push","key","idleVerb","toLowerCase","action","type","durationLabel","hasRelationship","isPending","applicationName","FollowTargetButton","targetId","verb","labels","size","style","showOptions","initialStatus","onChange","status","isUnknown","disableHere","enableHere","reportMutationFailure","message","getState","errors","error","text","globalState","handlePrimary","handleTimed","expiresIn","success","menuItems","Boolean","relationshipId","runItem","item","then","ok","primary","variant","loading","onPress","accessibilityLabel","children","length","flexDirection","alignItems","gap","asChild","icon","width","accessibilityHint","map"],"sourceRoot":"../../../../src","sources":["ui/components/FollowTargetButton.tsx"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,173 @@
+"use strict";
+
+/**
+ * OxyAccountDialogScreen — the ONE unified account dialog BODY for `@oxyhq/services`.
+ *
+ * The header (title/subtitle per view + back button) around the headless chooser
+ * logic, which lives in `OxyAuthChooser` — the account switcher, sign-in,
+ * sign-up, and QR views are ALL there, extracted so the same chooser can be
+ * mounted bare by a future host with no Dialog chrome (e.g. an auth.oxy.so hub
+ * page driving the cross-origin passkey popup, b2). This file owns ONLY the
+ * header + the scroll body.
+ *
+ * It is presented as the `AccountDialog` route on the shared Bloom SURFACE STACK
+ * (`@oxyhq/bloom/surfaces`) — `OxyContext.openAccountDialog` calls
+ * `presentDetached('AccountDialog', …, { placement: { base: 'bottom', md:
+ * 'center' }, dismissOnBackdrop: false, maxWidth: 420 })`, so the STACK owns the
+ * responsive `<Dialog>` chrome and this component renders only its content. That
+ * replaces the previous standalone controlled `<Dialog open={isAccountDialogOpen}>`
+ * mount: dismissal now flows through the stack (backdrop/swipe disabled), and the
+ * header close button (and `OxyAuthChooser`'s `onComplete`) drive
+ * `useOxy().closeAccountDialog`, which dismisses the surface and runs its exit
+ * animation. The view-enum (`accounts|signin|qr|add|signup`) stays internal here,
+ * driven by the shared `AccountDialogController` in `@oxyhq/core`.
+ */
+
+import { useCallback, useSyncExternalStore } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useOxy } from "../context/OxyContext.js";
+import { useI18n } from "../hooks/useI18n.js";
+import { useSurfaceHeader } from "../hooks/useSurfaceHeader.js";
+import LogoText from "./logo/LogoText.js";
+import OxyAuthChooser from "./OxyAuthChooser.js";
+import { EMPTY_ACCOUNT_DIALOG_SNAPSHOT } from "../hooks/accountDialogSnapshot.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * The account MENU's nav bar carries the Oxy wordmark instead of a title — the
+ * surface IS the Oxy account, so naming it in prose is redundant. A module-level
+ * element: it takes no props, so its identity is stable forever and the header's
+ * identity-compared slot never thrashes.
+ */
+const NAV_LOGO = /*#__PURE__*/_jsx(LogoText, {
+  height: 20
+});
+
+/**
+ * The unified account dialog BODY — the header + `OxyAuthChooser` chooser.
+ *
+ * Presented as the `AccountDialog` surface (route) on the shared Bloom surface
+ * stack; the surface owns the `<Dialog>` chrome (responsive `{ base: 'bottom',
+ * md: 'center' }` placement, `dismissOnBackdrop={false}`, `maxWidth={420}` — set
+ * by `OxyContext` when it presents this surface), so this component renders ONLY
+ * the content. Open it via `useOxy().openAccountDialog(view?)` or the imperative
+ * `openAccountDialog('signin')`; the view-enum (`accounts|signin|qr|add|signup`)
+ * stays internal here, driven by the shared `AccountDialogController` in
+ * `@oxyhq/core`. Closing routes through `useOxy().closeAccountDialog`, which
+ * dismisses the surface and runs its exit animation.
+ */
+const OxyAccountDialogScreen = ({
+  canGoBack
+}) => {
+  const {
+    accountDialogController: controller,
+    closeAccountDialog
+  } = useOxy();
+  const {
+    t
+  } = useI18n();
+
+  // A lightweight, header-only binding to the same controller `OxyAuthChooser`
+  // binds independently — cheap, and the established pattern here (
+  // `useDeviceSwitcher` also binds to this controller on its own).
+  const subscribe = useCallback(listener => controller ? controller.subscribe(listener) : () => undefined, [controller]);
+  const getSnapshot = useCallback(() => controller ? controller.getSnapshot() : EMPTY_ACCOUNT_DIALOG_SNAPSHOT, [controller]);
+  const snapshot = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const {
+    view
+  } = snapshot;
+  // "Add another account" only makes sense as a back destination when there IS
+  // another — i.e. somebody is already signed in on this device.
+  const hasSignedInAccounts = (snapshot.directory?.principals.length ?? 0) > 0;
+  const showBack = view === 'qr' || view === 'signup' || view === 'add' && hasSignedInAccounts;
+  const goToAccounts = useCallback(() => {
+    if (!controller) return;
+    const {
+      view: currentView,
+      signIn
+    } = controller.getSnapshot();
+    // Backing out of an active request must withdraw it — otherwise the
+    // authorizeCode stays approvable until expiry (issue #691 phase 5).
+    if ((currentView === 'qr' || currentView === 'add') && (signIn.phase === 'starting' || signIn.phase === 'waiting')) {
+      controller.cancelSignIn();
+    }
+    controller.setView('accounts');
+  }, [controller]);
+  // An ENTRY view (accounts / signin — no in-dialog back of its own) that is
+  // MORPHED into a host surface (ManageAccount → switcher) has a frame beneath it,
+  // so its back CLOSES the dialog and reshapes back to the host — routed through
+  // `closeAccountDialog` so the pop + state teardown stay in one place. Opened
+  // cold (detached) it is the root frame → `canGoBack` is false → no back.
+  const backsToHost = !showBack && (canGoBack?.() ?? false);
+  // The account MENU is branded, not titled: its nav bar carries the Oxy
+  // wordmark and no large title. The current account is named by the HERO block
+  // `OxyAuthChooser` renders under it (email + large avatar + greeting), never
+  // by the bar. Every OTHER view keeps the SHARED Dialog nav header the rest of
+  // the SDK uses — a large in-content title/subtitle that collapses into the bar
+  // on scroll — because their copy is informative.
+  const copy = view === 'accounts' ? null : headerCopy(view, hasSignedInAccounts, t);
+  useSurfaceHeader({
+    titleContent: copy ? undefined : NAV_LOGO,
+    title: copy?.title,
+    subtitle: copy?.subtitle ?? undefined,
+    onBack: showBack ? goToAccounts : backsToHost ? closeAccountDialog : undefined
+  });
+  if (!controller) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.bodyContent,
+    children: /*#__PURE__*/_jsx(OxyAuthChooser, {
+      onComplete: closeAccountDialog
+    })
+  });
+};
+
+// ---------------------------------------------------------------------------
+// Copy + helpers
+// ---------------------------------------------------------------------------
+
+function headerCopy(view, hasSignedInAccounts, t) {
+  switch (view) {
+    // The ACTIVE REQUEST. Its header is deliberately route-AGNOSTIC: Oxy picks
+    // the delivery route (QR here, a push to the user's phone, or opening
+    // Commons on this device — issue #691), so naming one of them in the bar
+    // would contradict the other two. The route-specific status line lives in
+    // the body, derived from `signIn.progress`, and is the only thing that
+    // describes HOW the request is travelling.
+    case 'qr':
+      return {
+        title: t('accountSwitcher.signInWithOxy') || 'Sign in with Oxy',
+        subtitle: null
+      };
+    case 'signup':
+      return {
+        title: t('signup.title') || 'Create your account',
+        subtitle: t('signup.subtitle') || 'One identity for the whole ecosystem.'
+      };
+    default:
+      return hasSignedInAccounts ? {
+        title: t('signin.addAccountTitle') || 'Add another account',
+        subtitle: t('signin.addAccountSubtitle') || 'Sign in with another account.'
+      } : {
+        title: t('signin.title') || 'Sign in',
+        subtitle: t('signin.subtitle') || 'One identity for the whole ecosystem.'
+      };
+  }
+}
+
+/**
+ * The screen gutter. In the Dialog's nav-header mode the surface adds NO content
+ * padding of its own — the large title and each screen own theirs — so this must
+ * match Bloom's own large-title gutter (`screen-margin`, 20px) for the body to
+ * line up with the title above it.
+ */
+const SCREEN_MARGIN = 20;
+const styles = StyleSheet.create({
+  bodyContent: {
+    paddingTop: 4,
+    paddingBottom: 4,
+    paddingHorizontal: SCREEN_MARGIN
+  }
+});
+export default OxyAccountDialogScreen;
+//# sourceMappingURL=OxyAccountDialogScreen.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useSyncExternalStore","StyleSheet","View","useOxy","useI18n","useSurfaceHeader","LogoText","OxyAuthChooser","EMPTY_ACCOUNT_DIALOG_SNAPSHOT","jsx","_jsx","NAV_LOGO","height","OxyAccountDialogScreen","canGoBack","accountDialogController","controller","closeAccountDialog","t","subscribe","listener","undefined","getSnapshot","snapshot","view","hasSignedInAccounts","directory","principals","length","showBack","goToAccounts","currentView","signIn","phase","cancelSignIn","setView","backsToHost","copy","headerCopy","titleContent","title","subtitle","onBack","style","styles","bodyContent","children","onComplete","SCREEN_MARGIN","create","paddingTop","paddingBottom","paddingHorizontal"],"sourceRoot":"../../../../src","sources":["ui/components/OxyAccountDialogScreen.tsx"],"mappings":"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","ignoreList":[]}