Share menu (#7840)

* move post ctrls to #/components * restructure post controls, basic share menu * add border radius to searchable people list for android * Revert "add border radius to searchable people list for android" This reverts commit 417449086e25b82f5683b12f6405d972f48ce50e. * add copy link to native share menu * reorg files again * open native share menu on long press * Translation comments Thanks @surfdude29 * abs path * update type imports, remove forwardRef * rm react import * equal spacing of buttons, extract disco debug * add better icon * add right offset to share button for visual alignment * Add recent chats to share menu (#7853) * add recent chats to share menu * Update RecentChats.tsx Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com> * Update RecentChats.tsx * add fading edge on andriod * tweak scrollview * Add metrics and A/B alt icon to share menu (#8401) * add metrics * add a/b tested alt icon --------- Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com> * More descriptive share text/icon on web (#7854) * more descriptive share text on web * revert dev mode changes * add missing import * use modified share icon everywhere * Add back conflicting changes --------- Co-authored-by: Eric Bailey <git@esb.lol> --------- Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com> Co-authored-by: Eric Bailey <git@esb.lol>
2025-05-24 02:02:38 +03:00
parent 5aadb9e41b
commit c3f88e0a48
31 changed files with 1227 additions and 532 deletions
@@ -0,0 +1,107 @@
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {useRequireAuth} from '#/state/session'
+import {useSession} from '#/state/session'
+import {EventStopper} from '#/view/com/util/EventStopper'
+import {formatCount} from '#/view/com/util/numeric/format'
+import {useTheme} from '#/alf'
+import {CloseQuote_Stroke2_Corner1_Rounded as Quote} from '#/components/icons/Quote'
+import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost'
+import * as Menu from '#/components/Menu'
+import {
+  PostControlButton,
+  PostControlButtonIcon,
+  PostControlButtonText,
+} from './PostControlButton'
+
+interface Props {
+  isReposted: boolean
+  repostCount?: number
+  onRepost: () => void
+  onQuote: () => void
+  big?: boolean
+  embeddingDisabled: boolean
+}
+
+export const RepostButton = ({
+  isReposted,
+  repostCount,
+  onRepost,
+  onQuote,
+  big,
+  embeddingDisabled,
+}: Props) => {
+  const t = useTheme()
+  const {_, i18n} = useLingui()
+  const {hasSession} = useSession()
+  const requireAuth = useRequireAuth()
+
+  return hasSession ? (
+    <EventStopper onKeyDown={false}>
+      <Menu.Root>
+        <Menu.Trigger label={_(msg`Repost or quote post`)}>
+          {({props}) => {
+            return (
+              <PostControlButton
+                testID="repostBtn"
+                active={isReposted}
+                activeColor={t.palette.positive_600}
+                label={props.accessibilityLabel}
+                big={big}
+                {...props}>
+                <PostControlButtonIcon icon={Repost} />
+                {typeof repostCount !== 'undefined' && repostCount > 0 && (
+                  <PostControlButtonText testID="repostCount">
+                    {formatCount(i18n, repostCount)}
+                  </PostControlButtonText>
+                )}
+              </PostControlButton>
+            )
+          }}
+        </Menu.Trigger>
+        <Menu.Outer style={{minWidth: 170}}>
+          <Menu.Item
+            label={isReposted ? _(msg`Undo repost`) : _(msg`Repost`)}
+            testID="repostDropdownRepostBtn"
+            onPress={onRepost}>
+            <Menu.ItemText>
+              {isReposted ? _(msg`Undo repost`) : _(msg`Repost`)}
+            </Menu.ItemText>
+            <Menu.ItemIcon icon={Repost} position="right" />
+          </Menu.Item>
+          <Menu.Item
+            disabled={embeddingDisabled}
+            label={
+              embeddingDisabled
+                ? _(msg`Quote posts disabled`)
+                : _(msg`Quote post`)
+            }
+            testID="repostDropdownQuoteBtn"
+            onPress={onQuote}>
+            <Menu.ItemText>
+              {embeddingDisabled
+                ? _(msg`Quote posts disabled`)
+                : _(msg`Quote post`)}
+            </Menu.ItemText>
+            <Menu.ItemIcon icon={Quote} position="right" />
+          </Menu.Item>
+        </Menu.Outer>
+      </Menu.Root>
+    </EventStopper>
+  ) : (
+    <PostControlButton
+      onPress={() => requireAuth(() => {})}
+      active={isReposted}
+      activeColor={t.palette.positive_600}
+      label={_(msg`Repost or quote post`)}
+      big={big}>
+      <PostControlButtonIcon icon={Repost} />
+      {typeof repostCount !== 'undefined' && repostCount > 0 && (
+        <PostControlButtonText testID="repostCount">
+          {formatCount(i18n, repostCount)}
+        </PostControlButtonText>
+      )}
+    </PostControlButton>
+  )
+}