From fccb74f7c6e45b09147cecea442f40b396f512ec Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Wed, 29 Oct 2025 10:50:32 -0500 Subject: [PATCH] Add internal debug field display --- package.json | 2 +- src/components/DebugFieldDisplay.tsx | 74 +++++++++++++++++++ .../components/ThreadItemAnchor.tsx | 2 + .../PostThread/components/ThreadItemPost.tsx | 2 + .../components/ThreadItemTreePost.tsx | 2 + .../Profile/Header/ProfileHeaderStandard.tsx | 3 + yarn.lock | 14 ++++ 7 files changed, 98 insertions(+), 1 deletion(-) create mode 100644 src/components/DebugFieldDisplay.tsx diff --git a/package.json b/package.json index fee99e5c78..c9dcc52ca4 100644 --- a/package.json +++ b/package.json @@ -72,7 +72,7 @@ "icons:optimize": "svgo -f ./assets/icons" }, "dependencies": { - "@atproto/api": "^0.17.1", + "@atproto/api": "^0.17.6", "@bitdrift/react-native": "^0.6.8", "@braintree/sanitize-url": "^6.0.2", "@bsky.app/alf": "^0.1.5", diff --git a/src/components/DebugFieldDisplay.tsx b/src/components/DebugFieldDisplay.tsx new file mode 100644 index 0000000000..c0dfc15347 --- /dev/null +++ b/src/components/DebugFieldDisplay.tsx @@ -0,0 +1,74 @@ +import {TouchableWithoutFeedback, View} from 'react-native' +import * as Clipboard from 'expo-clipboard' + +import {atoms as a, useTheme} from '#/alf' +import * as Prompt from '#/components/Prompt' +import * as Toast from '#/components/Toast' +import {Text} from '#/components/Typography' +import {useDevMode} from '#/storage/hooks/dev-mode' + +/** + * Internal-use component to display debug information supplied by the appview. + * The `debug` field only exists on some API views, and is only visible for + * internal users in dev mode. As such, none of these strings need to be + * translated. + * + * This component can be removed at any time if we don't find it useful. + */ +export function DebugFieldDisplay({ + subject, +}: { + subject: T +}) { + const t = useTheme() + const [devMode] = useDevMode() + const prompt = Prompt.usePromptControl() + + if (!devMode) return + if (!subject.debug) return + + return ( + <> + { + Clipboard.setStringAsync(JSON.stringify(subject.debug, null, 2)) + Toast.show('Copied to clipboard', {type: 'success'}) + }} + /> + { + e.preventDefault() + e.stopPropagation() + prompt.open() + return false + }}> + + + + Debug + + + + {JSON.stringify(subject.debug)} + + + + + ) +} diff --git a/src/screens/PostThread/components/ThreadItemAnchor.tsx b/src/screens/PostThread/components/ThreadItemAnchor.tsx index e14f170a6a..aca8591e9c 100644 --- a/src/screens/PostThread/components/ThreadItemAnchor.tsx +++ b/src/screens/PostThread/components/ThreadItemAnchor.tsx @@ -42,6 +42,7 @@ import { import {atoms as a, useTheme} from '#/alf' import {colors} from '#/components/Admonition' import {Button} from '#/components/Button' +import {DebugFieldDisplay} from '#/components/DebugFieldDisplay' import {CalendarClock_Stroke2_Corner0_Rounded as CalendarClockIcon} from '#/components/icons/CalendarClock' import {Trash_Stroke2_Corner0_Rounded as TrashIcon} from '#/components/icons/Trash' import {InlineLinkText, Link} from '#/components/Link' @@ -512,6 +513,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ /> + diff --git a/src/screens/PostThread/components/ThreadItemPost.tsx b/src/screens/PostThread/components/ThreadItemPost.tsx index fcdd0c1194..7e336b14a2 100644 --- a/src/screens/PostThread/components/ThreadItemPost.tsx +++ b/src/screens/PostThread/components/ThreadItemPost.tsx @@ -30,6 +30,7 @@ import { REPLY_LINE_WIDTH, } from '#/screens/PostThread/const' import {atoms as a, useTheme} from '#/alf' +import {DebugFieldDisplay} from '#/components/DebugFieldDisplay' import {useInteractionState} from '#/components/hooks/useInteractionState' import {Trash_Stroke2_Corner0_Rounded as TrashIcon} from '#/components/icons/Trash' import {LabelsOnMyPost} from '#/components/moderation/LabelsOnMe' @@ -335,6 +336,7 @@ const ThreadItemPostInner = memo(function ThreadItemPostInner({ logContext="PostThreadItem" threadgateRecord={threadgateRecord} /> + diff --git a/src/screens/PostThread/components/ThreadItemTreePost.tsx b/src/screens/PostThread/components/ThreadItemTreePost.tsx index ed080d0a65..33bbe7fe74 100644 --- a/src/screens/PostThread/components/ThreadItemTreePost.tsx +++ b/src/screens/PostThread/components/ThreadItemTreePost.tsx @@ -29,6 +29,7 @@ import { TREE_INDENT, } from '#/screens/PostThread/const' import {atoms as a, useTheme} from '#/alf' +import {DebugFieldDisplay} from '#/components/DebugFieldDisplay' import {useInteractionState} from '#/components/hooks/useInteractionState' import {Trash_Stroke2_Corner0_Rounded as TrashIcon} from '#/components/icons/Trash' import {LabelsOnMyPost} from '#/components/moderation/LabelsOnMe' @@ -376,6 +377,7 @@ const ThreadItemTreePostInner = memo(function ThreadItemTreePostInner({ logContext="PostThreadItem" threadgateRecord={threadgateRecord} /> + diff --git a/src/screens/Profile/Header/ProfileHeaderStandard.tsx b/src/screens/Profile/Header/ProfileHeaderStandard.tsx index 269bd38b9b..66a2352fa2 100644 --- a/src/screens/Profile/Header/ProfileHeaderStandard.tsx +++ b/src/screens/Profile/Header/ProfileHeaderStandard.tsx @@ -26,6 +26,7 @@ import * as Toast from '#/view/com/util/Toast' import {atoms as a, platform, useBreakpoints, useTheme} from '#/alf' import {SubscribeProfileButton} from '#/components/activity-notifications/SubscribeProfileButton' import {Button, ButtonIcon, ButtonText} from '#/components/Button' +import {DebugFieldDisplay} from '#/components/DebugFieldDisplay' import {useDialogControl} from '#/components/Dialog' import {MessageProfileButton} from '#/components/dms/MessageProfileButton' import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus' @@ -320,6 +321,8 @@ let ProfileHeaderStandard = ({ )} )} + +