diff --git a/src/components/moderation/ContentHider.tsx b/src/components/moderation/ContentHider.tsx
index 2df243cbb7..1b4a4ef345 100644
--- a/src/components/moderation/ContentHider.tsx
+++ b/src/components/moderation/ContentHider.tsx
@@ -74,16 +74,17 @@ export function ContentHider({
a.w_full,
a.justify_start,
a.align_center,
- a.py_sm,
- a.px_md,
- a.gap_sm,
+ a.py_md,
+ a.pl_md,
+ a.pr_lg,
+ a.gap_xs,
a.rounded_sm,
t.atoms.bg_contrast_25,
- gtMobile && [a.py_md, a.px_lg],
+ gtMobile && [a.py_md, a.px_lg, a.gap_sm],
(state.hovered || state.pressed) && t.atoms.bg_contrast_50,
]}>
@@ -92,7 +93,6 @@ export function ContentHider({
a.flex_1,
a.text_left,
a.font_bold,
- a.italic,
a.leading_snug,
t.atoms.text_contrast_medium,
web({
@@ -126,7 +126,7 @@ export function ContentHider({
label={_(
msg`Learn more about the moderation applied to this content.`,
)}
- style={[a.pt_sm]}>
+ style={[a.pt_xs]}>
{state => (
- This post was labeled by {sanitizeDisplayName(desc.source!)}.{' '}
+ Labeled by {sanitizeDisplayName(desc.source!)}.{' '}
-
+
{labels.length}{' '}
{labels.length === 1 ? (
diff --git a/src/components/moderation/ModerationDetailsDialog.tsx b/src/components/moderation/ModerationDetailsDialog.tsx
index 95f54fb38b..2ce5d972de 100644
--- a/src/components/moderation/ModerationDetailsDialog.tsx
+++ b/src/components/moderation/ModerationDetailsDialog.tsx
@@ -6,13 +6,14 @@ import {ModerationCause} from '@atproto/api'
import {listUriToHref} from '#/lib/strings/url-helpers'
import {useModerationCauseDescription} from '#/lib/moderation/useModerationCauseDescription'
+import {makeProfileLink} from '#/lib/routes/links'
import {isNative} from '#/platform/detection'
import {useTheme, atoms as a} from '#/alf'
import {Text} from '#/components/Typography'
import * as Dialog from '#/components/Dialog'
import {InlineLink} from '#/components/Link'
-import {makeProfileLink} from '#/lib/routes/links'
+import {Divider} from '#/components/Divider'
export {useDialogControl as useModerationDetailsDialogControl} from '#/components/Dialog'
@@ -118,19 +119,21 @@ function ModerationDetailsDialogInner({
{modcause.type === 'label' && (
-
-
+ <>
+
+
This label was applied by{' '}
control.close()}>
+ onPress={() => control.close()}
+ style={a.text_md}>
{desc.source}
.
-
+ >
)}
{isNative && }
diff --git a/src/components/moderation/PostAlerts.tsx b/src/components/moderation/PostAlerts.tsx
index 44e6ca7e21..12841cfd01 100644
--- a/src/components/moderation/PostAlerts.tsx
+++ b/src/components/moderation/PostAlerts.tsx
@@ -4,11 +4,9 @@ import {ModerationUI, ModerationCause} from '@atproto/api'
import {useModerationCauseDescription} from '#/lib/moderation/useModerationCauseDescription'
import {getModerationCauseKey} from '#/lib/moderation'
-import {sanitizeDisplayName} from '#/lib/strings/display-names'
-import {atoms as a, useTheme} from '#/alf'
+import {atoms as a} from '#/alf'
import {Button, ButtonText, ButtonIcon} from '#/components/Button'
-import {Text} from '#/components/Typography'
import {
ModerationDetailsDialog,
useModerationDetailsDialogControl,
@@ -28,46 +26,19 @@ export function PostAlerts({
return (
- {modui.inform && (
-
- {modui.informs.map(cause => (
-
- ))}
-
- )}
- {modui.alerts.map(cause => (
-
- ))}
+
+ {modui.alerts.map(cause => (
+
+ ))}
+ {modui.informs.map(cause => (
+
+ ))}
+
)
}
-function PostInform({cause}: {cause: ModerationCause}) {
- const control = useModerationDetailsDialogControl()
- const desc = useModerationCauseDescription(cause)
-
- return (
- <>
-
-
-
- >
- )
-}
-
-function PostAlert({cause}: {cause: ModerationCause}) {
- const t = useTheme()
+function PostLabel({cause}: {cause: ModerationCause}) {
const control = useModerationDetailsDialogControl()
const desc = useModerationCauseDescription(cause)
@@ -81,16 +52,11 @@ function PostAlert({cause}: {cause: ModerationCause}) {
shape="default"
onPress={() => {
control.open()
- }}>
+ }}
+ style={[a.px_sm, a.py_xs, a.gap_xs]}>
-
+
{desc.name}
- {desc.source && (
-
- {' — '}
- {sanitizeDisplayName(desc.source)}
-
- )}
diff --git a/src/components/moderation/ProfileHeaderAlerts.tsx b/src/components/moderation/ProfileHeaderAlerts.tsx
index db4770e4a5..0e618b69aa 100644
--- a/src/components/moderation/ProfileHeaderAlerts.tsx
+++ b/src/components/moderation/ProfileHeaderAlerts.tsx
@@ -2,13 +2,11 @@ import React from 'react'
import {StyleProp, View, ViewStyle} from 'react-native'
import {ModerationCause, ModerationDecision} from '@atproto/api'
-import {sanitizeDisplayName} from '#/lib/strings/display-names'
import {getModerationCauseKey} from 'lib/moderation'
import {useModerationCauseDescription} from '#/lib/moderation/useModerationCauseDescription'
-import {atoms as a, useTheme} from '#/alf'
+import {atoms as a} from '#/alf'
import {Button, ButtonText, ButtonIcon} from '#/components/Button'
-import {Text} from '#/components/Typography'
import {
ModerationDetailsDialog,
useModerationDetailsDialogControl,
@@ -28,46 +26,19 @@ export function ProfileHeaderAlerts({
return (
- {modui.inform && (
-
- {modui.informs.map(cause => (
-
- ))}
-
- )}
- {modui.alerts.map(cause => (
-
- ))}
+
+ {modui.alerts.map(cause => (
+
+ ))}
+ {modui.informs.map(cause => (
+
+ ))}
+
)
}
-function ProfileInform({cause}: {cause: ModerationCause}) {
- const control = useModerationDetailsDialogControl()
- const desc = useModerationCauseDescription(cause)
-
- return (
- <>
-
-
-
- >
- )
-}
-
-function ProfileAlert({cause}: {cause: ModerationCause}) {
- const t = useTheme()
+function ProfileLabel({cause}: {cause: ModerationCause}) {
const control = useModerationDetailsDialogControl()
const desc = useModerationCauseDescription(cause)
@@ -81,18 +52,14 @@ function ProfileAlert({cause}: {cause: ModerationCause}) {
shape="default"
onPress={() => {
control.open()
- }}>
+ }}
+ style={[a.px_sm, a.py_xs, a.gap_xs]}>
-
+
{desc.name}
- {desc.source && (
-
- {' — '}
- {sanitizeDisplayName(desc.source)}
-
- )}
+
>
)
diff --git a/src/lib/moderation/useModerationCauseDescription.ts b/src/lib/moderation/useModerationCauseDescription.ts
index f8f94577d3..35ad8349f8 100644
--- a/src/lib/moderation/useModerationCauseDescription.ts
+++ b/src/lib/moderation/useModerationCauseDescription.ts
@@ -102,7 +102,7 @@ export function useModerationCauseDescription(
}
}
if (cause.type === 'label') {
- const def = getDefinition(labelDefs, cause.label)
+ const def = cause.labelDef || getDefinition(labelDefs, cause.label)
const strings = getLabelStrings(i18n.locale, globalLabelStrings, def)
const labeler = labelers.find(l => l.creator.did === cause.label.src)
return {