Add local-only option back as a federation setting dropdown
Claire
parent
47deb680d5
commit
0e77c45624
|
|
@ -29,6 +29,7 @@ import { countableText } from '../util/counter';
|
|||
import { CharacterCounter } from './character_counter';
|
||||
import { ContentTypeButton } from './content_type_button';
|
||||
import { EditIndicator } from './edit_indicator';
|
||||
import { FederationButton } from './federation_button';
|
||||
import { NavigationBar } from './navigation_bar';
|
||||
import { PollForm } from "./poll_form";
|
||||
import { ReplyIndicator } from './reply_indicator';
|
||||
|
|
@ -312,6 +313,7 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
{!this.props.spoilerAlwaysOn && <SpoilerButtonContainer />}
|
||||
<ContentTypeButton />
|
||||
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} />
|
||||
<FederationButton />
|
||||
<CharacterCounter max={maxChars} text={this.getFulltextForCharacterCounting()} />
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,94 @@
|
|||
import { useCallback, useState, useRef } from 'react';
|
||||
|
||||
import { useIntl, defineMessages } from 'react-intl';
|
||||
|
||||
import Overlay from 'react-overlays/Overlay';
|
||||
|
||||
import ShareIcon from '@/material-icons/400-24px/share.svg?react';
|
||||
import ShareOffIcon from '@/material-icons/400-24px/share_off.svg?react';
|
||||
import { changeComposeAdvancedOption } from 'flavours/glitch/actions/compose';
|
||||
import { IconButton } from 'flavours/glitch/components/icon_button';
|
||||
import { useAppSelector, useAppDispatch } from 'flavours/glitch/store';
|
||||
|
||||
import DropdownMenu from './dropdown_menu';
|
||||
|
||||
const messages = defineMessages({
|
||||
change_federation_settings: { id: 'compose.change_federation', defaultMessage: 'Change federation settings' },
|
||||
local_only_label: { id: 'federation.local_only.short', defaultMessage: 'Local-only' },
|
||||
local_only_meta: { id: 'federation.local_only.long', defaultMessage: 'Prevent this post from reaching other servers' },
|
||||
federated_label: { id: 'federation.federated.short', defaultMessage: 'Federated' },
|
||||
federated_meta: { id: 'federation.federated.long', defaultMessage: 'Allow this post to reach other servers' },
|
||||
});
|
||||
|
||||
export const FederationButton = () => {
|
||||
const intl = useIntl();
|
||||
|
||||
const do_not_federate = useAppSelector((state) => state.getIn(['compose', 'advanced_options', 'do_not_federate']));
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const containerRef = useRef(null);
|
||||
|
||||
const [activeElement, setActiveElement] = useState(null);
|
||||
const [open, setOpen] = useState(false);
|
||||
const [placement, setPlacement] = useState('bottom');
|
||||
|
||||
const handleToggle = useCallback(() => {
|
||||
if (open && activeElement) {
|
||||
activeElement.focus({ preventScroll: true });
|
||||
setActiveElement(null);
|
||||
}
|
||||
|
||||
setOpen(!open);
|
||||
}, [open, setOpen, activeElement, setActiveElement]);
|
||||
|
||||
const handleClose = useCallback(() => {
|
||||
if (open && activeElement) {
|
||||
activeElement.focus({ preventScroll: true });
|
||||
setActiveElement(null);
|
||||
}
|
||||
|
||||
setOpen(false);
|
||||
}, [open, setOpen, activeElement, setActiveElement]);
|
||||
|
||||
const handleChange = useCallback((value) => {
|
||||
dispatch(changeComposeAdvancedOption('do_not_federate', value === 'local-only'));
|
||||
}, [dispatch]);
|
||||
|
||||
const handleOverlayEnter = useCallback((state) => {
|
||||
setPlacement(state.placement);
|
||||
}, [setPlacement]);
|
||||
|
||||
const options = [
|
||||
{ icon: 'link', iconComponent: ShareIcon, value: 'federated', text: intl.formatMessage(messages.federated_label), meta: intl.formatMessage(messages.federated_meta) },
|
||||
{ icon: 'link-slash', iconComponent: ShareOffIcon, value: 'local-only', text: intl.formatMessage(messages.local_only_label), meta: intl.formatMessage(messages.local_only_meta) },
|
||||
];
|
||||
|
||||
return (
|
||||
<div ref={containerRef}>
|
||||
<IconButton
|
||||
icon={do_not_federate ? 'link-slash' : 'link'}
|
||||
onClick={handleToggle}
|
||||
iconComponent={do_not_federate ? ShareOffIcon : ShareIcon}
|
||||
title={intl.formatMessage(messages.change_federation_settings)}
|
||||
active={open}
|
||||
size={18}
|
||||
inverted
|
||||
/>
|
||||
|
||||
<Overlay show={open} offset={[5, 5]} placement={placement} flip target={containerRef} popperConfig={{ strategy: 'fixed', onFirstUpdate: handleOverlayEnter }}>
|
||||
{({ props, placement }) => (
|
||||
<div {...props}>
|
||||
<div className={`dropdown-animation privacy-dropdown__dropdown ${placement}`}>
|
||||
<DropdownMenu
|
||||
items={options}
|
||||
value={do_not_federate ? 'local-only' : 'federated'}
|
||||
onClose={handleClose}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Overlay>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
@ -14,6 +14,7 @@
|
|||
"column_subheading.lists": "Lists",
|
||||
"column_subheading.navigation": "Navigation",
|
||||
"community.column_settings.allow_local_only": "Show local-only toots",
|
||||
"compose.change_federation": "Change federation settings",
|
||||
"compose.content-type.change": "Change advanced formatting options",
|
||||
"compose.content-type.html": "HTML",
|
||||
"compose.content-type.html_meta": "Format your posts using HTML",
|
||||
|
|
@ -34,6 +35,10 @@
|
|||
"direct.group_by_conversations": "Group by conversation",
|
||||
"endorsed_accounts_editor.endorsed_accounts": "Featured accounts",
|
||||
"favourite_modal.combo": "You can press {combo} to skip this next time",
|
||||
"federation.federated.long": "Allow this post to reach other servers",
|
||||
"federation.federated.short": "Federated",
|
||||
"federation.local_only.long": "Prevent this post from reaching other servers",
|
||||
"federation.local_only.short": "Local-only",
|
||||
"firehose.column_settings.allow_local_only": "Show local-only posts in \"All\"",
|
||||
"home.column_settings.advanced": "Advanced",
|
||||
"home.column_settings.filter_regex": "Filter out by regular expressions",
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M240-440q83 0 141.5 58.5T440-240q0 83-58.5 141.5T240-40q-83 0-141.5-58.5T40-240q0-83 58.5-141.5T240-440Zm0 228 70 71 29-28-71-71 71-71-28-28-71 71-71-71-28 28 71 71-71 71 28 28 71-71Zm480-428q-23 0-44-8.5T638-672L356-508q1 4 1.5 7.5t1.5 7.5q-27-13-57-20t-62-7q-32 0-62 7t-57 20q5-45 38.5-76t80.5-31q23 0 44 8.5t38 23.5l282-164q-2-6-3-13.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35Zm0 560q-50 0-85-35t-35-85q0-7 1-14.5t3-13.5l-87-50q-4-27-12.5-52T483-378l155 90q17-15 38-23.5t44-8.5q50 0 85 35t35 85q0 50-35 85t-85 35Z"/></svg>
|
||||
|
After Width: | Height: | Size: 641 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M720-720q17 0 28.5-11.5T760-760q0-17-11.5-28.5T720-800q-17 0-28.5 11.5T680-760q0 17 11.5 28.5T720-720Zm0 560q17 0 28.5-11.5T760-200q0-17-11.5-28.5T720-240q-17 0-28.5 11.5T680-200q0 17 11.5 28.5T720-160Zm0-600Zm0 560ZM240-40q-83 0-141.5-58.5T40-240q0-83 58.5-141.5T240-440q83 0 141.5 58.5T440-240q0 83-58.5 141.5T240-40ZM121-493q5-45 38.5-76t80.5-31q23 0 44 8.5t38 23.5l282-164q-2-6-3-13.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-23 0-44-8.5T638-672L356-508q1 4 1.5 7.5t1.5 7.5q-27-13-57-20t-62-7q-32 0-62 7t-57 20ZM720-80q-50 0-85-35t-35-85q0-7 1-14.5t3-13.5l-87-50q-4-27-12.5-52T483-378l155 90q17-15 38-23.5t44-8.5q50 0 85 35t35 85q0 50-35 85t-85 35ZM240-212l70 71 29-28-71-71 71-71-28-28-71 71-71-71-28 28 71 71-71 71 28 28 71-71Z"/></svg>
|
||||
|
After Width: | Height: | Size: 859 B |
Loading…
Reference in New Issue