diff --git a/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx b/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx index c9ed280e5..fa0ba4325 100644 --- a/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx +++ b/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx @@ -19,6 +19,8 @@ interface IReasonStep { account: ReducerAccount } +const RULES_HEIGHT = 385; + const ReasonStep = (_props: IReasonStep) => { const dispatch = useDispatch(); const intl = useIntl(); @@ -59,6 +61,16 @@ const ReasonStep = (_props: IReasonStep) => { dispatch(fetchRules()); }, []); + useEffect(() => { + if (rules.length > 0 && rulesListRef.current) { + const { clientHeight } = rulesListRef.current; + + if (clientHeight <= RULES_HEIGHT) { + setNearBottom(true); + } + } + }, [rules, rulesListRef.current]); + return ( {shouldRequireRule && ( @@ -69,12 +81,13 @@ const ReasonStep = (_props: IReasonStep) => {
{rules.map((rule, idx) => { - const isSelected = String(ruleId) === rule.id; + const isSelected = String(ruleId) === String(rule.id); return ( );