Cleanup, fix sensitive content overlay
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
bcf3df869f
commit
ec4c1a29e2
5 changed files with 20 additions and 12 deletions
|
@ -24,7 +24,7 @@
|
||||||
</body>
|
</body>
|
||||||
<script>
|
<script>
|
||||||
window.BIG_BUFFET_CONFIG = {
|
window.BIG_BUFFET_CONFIG = {
|
||||||
baseUrl: 'https://pleroma.woodynet.net/',
|
baseUrl: 'https://pl.fediverse.pl/',
|
||||||
mountPoint: 'bigbuffet',
|
mountPoint: 'bigbuffet',
|
||||||
styles: ['default', 'generated'],
|
styles: ['default', 'generated'],
|
||||||
icons: {},
|
icons: {},
|
||||||
|
|
|
@ -9,13 +9,14 @@ import VerificationBadge from 'bigbuffet/components/verification-badge';
|
||||||
import bigBuffetConfig from 'bigbuffet/config';
|
import bigBuffetConfig from 'bigbuffet/config';
|
||||||
import Emojify from 'bigbuffet/features/emoji';
|
import Emojify from 'bigbuffet/features/emoji';
|
||||||
import ActionButton from 'bigbuffet/features/ui/components/action-button';
|
import ActionButton from 'bigbuffet/features/ui/components/action-button';
|
||||||
|
import { useModalsStore } from 'bigbuffet/stores/modals';
|
||||||
import { getAcct } from 'bigbuffet/utils/accounts';
|
import { getAcct } from 'bigbuffet/utils/accounts';
|
||||||
|
|
||||||
import type { NormalizedAccount as AccountEntity } from 'pl-hooks';
|
import type { NormalizedAccount as AccountEntity } from 'pl-hooks';
|
||||||
|
|
||||||
interface IProfilePopper {
|
interface IProfilePopper {
|
||||||
condition: boolean;
|
condition: boolean;
|
||||||
wrapper: (children: any) => React.ReactElement<any, any>;
|
wrapper: (children: React.ReactNode) => React.ReactElement<any, any>;
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -36,7 +37,7 @@ export interface IAccount {
|
||||||
timestamp?: string;
|
timestamp?: string;
|
||||||
timestampUrl?: string;
|
timestampUrl?: string;
|
||||||
withLinkToProfile?: boolean;
|
withLinkToProfile?: boolean;
|
||||||
showEdit?: boolean;
|
showEdit?: string | false;
|
||||||
}
|
}
|
||||||
|
|
||||||
const Account = ({
|
const Account = ({
|
||||||
|
@ -53,6 +54,8 @@ const Account = ({
|
||||||
const overflowRef = React.useRef<HTMLDivElement>(null);
|
const overflowRef = React.useRef<HTMLDivElement>(null);
|
||||||
const actionRef = React.useRef<HTMLDivElement>(null);
|
const actionRef = React.useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
|
const { openModal } = useModalsStore();
|
||||||
|
|
||||||
const username = account ? getAcct(account, bigBuffetConfig.displayFqn) : null;
|
const username = account ? getAcct(account, bigBuffetConfig.displayFqn) : null;
|
||||||
|
|
||||||
const renderAction = () => {
|
const renderAction = () => {
|
||||||
|
@ -92,6 +95,8 @@ const Account = ({
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const openCompareHistoryModal = () => showEdit && openModal('COMPARE_HISTORY', { statusId: showEdit });
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div data-testid='account' className='account-card__container' ref={overflowRef}>
|
<div data-testid='account' className='account-card__container' ref={overflowRef}>
|
||||||
<div className='account-card'>
|
<div className='account-card'>
|
||||||
|
@ -176,7 +181,13 @@ const Account = ({
|
||||||
<>
|
<>
|
||||||
<span>·</span>
|
<span>·</span>
|
||||||
|
|
||||||
<Icon className='account-card__account__name__edit-icon' icon='edit' />
|
<div
|
||||||
|
onClick={openCompareHistoryModal}
|
||||||
|
role='button'
|
||||||
|
tabIndex={0}
|
||||||
|
>
|
||||||
|
<Icon className='account-card__account__name__edit-icon' icon='edit' />
|
||||||
|
</div>
|
||||||
</>
|
</>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -122,7 +122,7 @@ const ScrollableList = React.forwardRef<Virtualizer<any, any>, IScrollableList &
|
||||||
if (autoloadMore || !hasMore || !onLoadMore) {
|
if (autoloadMore || !hasMore || !onLoadMore) {
|
||||||
return null;
|
return null;
|
||||||
} else {
|
} else {
|
||||||
const button = <LoadMore className='mt-4' visible={!isLoading} onClick={onLoadMore} />;
|
const button = <LoadMore visible={!isLoading} onClick={onLoadMore} />;
|
||||||
|
|
||||||
return button;
|
return button;
|
||||||
}
|
}
|
||||||
|
|
|
@ -265,7 +265,7 @@ const Status: React.FC<IStatus> = (props) => {
|
||||||
timestampUrl={actualStatus.url}
|
timestampUrl={actualStatus.url}
|
||||||
action={accountAction}
|
action={accountAction}
|
||||||
hideActions={!accountAction}
|
hideActions={!accountAction}
|
||||||
showEdit={!!actualStatus.edited_at}
|
showEdit={actualStatus.edited_at ? actualStatus.id : false}
|
||||||
showAccountHoverCard={hoverable}
|
showAccountHoverCard={hoverable}
|
||||||
withLinkToProfile={hoverable}
|
withLinkToProfile={hoverable}
|
||||||
/>
|
/>
|
||||||
|
@ -279,7 +279,7 @@ const Status: React.FC<IStatus> = (props) => {
|
||||||
style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
|
style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
|
||||||
>
|
>
|
||||||
{actualStatus.sensitive && (
|
{actualStatus.sensitive && (
|
||||||
<SensitiveContentOverlay status={status} ref={overlay} />
|
<SensitiveContentOverlay status={actualStatus} ref={overlay} />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{actualStatus.event ? <EventPreview status={actualStatus} /> : (
|
{actualStatus.event ? <EventPreview status={actualStatus} /> : (
|
||||||
|
|
|
@ -80,11 +80,8 @@ const DetailedStatus: React.FC<IDetailedStatus> = ({
|
||||||
className='detailed-status__body'
|
className='detailed-status__body'
|
||||||
style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
|
style={{ minHeight: actualStatus.sensitive ? Math.max(minHeight, 208) + 12 : undefined }}
|
||||||
>
|
>
|
||||||
{(actualStatus.sensitive) && (
|
{actualStatus.sensitive && (
|
||||||
<SensitiveContentOverlay
|
<SensitiveContentOverlay status={actualStatus} ref={overlay} />
|
||||||
status={status}
|
|
||||||
ref={overlay}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className='detailed-status__content'>
|
<div className='detailed-status__content'>
|
||||||
|
|
Loading…
Reference in a new issue