Merge remote-tracking branch 'origin/develop' into gdpr

This commit is contained in:
Alex Gleason
2022-07-26 10:32:15 -05:00
20 changed files with 191 additions and 78 deletions

View File

@@ -125,7 +125,7 @@ class MediaItem extends ImmutablePureComponent {
const fileExtension = remoteURL.substr(fileExtensionLastIndex + 1).toUpperCase();
thumbnail = (
<div className='media-gallery__item-thumbnail'>
<span className='media-gallery__item__icons'><Icon id='volume-up' /></span>
<span className='media-gallery__item__icons'><Icon src={require('@tabler/icons/volume.svg')} /></span>
<span className='media-gallery__file-extension__label'>{fileExtension}</span>
</div>
);
@@ -134,7 +134,7 @@ class MediaItem extends ImmutablePureComponent {
if (!visible) {
icon = (
<span className='account-gallery__item__icons'>
<Icon id='eye-slash' />
<Icon src={require('@tabler/icons/eye-off.svg')} />
</span>
);
}

View File

@@ -84,7 +84,7 @@ const Aliases = () => {
<Text tag='span'>{alias}</Text>
</div>
<div className='flex items-center' role='button' tabIndex={0} onClick={handleFilterDelete} data-value={alias} aria-label={intl.formatMessage(messages.delete)}>
<Icon className='pr-1.5 text-lg' id='times' />
<Icon className='mr-1.5' src={require('@tabler/icons/x.svg')} />
<Text weight='bold' theme='muted'><FormattedMessage id='aliases.aliases_list_delete' defaultMessage='Unlink alias' /></Text>
</div>
</HStack>

View File

@@ -13,8 +13,8 @@ import Motion from '../../ui/util/optional_motion';
import type { Map as ImmutableMap } from 'immutable';
const bookIcon = require('@tabler/icons/book.svg');
const fileAnalyticsIcon = require('@tabler/icons/file-analytics.svg');
const fileCodeIcon = require('@tabler/icons/file-code.svg');
const fileSpreadsheetIcon = require('@tabler/icons/file-spreadsheet.svg');
const fileTextIcon = require('@tabler/icons/file-text.svg');
const fileZipIcon = require('@tabler/icons/file-zip.svg');
const defaultIcon = require('@tabler/icons/paperclip.svg');
@@ -39,9 +39,9 @@ export const MIMETYPE_ICONS: Record<string, string> = {
'application/xhtml+xml': fileCodeIcon,
'application/xml': fileCodeIcon,
'application/epub+zip': bookIcon,
'application/vnd.oasis.opendocument.spreadsheet': fileAnalyticsIcon,
'application/vnd.ms-excel': fileAnalyticsIcon,
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': fileAnalyticsIcon,
'application/vnd.oasis.opendocument.spreadsheet': fileSpreadsheetIcon,
'application/vnd.ms-excel': fileSpreadsheetIcon,
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': fileSpreadsheetIcon,
'application/pdf': fileTextIcon,
'application/vnd.oasis.opendocument.presentation': presentationIcon,
'application/vnd.ms-powerpoint': presentationIcon,

View File

@@ -7,6 +7,7 @@ import { changeSettingImmediate } from 'soapbox/actions/settings';
import snackbar from 'soapbox/actions/snackbar';
import { Text } from 'soapbox/components/ui';
import SvgIcon from 'soapbox/components/ui/icon/svg-icon';
import sourceCode from 'soapbox/utils/code';
import Column from '../ui/components/column';
@@ -15,7 +16,23 @@ const messages = defineMessages({
leave: { id: 'developers.leave', defaultMessage: 'You have left developers' },
});
const Developers = () => {
interface IDashWidget {
to?: string,
onClick?: React.MouseEventHandler<HTMLButtonElement>,
children: React.ReactNode,
}
const DashWidget: React.FC<IDashWidget> = ({ to, onClick, children }) => {
const className = 'bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform';
if (to) {
return <Link className={className} to={to}>{children}</Link>;
} else {
return <button className={className} onClick={onClick}>{children}</button>;
}
};
const Developers: React.FC = () => {
const dispatch = useDispatch();
const history = useHistory();
const intl = useIntl();
@@ -29,57 +46,65 @@ const Developers = () => {
};
return (
<Column label={intl.formatMessage(messages.heading)}>
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2'>
<Link to='/developers/apps/create' className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/apps.svg')} className='dark:text-gray-100' />
<>
<Column label={intl.formatMessage(messages.heading)}>
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2'>
<DashWidget to='/developers/apps/create'>
<SvgIcon src={require('@tabler/icons/apps.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.app_create_label' defaultMessage='Create an app' />
</Text>
</Link>
<Text>
<FormattedMessage id='developers.navigation.app_create_label' defaultMessage='Create an app' />
</Text>
</DashWidget>
<Link to='/developers/settings_store' className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/code-plus.svg')} className='dark:text-gray-100' />
<DashWidget to='/developers/settings_store'>
<SvgIcon src={require('@tabler/icons/code-plus.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.settings_store_label' defaultMessage='Settings store' />
</Text>
</Link>
<Text>
<FormattedMessage id='developers.navigation.settings_store_label' defaultMessage='Settings store' />
</Text>
</DashWidget>
<Link to='/developers/timeline' className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/home.svg')} className='dark:text-gray-100' />
<DashWidget to='/developers/timeline'>
<SvgIcon src={require('@tabler/icons/home.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.test_timeline_label' defaultMessage='Test timeline' />
</Text>
</Link>
<Text>
<FormattedMessage id='developers.navigation.test_timeline_label' defaultMessage='Test timeline' />
</Text>
</DashWidget>
<Link to='/error' className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/mood-sad.svg')} className='dark:text-gray-100' />
<DashWidget to='/error'>
<SvgIcon src={require('@tabler/icons/mood-sad.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.intentional_error_label' defaultMessage='Trigger an error' />
</Text>
</Link>
<Text>
<FormattedMessage id='developers.navigation.intentional_error_label' defaultMessage='Trigger an error' />
</Text>
</DashWidget>
<Link to='/error/network' className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/refresh.svg')} className='dark:text-gray-100' />
<DashWidget to='/error/network'>
<SvgIcon src={require('@tabler/icons/refresh.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.network_error_label' defaultMessage='Network error' />
</Text>
</Link>
<Text>
<FormattedMessage id='developers.navigation.network_error_label' defaultMessage='Network error' />
</Text>
</DashWidget>
<button onClick={leaveDevelopers} className='bg-gray-200 dark:bg-gray-600 p-4 rounded flex flex-col items-center justify-center space-y-2 hover:-translate-y-1 transition-transform'>
<SvgIcon src={require('@tabler/icons/logout.svg')} className='dark:text-gray-100' />
<DashWidget onClick={leaveDevelopers}>
<SvgIcon src={require('@tabler/icons/logout.svg')} className='dark:text-gray-100' />
<Text>
<FormattedMessage id='developers.navigation.leave_developers_label' defaultMessage='Leave developers' />
</Text>
</button>
<Text>
<FormattedMessage id='developers.navigation.leave_developers_label' defaultMessage='Leave developers' />
</Text>
</DashWidget>
</div>
</Column>
<div className='p-4'>
<Text align='center' theme='subtle' size='sm'>
{sourceCode.displayName} {sourceCode.version}
</Text>
</div>
</Column>
</>
);
};

View File

@@ -95,7 +95,7 @@ class InstanceRestrictions extends ImmutablePureComponent {
if (!fullMediaRemoval && media_nsfw) {
items.push((
<Text key='media_nsfw' className='flex items-center gap-2' theme='muted'>
<Icon id='eye-slash' />
<Icon src={require('@tabler/icons/eye-off.svg')} />
<FormattedMessage
id='federation_restriction.media_nsfw'
defaultMessage='Attachments marked NSFW'
@@ -117,7 +117,7 @@ class InstanceRestrictions extends ImmutablePureComponent {
if (remoteInstance.getIn(['federation', 'reject']) === true) {
return (
<Text className='flex items-center gap-2' theme='muted'>
<Icon id='times' />
<Icon src={require('@tabler/icons/x.svg')} />
<FormattedMessage
id='remote_instance.federation_panel.restricted_message'
defaultMessage='{siteTitle} blocks all activities from {host}.'
@@ -141,7 +141,7 @@ class InstanceRestrictions extends ImmutablePureComponent {
} else {
return (
<Text className='flex items-center gap-2' theme='muted'>
<Icon id='check' />
<Icon src={require('@tabler/icons/check.svg')} />
<FormattedMessage
id='remote_instance.federation_panel.no_restrictions_message'
defaultMessage='{siteTitle} has placed no restrictions on {host}.'

View File

@@ -216,7 +216,7 @@ const Filters = () => {
</div>
</div>
<div className='filter__delete' role='button' tabIndex={0} onClick={handleFilterDelete} data-value={filter.id} aria-label={intl.formatMessage(messages.delete)}>
<Icon className='filter__delete-icon' id='times' />
<Icon className='filter__delete-icon' src={require('@tabler/icons/x.svg')} />
<span className='filter__delete-label'><FormattedMessage id='filters.filters_list_delete' defaultMessage='Delete' /></span>
</div>
</div>

View File

@@ -38,7 +38,7 @@ const BoostModal: React.FC<IBoostModal> = ({ status, onReblog, onClose }) => {
<ReplyIndicator status={status} hideActions />
<Text>
<FormattedMessage id='boost_modal.combo' defaultMessage='You can press {combo} to skip this next time' values={{ combo: <span>Shift + <Icon id='retweet' /></span> }} />
<FormattedMessage id='boost_modal.combo' defaultMessage='You can press {combo} to skip this next time' values={{ combo: <span>Shift + <Icon className='inline-block align-middle' src={require('@tabler/icons/repeat.svg')} /></span> }} />
</Text>
</Stack>
</Modal>

View File

@@ -65,7 +65,7 @@ const ProfileField: React.FC<IProfileField> = ({ field }) => {
</span>
)}
<Text tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} />
<Text className='break-words overflow-hidden' tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} />
</HStack>
</dd>
</dl>