Fixes and improvements to the Profile Preview modal (#992)

* Fix: use more reliable navigation method

* Fix: show lightbox over the active modal

* Fix: close the profile preview on navigation

* Factor out UserPreviewLink and add preview behavior to notifications

* Fix postmeta overflow on web

* Fix lint

1 files changed, 43 insertions, 0 deletions

diff --git a/src/view/com/util/UserPreviewLink.tsx b/src/view/com/util/UserPreviewLink.tsx
new file mode 100644
index 000000000..ae49301fd
--- /dev/null
+++ b/src/view/com/util/UserPreviewLink.tsx
@@ -0,0 +1,43 @@
+import React from 'react'
+import {Pressable, StyleProp, ViewStyle} from 'react-native'
+import {useStores} from 'state/index'
+import {Link} from './Link'
+import {isDesktopWeb} from 'platform/detection'
+
+interface UserPreviewLinkProps {
+  did: string
+  handle: string
+  style?: StyleProp<ViewStyle>
+}
+export function UserPreviewLink(
+  props: React.PropsWithChildren<UserPreviewLinkProps>,
+) {
+  const store = useStores()
+
+  if (isDesktopWeb) {
+    return (
+      <Link
+        href={`/profile/${props.handle}`}
+        title={props.handle}
+        asAnchor
+        style={props.style}>
+        {props.children}
+      </Link>
+    )
+  }
+  return (
+    <Pressable
+      onPress={() =>
+        store.shell.openModal({
+          name: 'profile-preview',
+          did: props.did,
+        })
+      }
+      accessibilityRole="button"
+      accessibilityLabel={props.handle}
+      accessibilityHint=""
+      style={props.style}>
+      {props.children}
+    </Pressable>
+  )
+}