Merge upstream develop

Author: github-actions[bot]

.gitlab/ci/scan_dependencies.yml

@@ -1,7 +1,7 @@
 trivy:
   stage: check
   image:
-    name: aquasec/trivy:0.71.2
+    name: aquasec/trivy:0.72.0
     entrypoint: ['']
   rules:
     - if: $CI_PIPELINE_SOURCE == "merge_request_event"

apps/polycentric/src/common/components/HoverCard.tsx

@@ -5,16 +5,24 @@ import { isWeb } from '../util/platform';
 
 export function HoverCardContent({
   children,
+  animated = true,
   ...props
-}: HoverCardPrimitive.ContentProps) {
+}: HoverCardPrimitive.ContentProps & {
+  /** Animate the reveal (BounceIn). Set false for an instant, static card. */
+  animated?: boolean;
+}) {
   const content = (
     <HoverCardPrimitive.Content {...props}>
-      <Animated.View
-        entering={BounceIn.duration(450)}
-        exiting={FadeOut.duration(100)}
-      >
-        {children}
-      </Animated.View>
+      {animated ? (
+        <Animated.View
+          entering={BounceIn.duration(450)}
+          exiting={FadeOut.duration(100)}
+        >
+          {children}
+        </Animated.View>
+      ) : (
+        children
+      )}
     </HoverCardPrimitive.Content>
   );
 

apps/polycentric/src/common/components/Icon.tsx

@@ -24,6 +24,7 @@ export const IconsMap = {
   add: defineIcon(Ionicons, 'add'),
   addOutline: defineIcon(Ionicons, 'add-circle-outline'),
   arrowBack: defineIcon(Ionicons, 'arrow-back'),
+  at: defineIcon(Ionicons, 'at'),
   ban: defineIcon(Ionicons, 'ban'),
   bookOutline: defineIcon(MaterialCommunityIcons, 'book-open-outline'),
   briefcaseOutline: defineIcon(MaterialCommunityIcons, 'briefcase-outline'),
@@ -49,6 +50,8 @@ export const IconsMap = {
   home: defineIcon(Ionicons, 'home-outline'),
   image: defineIcon(Ionicons, 'image-outline'),
   images: defineIcon(Ionicons, 'images-outline'),
+  infoOutline: defineIcon(Ionicons, 'information-circle-outline'),
+  key: defineIcon(MaterialIcons, 'vpn-key'),
   more: defineIcon(Ionicons, 'ellipsis-horizontal'),
   notification: defineIcon(MaterialCommunityIcons, 'bell-outline'),
   personAdd: defineIcon(Ionicons, 'person-add'),

apps/polycentric/src/common/components/InfoTooltip.tsx

@@ -0,0 +1,122 @@
+import { useId, useRef, useState } from 'react';
+import { Dimensions, Pressable, View } from 'react-native';
+import { Portal } from '@rn-primitives/portal';
+import { Atoms, useTheme } from '@/src/common/theme';
+import { isWeb } from '@/src/common/util/platform';
+import Icon from './Icon';
+import { Text } from './primitives';
+
+const BUBBLE_WIDTH = 260;
+const EDGE_MARGIN = 8;
+
+/**
+ * A small information icon that reveals an explanatory bubble. Opens on hover
+ * (web) and on tap (native).
+ *
+ * NOTE: this deliberately does not use the shared HoverCard. HoverCard portals
+ * its content to the app-root host and positions it in absolute window
+ * coordinates — but this tooltip lives inside the edit-profile TrueSheet, whose
+ * content is offset from the window origin, so a portaled card would render
+ * either behind the sheet (root host) or mispositioned (sheet-local host).
+ * Instead: web portals out (to clear the sheet's `overflow: hidden`), native
+ * renders the bubble in place relative to the icon (within the sheet).
+ */
+export function InfoTooltip({
+  text,
+  size = 15,
+}: {
+  text: string;
+  size?: number;
+}) {
+  const { theme } = useTheme();
+  const portalName = `info-tooltip-${useId()}`;
+  const triggerRef = useRef<View>(null);
+  const [open, setOpen] = useState(false);
+  const [anchor, setAnchor] = useState({ x: 0, y: 0, h: 0 });
+
+  const show = () => {
+    if (isWeb && triggerRef.current) {
+      triggerRef.current.measureInWindow((x, y, _w, h) => {
+        setAnchor({ x, y, h });
+        setOpen(true);
+      });
+    } else {
+      setOpen(true);
+    }
+  };
+  const hide = () => setOpen(false);
+
+  const bubbleStyle = [
+    Atoms.p_sm,
+    {
+      width: BUBBLE_WIDTH,
+      maxWidth: BUBBLE_WIDTH,
+      borderRadius: 8,
+      borderWidth: 1,
+      borderColor: theme.palette.neutral_300,
+      backgroundColor: theme.palette.background_secondary,
+    },
+  ] as const;
+
+  const bubbleBody = (
+    <Text variant="small" color="neutral_900">
+      {text}
+    </Text>
+  );
+
+  return (
+    <View ref={triggerRef} collapsable={false} style={{ position: 'relative' }}>
+      <Pressable
+        onHoverIn={show}
+        onHoverOut={hide}
+        onPress={() => (open ? hide() : show())}
+        accessibilityRole="button"
+        accessibilityLabel="More information"
+        hitSlop={6}
+      >
+        <Icon name="infoOutline" size={size} color="neutral_500" />
+      </Pressable>
+
+      {open && isWeb ? (
+        <Portal name={portalName}>
+          <View
+            style={[
+              bubbleStyle,
+              {
+                position: 'fixed' as 'absolute',
+                top: anchor.y + anchor.h + 6,
+                left: Math.max(
+                  EDGE_MARGIN,
+                  Math.min(
+                    anchor.x,
+                    Dimensions.get('window').width - BUBBLE_WIDTH - EDGE_MARGIN,
+                  ),
+                ),
+                zIndex: 10000,
+              },
+            ]}
+          >
+            {bubbleBody}
+          </View>
+        </Portal>
+      ) : null}
+
+      {open && !isWeb ? (
+        <View
+          style={[
+            bubbleStyle,
+            {
+              position: 'absolute',
+              top: size + 6,
+              left: 0,
+              zIndex: 1000,
+              elevation: 8,
+            },
+          ]}
+        >
+          {bubbleBody}
+        </View>
+      ) : null}
+    </View>
+  );
+}

apps/polycentric/src/common/util/parseTextLinks.test.ts

@@ -12,6 +12,22 @@ const linkValues = (text: string) => links(text).map((l) => l.value);
 /** Resolved URLs of the link segments. */
 const linkUrls = (text: string) => links(text).map((l) => l.url);
 
+/** Just the alias segments. */
+const aliases = (text: string) =>
+  parseTextLinks(text).filter(
+    (s): s is Extract<TextSegment, { type: 'alias' }> => s.type === 'alias',
+  );
+
+/** Just the identity segments. */
+const identities = (text: string) =>
+  parseTextLinks(text).filter(
+    (s): s is Extract<TextSegment, { type: 'identity' }> =>
+      s.type === 'identity',
+  );
+
+const HEX64 =
+  '0a2abecb223dbd572729018f8d201f32471e2a5b71e2032c052f6830846c4722';
+
 describe('parseTextLinks', () => {
   describe('no links', () => {
     it('returns a single text segment for plain text', () => {
@@ -143,6 +159,90 @@ describe('parseTextLinks', () => {
     });
   });
 
+  describe('alias mentions', () => {
+    it('detects an `@user@domain.com` mention', () => {
+      expect(parseTextLinks('@user@domain.com')).toEqual([
+        { type: 'alias', value: '@user@domain.com', alias: 'user@domain.com' },
+      ]);
+    });
+
+    it('detects a mention within surrounding text', () => {
+      expect(parseTextLinks('hey @user@domain.com bye')).toEqual([
+        { type: 'text', value: 'hey ' },
+        { type: 'alias', value: '@user@domain.com', alias: 'user@domain.com' },
+        { type: 'text', value: ' bye' },
+      ]);
+    });
+
+    it('excludes trailing punctuation from the mention', () => {
+      expect(parseTextLinks('see @user@domain.com.')).toEqual([
+        { type: 'text', value: 'see ' },
+        { type: 'alias', value: '@user@domain.com', alias: 'user@domain.com' },
+        { type: 'text', value: '.' },
+      ]);
+    });
+
+    it('preserves case (normalisation happens downstream)', () => {
+      expect(aliases('@User@Domain.com')).toEqual([
+        { type: 'alias', value: '@User@Domain.com', alias: 'User@Domain.com' },
+      ]);
+    });
+
+    it('allows dotted/underscored local parts', () => {
+      expect(aliases('@first.last_1@domain.io')).toEqual([
+        {
+          type: 'alias',
+          value: '@first.last_1@domain.io',
+          alias: 'first.last_1@domain.io',
+        },
+      ]);
+    });
+
+    it('does not treat a plain email as a mention', () => {
+      expect(aliases('reach me@example.com please')).toEqual([]);
+    });
+
+    it('does not match `@user@` with no TLD', () => {
+      expect(aliases('@user@localhost here')).toEqual([]);
+    });
+  });
+
+  describe('identity mentions', () => {
+    it('detects an `@<64-hex>` mention', () => {
+      expect(parseTextLinks(`@${HEX64}`)).toEqual([
+        { type: 'identity', value: `@${HEX64}`, identity: HEX64 },
+      ]);
+    });
+
+    it('detects a mention within surrounding text', () => {
+      expect(parseTextLinks(`hi @${HEX64} ok`)).toEqual([
+        { type: 'text', value: 'hi ' },
+        { type: 'identity', value: `@${HEX64}`, identity: HEX64 },
+        { type: 'text', value: ' ok' },
+      ]);
+    });
+
+    it('excludes trailing punctuation from the mention', () => {
+      expect(parseTextLinks(`see @${HEX64}.`)).toEqual([
+        { type: 'text', value: 'see ' },
+        { type: 'identity', value: `@${HEX64}`, identity: HEX64 },
+        { type: 'text', value: '.' },
+      ]);
+    });
+
+    it('does not match fewer than 64 hex chars', () => {
+      expect(identities('@deadbeef here')).toEqual([]);
+    });
+
+    it('does not match a longer hex run (not exactly 64)', () => {
+      expect(identities(`@${HEX64}ab`)).toEqual([]);
+    });
+
+    it('does not match 64 non-hex chars', () => {
+      expect(identities(`@${'g'.repeat(64)} here`)).toEqual([]);
+    });
+  });
+
   describe('multiple links & surrounding text', () => {
     it('detects several links with text between them', () => {
       const segs = parseTextLinks(
@@ -185,6 +285,8 @@ describe('parseTextLinks', () => {
       'see https://example.com/path?x=1#y now',
       '(www.example.com), and example.org. done',
       'email a@b.com plus https://c.io end',
+      'hey @user@domain.com and a@b.com and example.net',
+      `mention @${HEX64} mid sentence`,
       'multi https://x.com www.y.org example.net z',
       '',
     ])('rejoining all segment values reproduces the input: %s', (input) => {

apps/polycentric/src/common/util/parseTextLinks.ts

@@ -1,19 +1,32 @@
 export type TextSegment =
   | { type: 'text'; value: string }
-  | { type: 'link'; value: string; url: string };
+  | { type: 'link'; value: string; url: string }
+  | { type: 'alias'; value: string; alias: string }
+  | { type: 'identity'; value: string; identity: string };
 
 // Common TLDs accepted for bare (scheme-less, non-www) domains. Keeping
 // this curated avoids turning things like "node.js" or "e.g." into links.
 const TLD =
   '(?:com|org|net|edu|gov|mil|io|dev|app|co|me|gg|xyz|info|biz|tv|news|social|link|so|ai|sh|to|fm|fyi|page|site|blog|uk|us|ca|de|fr|nl|eu|es|it|jp|au|in|br|ru|ch|se|no|pl)';
 
-// Matches, in order: http(s) URLs, `www.` domains, and bare domains that
-// end in a known TLD (optionally followed by a path/query).
+// A dotted hostname whose final label is a known TLD.
+const DOMAIN = `(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+${TLD}`;
+
+// A polycentric identity: exactly 64 hex chars (a SHA-256 hash). The lookahead
+// rejects a longer hex run rather than matching a 64-char prefix of it.
+const IDENTITY = '[0-9a-fA-F]{64}(?![0-9a-fA-F])';
+
+// Matches, in order: alias mentions (`@user@domain.tld`), identity mentions
+// (`@<64-hex>`), http(s) URLs, `www.` domains, and bare domains that end in a
+// known TLD (optionally followed by a path/query). Mention alternatives come
+// first so `@user@domain.com` is taken whole instead of the bare domain inside.
 const LINK_REGEX = new RegExp(
   [
+    `@[a-z0-9._-]+@${DOMAIN}`,
+    `@${IDENTITY}`,
     'https?:\\/\\/[^\\s]+',
     'www\\.[^\\s]+',
-    `(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+${TLD}(?:\\/[^\\s]*)?`,
+    `${DOMAIN}(?:\\/[^\\s]*)?`,
   ].join('|'),
   'gi',
 );
@@ -22,10 +35,11 @@ const LINK_REGEX = new RegExp(
 const TRAILING_PUNCT = /[.,!?;:'")\]}]+$/;
 
 /**
- * Splits `text` into plain-text and link segments. Detects http(s) URLs,
+ * Splits `text` into plain-text, link, and mention segments. Detects alias
+ * mentions (`@user@domain.com`), identity mentions (`@<64-hex>`), http(s) URLs,
  * `www.` domains, and bare domains with a known TLD. Trailing sentence
- * punctuation is excluded from links, and `@`-prefixed matches (e.g. the
- * domain part of an email) are left as plain text.
+ * punctuation is excluded, and a bare domain preceded by `@` (an email's domain
+ * part) is left as plain text.
  */
 export function parseTextLinks(text: string): TextSegment[] {
   const segments: TextSegment[] = [];
@@ -35,11 +49,12 @@ export function parseTextLinks(text: string): TextSegment[] {
   LINK_REGEX.lastIndex = 0;
   while ((match = LINK_REGEX.exec(text)) !== null) {
     const start = match.index;
+    let raw = match[0];
+    const isMention = raw[0] === '@';
 
-    // Skip emails (and other `@`-prefixed matches).
-    if (start > 0 && text[start - 1] === '@') continue;
+    // Skip an email's domain part; mentions start with `@` themselves.
+    if (!isMention && start > 0 && text[start - 1] === '@') continue;
 
-    let raw = match[0];
     const trail = raw.match(TRAILING_PUNCT)?.[0] ?? '';
     if (trail) raw = raw.slice(0, raw.length - trail.length);
     if (!raw) continue;
@@ -48,10 +63,21 @@ export function parseTextLinks(text: string): TextSegment[] {
       segments.push({ type: 'text', value: text.slice(lastIndex, start) });
     }
 
-    const url = /^https?:\/\//i.test(raw) ? raw : `https://${raw}`;
-    segments.push({ type: 'link', value: raw, url });
+    if (isMention) {
+      // Drop the leading `@` for routing; keep it in `value` for display. A
+      // second `@` distinguishes an alias (`@user@domain`) from an identity.
+      const body = raw.slice(1);
+      if (body.includes('@')) {
+        segments.push({ type: 'alias', value: raw, alias: body });
+      } else {
+        segments.push({ type: 'identity', value: raw, identity: body });
+      }
+    } else {
+      const url = /^https?:\/\//i.test(raw) ? raw : `https://${raw}`;
+      segments.push({ type: 'link', value: raw, url });
+    }
 
-    // Resume scanning after the link, leaving any trailing punctuation
+    // Resume scanning after the match, leaving any trailing punctuation
     // to be picked up as plain text.
     lastIndex = start + raw.length;
     LINK_REGEX.lastIndex = lastIndex;