environments/review-chats-g56n7m/deployments/1191
Chewbacca
2 years ago
commit
c9424cda76
@ -1,19 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import { fireEvent, render, screen } from '../../../jest/test-helpers';
|
||||
import ModerationOverlay from '../moderation-overlay';
|
||||
|
||||
describe('<ModerationOverlay />', () => {
|
||||
it('defaults to enabled', () => {
|
||||
render(<ModerationOverlay />);
|
||||
expect(screen.getByTestId('moderation-overlay')).toHaveTextContent('Content Under Review');
|
||||
});
|
||||
|
||||
it('can be toggled', () => {
|
||||
render(<ModerationOverlay />);
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('moderation-overlay')).not.toHaveTextContent('Content Under Review');
|
||||
expect(screen.getByTestId('moderation-overlay')).toHaveTextContent('Hide');
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,111 @@
|
||||
import { Map as ImmutableMap } from 'immutable';
|
||||
import React from 'react';
|
||||
|
||||
import { normalizeStatus } from 'soapbox/normalizers';
|
||||
import { ReducerStatus } from 'soapbox/reducers/statuses';
|
||||
|
||||
import { fireEvent, render, rootState, screen } from '../../../jest/test-helpers';
|
||||
import SensitiveContentOverlay from '../sensitive-content-overlay';
|
||||
|
||||
describe('<SensitiveContentOverlay />', () => {
|
||||
let status: ReducerStatus;
|
||||
|
||||
describe('when the Status is marked as sensitive', () => {
|
||||
beforeEach(() => {
|
||||
status = normalizeStatus({ sensitive: true }) as ReducerStatus;
|
||||
});
|
||||
|
||||
it('displays the "Sensitive content" warning', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Sensitive content');
|
||||
});
|
||||
|
||||
it('can be toggled', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Sensitive content');
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Sensitive content');
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Hide');
|
||||
});
|
||||
});
|
||||
|
||||
describe('when the Status is marked as in review', () => {
|
||||
beforeEach(() => {
|
||||
status = normalizeStatus({ visibility: 'self', sensitive: false }) as ReducerStatus;
|
||||
});
|
||||
|
||||
it('displays the "Under review" warning', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
|
||||
});
|
||||
|
||||
it('can be toggled', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Content Under Review');
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Hide');
|
||||
});
|
||||
});
|
||||
|
||||
describe('when the Status is marked as in review and sensitive', () => {
|
||||
beforeEach(() => {
|
||||
status = normalizeStatus({ visibility: 'self', sensitive: true }) as ReducerStatus;
|
||||
});
|
||||
|
||||
it('displays the "Under review" warning', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
|
||||
});
|
||||
|
||||
it('can be toggled', () => {
|
||||
render(<SensitiveContentOverlay status={status} />);
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Content Under Review');
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Content Under Review');
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Hide');
|
||||
});
|
||||
});
|
||||
|
||||
describe('when the Status is marked as sensitive and displayMedia set to "show_all"', () => {
|
||||
let store: any;
|
||||
|
||||
beforeEach(() => {
|
||||
status = normalizeStatus({ sensitive: true }) as ReducerStatus;
|
||||
store = rootState
|
||||
.set('settings', ImmutableMap({
|
||||
displayMedia: 'show_all',
|
||||
}));
|
||||
});
|
||||
|
||||
it('displays the "Under review" warning', () => {
|
||||
render(<SensitiveContentOverlay status={status} />, undefined, store);
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Sensitive content');
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
|
||||
});
|
||||
|
||||
it('can be toggled', () => {
|
||||
render(<SensitiveContentOverlay status={status} />, undefined, store);
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Sensitive content');
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Hide');
|
||||
|
||||
fireEvent.click(screen.getByTestId('button'));
|
||||
expect(screen.getByTestId('sensitive-overlay')).not.toHaveTextContent('Sensitive content');
|
||||
expect(screen.getByTestId('sensitive-overlay')).toHaveTextContent('Hide');
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -1,93 +0,0 @@
|
||||
import classNames from 'clsx';
|
||||
import React, { useState } from 'react';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
|
||||
import { useSoapboxConfig } from 'soapbox/hooks';
|
||||
|
||||
import { Button, HStack, Text } from '../ui';
|
||||
|
||||
const messages = defineMessages({
|
||||
hide: { id: 'moderation_overlay.hide', defaultMessage: 'Hide' },
|
||||
title: { id: 'moderation_overlay.title', defaultMessage: 'Content Under Review' },
|
||||
subtitle: { id: 'moderation_overlay.subtitle', defaultMessage: 'This Post has been sent to Moderation for review and is only visible to you. If you believe this is an error please contact Support.' },
|
||||
contact: { id: 'moderation_overlay.contact', defaultMessage: 'Contact' },
|
||||
show: { id: 'moderation_overlay.show', defaultMessage: 'Show Content' },
|
||||
});
|
||||
|
||||
const ModerationOverlay = () => {
|
||||
const intl = useIntl();
|
||||
|
||||
const { links } = useSoapboxConfig();
|
||||
|
||||
const [visible, setVisible] = useState<boolean>(false);
|
||||
|
||||
const toggleVisibility = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
event.stopPropagation();
|
||||
|
||||
setVisible((prevValue) => !prevValue);
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
className={classNames('absolute z-40', {
|
||||
'cursor-default backdrop-blur-lg rounded-lg w-full h-full border-0 flex justify-center items-center': !visible,
|
||||
'bg-gray-800/75 inset-0': !visible,
|
||||
'top-1 left-1': visible,
|
||||
})}
|
||||
data-testid='moderation-overlay'
|
||||
>
|
||||
{visible ? (
|
||||
<Button
|
||||
text={intl.formatMessage(messages.hide)}
|
||||
icon={require('@tabler/icons/eye-off.svg')}
|
||||
onClick={toggleVisibility}
|
||||
theme='transparent'
|
||||
size='sm'
|
||||
/>
|
||||
) : (
|
||||
<div className='text-center w-3/4 mx-auto space-y-4'>
|
||||
<div className='space-y-1'>
|
||||
<Text theme='white' weight='semibold'>
|
||||
{intl.formatMessage(messages.title)}
|
||||
</Text>
|
||||
|
||||
<Text theme='white' size='sm' weight='medium'>
|
||||
{intl.formatMessage(messages.subtitle)}
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
<HStack alignItems='center' justifyContent='center' space={2}>
|
||||
{links.get('support') && (
|
||||
<a
|
||||
href={links.get('support')}
|
||||
target='_blank'
|
||||
onClick={(event) => event.stopPropagation()}
|
||||
>
|
||||
<Button
|
||||
type='button'
|
||||
theme='outline'
|
||||
size='sm'
|
||||
icon={require('@tabler/icons/headset.svg')}
|
||||
>
|
||||
{intl.formatMessage(messages.contact)}
|
||||
</Button>
|
||||
</a>
|
||||
)}
|
||||
|
||||
<Button
|
||||
type='button'
|
||||
theme='outline'
|
||||
size='sm'
|
||||
icon={require('@tabler/icons/eye.svg')}
|
||||
onClick={toggleVisibility}
|
||||
>
|
||||
{intl.formatMessage(messages.show)}
|
||||
</Button>
|
||||
</HStack>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ModerationOverlay;
|
||||
@ -0,0 +1,124 @@
|
||||
import classNames from 'clsx';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
|
||||
import { useSettings, useSoapboxConfig } from 'soapbox/hooks';
|
||||
import { defaultMediaVisibility } from 'soapbox/utils/status';
|
||||
|
||||
import { Button, HStack, Text } from '../ui';
|
||||
|
||||
import type { Status as StatusEntity } from 'soapbox/types/entities';
|
||||
|
||||
const messages = defineMessages({
|
||||
hide: { id: 'moderation_overlay.hide', defaultMessage: 'Hide content' },
|
||||
sensitiveTitle: { id: 'status.sensitive_warning', defaultMessage: 'Sensitive content' },
|
||||
underReviewTitle: { id: 'moderation_overlay.title', defaultMessage: 'Content Under Review' },
|
||||
underReviewSubtitle: { id: 'moderation_overlay.subtitle', defaultMessage: 'This Post has been sent to Moderation for review and is only visible to you. If you believe this is an error please contact Support.' },
|
||||
sensitiveSubtitle: { id: 'status.sensitive_warning.subtitle', defaultMessage: 'This content may not be suitable for all audiences.' },
|
||||
contact: { id: 'moderation_overlay.contact', defaultMessage: 'Contact' },
|
||||
show: { id: 'moderation_overlay.show', defaultMessage: 'Show Content' },
|
||||
});
|
||||
|
||||
interface ISensitiveContentOverlay {
|
||||
status: StatusEntity
|
||||
onToggleVisibility?(): void
|
||||
visible?: boolean
|
||||
}
|
||||
|
||||
const SensitiveContentOverlay = (props: ISensitiveContentOverlay) => {
|
||||
const { onToggleVisibility, status } = props;
|
||||
const isUnderReview = status.visibility === 'self';
|
||||
|
||||
const settings = useSettings();
|
||||
const displayMedia = settings.get('displayMedia') as string;
|
||||
|
||||
const intl = useIntl();
|
||||
|
||||
const { links } = useSoapboxConfig();
|
||||
|
||||
const [visible, setVisible] = useState<boolean>(defaultMediaVisibility(status, displayMedia));
|
||||
|
||||
const toggleVisibility = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
event.stopPropagation();
|
||||
|
||||
if (onToggleVisibility) {
|
||||
onToggleVisibility();
|
||||
} else {
|
||||
setVisible((prevValue) => !prevValue);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof props.visible !== 'undefined') {
|
||||
setVisible(!!props.visible);
|
||||
}
|
||||
}, [props.visible]);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={classNames('absolute z-40', {
|
||||
'cursor-default backdrop-blur-lg rounded-lg w-full h-full border-0 flex justify-center items-center': !visible,
|
||||
'bg-gray-800/75 inset-0': !visible,
|
||||
'bottom-1 right-1': visible,
|
||||
})}
|
||||
data-testid='sensitive-overlay'
|
||||
>
|
||||
{visible ? (
|
||||
<Button
|
||||
text={intl.formatMessage(messages.hide)}
|
||||
icon={require('@tabler/icons/eye-off.svg')}
|
||||
onClick={toggleVisibility}
|
||||
theme='primary'
|
||||
size='sm'
|
||||
/>
|
||||
) : (
|
||||
<div className='text-center w-3/4 mx-auto space-y-4'>
|
||||
<div className='space-y-1'>
|
||||
<Text theme='white' weight='semibold'>
|
||||
{intl.formatMessage(isUnderReview ? messages.underReviewTitle : messages.sensitiveTitle)}
|
||||
</Text>
|
||||
|
||||
<Text theme='white' size='sm' weight='medium'>
|
||||
{intl.formatMessage(isUnderReview ? messages.underReviewSubtitle : messages.sensitiveSubtitle)}
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
<HStack alignItems='center' justifyContent='center' space={2}>
|
||||
{isUnderReview ? (
|
||||
<>
|
||||
{links.get('support') && (
|
||||
<a
|
||||
href={links.get('support')}
|
||||
target='_blank'
|
||||
onClick={(event) => event.stopPropagation()}
|
||||
>
|
||||
<Button
|
||||
type='button'
|
||||
theme='outline'
|
||||
size='sm'
|
||||
icon={require('@tabler/icons/headset.svg')}
|
||||
>
|
||||
{intl.formatMessage(messages.contact)}
|
||||
</Button>
|
||||
</a>
|
||||
)}
|
||||
</>
|
||||
) : null}
|
||||
|
||||
<Button
|
||||
type='button'
|
||||
theme='outline'
|
||||
size='sm'
|
||||
icon={require('@tabler/icons/eye.svg')}
|
||||
onClick={toggleVisibility}
|
||||
>
|
||||
{intl.formatMessage(messages.show)}
|
||||
</Button>
|
||||
</HStack>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SensitiveContentOverlay;
|
||||
@ -0,0 +1,39 @@
|
||||
import { getSettings } from 'soapbox/actions/settings';
|
||||
import { normalizeCard } from 'soapbox/normalizers';
|
||||
|
||||
import type { AdProvider } from '.';
|
||||
import type { Card } from 'soapbox/types/entities';
|
||||
|
||||
/** TruthSocial ad API entity. */
|
||||
interface TruthAd {
|
||||
impression: string,
|
||||
card: Card,
|
||||
expires_at: string,
|
||||
reason: string,
|
||||
}
|
||||
|
||||
/** Provides ads from the TruthSocial API. */
|
||||
const TruthAdProvider: AdProvider = {
|
||||
getAds: async(getState) => {
|
||||
const state = getState();
|
||||
const settings = getSettings(state);
|
||||
|
||||
const response = await fetch('/api/v2/truth/ads?device=desktop', {
|
||||
headers: {
|
||||
'Accept-Language': settings.get('locale', '*') as string,
|
||||
},
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json() as TruthAd[];
|
||||
return data.map(item => ({
|
||||
...item,
|
||||
card: normalizeCard(item.card),
|
||||
}));
|
||||
}
|
||||
|
||||
return [];
|
||||
},
|
||||
};
|
||||
|
||||
export default TruthAdProvider;
|
||||
Loading…
Reference in new issue