From 669fe9ee06a82482201377abd303492eb7fa7d94 Mon Sep 17 00:00:00 2001 From: aschmitz Date: Wed, 20 Sep 2017 07:53:48 -0500 Subject: Change IDs to strings rather than numbers in API JSON output (#5019) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Fix JavaScript interface with long IDs Somewhat predictably, the JS interface handled IDs as numbers, which in JS are IEEE double-precision floats. This loses some precision when working with numbers as large as those generated by the new ID scheme, so we instead handle them here as strings. This is relatively simple, and doesn't appear to have caused any problems, but should definitely be tested more thoroughly than the built-in tests. Several days of use appear to support this working properly. BREAKING CHANGE: The major(!) change here is that IDs are now returned as strings by the REST endpoints, rather than as integers. In practice, relatively few changes were required to make the existing JS UI work with this change, but it will likely hit API clients pretty hard: it's an entirely different type to consume. (The one API client I tested, Tusky, handles this with no problems, however.) Twitter ran into this issue when introducing Snowflake IDs, and decided to instead introduce an `id_str` field in JSON responses. I have opted to *not* do that, and instead force all IDs to 64-bit integers represented by strings in one go. (I believe Twitter exacerbated their problem by rolling out the changes three times: once for statuses, once for DMs, and once for user IDs, as well as by leaving an integer ID value in JSON. As they said, "If you’re using the `id` field with JSON in a Javascript-related language, there is a very high likelihood that the integers will be silently munged by Javascript interpreters. In most cases, this will result in behavior such as being unable to load or delete a specific direct message, because the ID you're sending to the API is different than the actual identifier associated with the message." [1]) However, given that this is a significant change for API users, alternatives or a transition time may be appropriate. 1: https://blog.twitter.com/developer/en_us/a/2011/direct-messages-going-snowflake-on-sep-30-2011.html * Additional fixes for stringified IDs in JSON These should be the last two. These were identified using eslint to try to identify any plain casts to JavaScript numbers. (Some such casts are legitimate, but these were not.) Adding the following to .eslintrc.yml will identify casts to numbers: ~~~ no-restricted-syntax: - warn - selector: UnaryExpression[operator='+'] > :not(Literal) message: Avoid the use of unary + - selector: CallExpression[callee.name='Number'] message: Casting with Number() may coerce string IDs to numbers ~~~ The remaining three casts appear legitimate: two casts to array indices, one in a server to turn an environment variable into a number. * Back out RelationshipsController Change This was made to make a test a bit less flakey, but has nothing to do with this branch. * Change internal streaming payloads to stringified IDs as well Per https://github.com/tootsuite/mastodon/pull/5019#issuecomment-330736452 we need these changes to send deleted status IDs as strings, not integers. --- app/serializers/initial_state_serializer.rb | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'app/serializers/initial_state_serializer.rb') diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb index 32ffcc688..9ee9bd29c 100644 --- a/app/serializers/initial_state_serializer.rb +++ b/app/serializers/initial_state_serializer.rb @@ -10,11 +10,11 @@ class InitialStateSerializer < ActiveModel::Serializer access_token: object.token, locale: I18n.locale, domain: Rails.configuration.x.local_domain, - admin: object.admin&.id, + admin: object.admin&.id&.to_s, } if object.current_account - store[:me] = object.current_account.id + store[:me] = object.current_account.id.to_s store[:unfollow_modal] = object.current_account.user.setting_unfollow_modal store[:boost_modal] = object.current_account.user.setting_boost_modal store[:delete_modal] = object.current_account.user.setting_delete_modal @@ -28,7 +28,7 @@ class InitialStateSerializer < ActiveModel::Serializer store = {} if object.current_account - store[:me] = object.current_account.id + store[:me] = object.current_account.id.to_s store[:default_privacy] = object.current_account.user.setting_default_privacy store[:default_sensitive] = object.current_account.user.setting_default_sensitive end @@ -40,8 +40,8 @@ class InitialStateSerializer < ActiveModel::Serializer def accounts store = {} - store[object.current_account.id] = ActiveModelSerializers::SerializableResource.new(object.current_account, serializer: REST::AccountSerializer) if object.current_account - store[object.admin.id] = ActiveModelSerializers::SerializableResource.new(object.admin, serializer: REST::AccountSerializer) if object.admin + store[object.current_account.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.current_account, serializer: REST::AccountSerializer) if object.current_account + store[object.admin.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.admin, serializer: REST::AccountSerializer) if object.admin store end -- cgit From c8580eb806512fcc8ca76303e7d837f77c2cb413 Mon Sep 17 00:00:00 2001 From: unarist Date: Thu, 21 Sep 2017 02:07:23 +0900 Subject: Use file extensions in addition to MIME types for file picker (#5029) Currently we're using a list of MIME types for `accept` attribute on `input[type="file"]` for filter options of file picker, and actual file extensions will be infered by browsers. However, infered extensions may not include our expected items. For example, "image/jpeg" seems to be infered to only ".jfif" extension in Firefox. To ensure common file extensions are in the list, this PR adds file extensions in addition to MIME types. Also having items in both format is encouraged by HTML5 spec. https://www.w3.org/TR/html5/forms.html#file-upload-state-(type=file) --- app/models/media_attachment.rb | 3 +++ app/serializers/initial_state_serializer.rb | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) (limited to 'app/serializers/initial_state_serializer.rb') diff --git a/app/models/media_attachment.rb b/app/models/media_attachment.rb index d913e7372..e4a974f96 100644 --- a/app/models/media_attachment.rb +++ b/app/models/media_attachment.rb @@ -25,6 +25,9 @@ class MediaAttachment < ApplicationRecord enum type: [:image, :gifv, :video, :unknown] + IMAGE_FILE_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.gif'].freeze + VIDEO_FILE_EXTENSIONS = ['.webm', '.mp4', '.m4v'].freeze + IMAGE_MIME_TYPES = ['image/jpeg', 'image/png', 'image/gif'].freeze VIDEO_MIME_TYPES = ['video/webm', 'video/mp4'].freeze diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb index 9ee9bd29c..88bbc0dff 100644 --- a/app/serializers/initial_state_serializer.rb +++ b/app/serializers/initial_state_serializer.rb @@ -46,6 +46,6 @@ class InitialStateSerializer < ActiveModel::Serializer end def media_attachments - { accept_content_types: MediaAttachment::IMAGE_MIME_TYPES + MediaAttachment::VIDEO_MIME_TYPES } + { accept_content_types: MediaAttachment::IMAGE_FILE_EXTENSIONS + MediaAttachment::VIDEO_FILE_EXTENSIONS + MediaAttachment::IMAGE_MIME_TYPES + MediaAttachment::VIDEO_MIME_TYPES } end end -- cgit From 66126f302167d21e4bf247e660f595ff0beaaf20 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Sat, 23 Sep 2017 05:40:28 +0200 Subject: Add custom emojis to the emoji picker (#5052) --- app/javascript/mastodon/emoji.js | 40 ++++++++++++++++++++++ .../features/compose/components/compose_form.js | 2 +- .../compose/components/emoji_picker_dropdown.js | 16 ++++++++- .../containers/emoji_picker_dropdown_container.js | 8 +++++ app/javascript/mastodon/reducers/custom_emojis.js | 13 +++++++ app/javascript/mastodon/reducers/index.js | 2 ++ app/javascript/styles/components.scss | 6 ++++ app/serializers/initial_state_serializer.rb | 6 ++++ 8 files changed, 91 insertions(+), 2 deletions(-) create mode 100644 app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js create mode 100644 app/javascript/mastodon/reducers/custom_emojis.js (limited to 'app/serializers/initial_state_serializer.rb') diff --git a/app/javascript/mastodon/emoji.js b/app/javascript/mastodon/emoji.js index 407b21b4b..39123768a 100644 --- a/app/javascript/mastodon/emoji.js +++ b/app/javascript/mastodon/emoji.js @@ -47,3 +47,43 @@ const emojify = (str, customEmojis = {}) => { }; export default emojify; + +export const toCodePoint = (unicodeSurrogates, sep = '-') => { + let r = [], c = 0, p = 0, i = 0; + + while (i < unicodeSurrogates.length) { + c = unicodeSurrogates.charCodeAt(i++); + + if (p) { + r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16)); + p = 0; + } else if (0xD800 <= c && c <= 0xDBFF) { + p = c; + } else { + r.push(c.toString(16)); + } + } + + return r.join(sep); +}; + +export const buildCustomEmojis = customEmojis => { + const emojis = []; + + customEmojis.forEach(emoji => { + const shortcode = emoji.get('shortcode'); + const url = emoji.get('url'); + const name = shortcode.replace(':', ''); + + emojis.push({ + name, + short_names: [name], + text: '', + emoticons: [], + keywords: [name], + imageUrl: url, + }); + }); + + return emojis; +}; diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js index bb747b611..d31041061 100644 --- a/app/javascript/mastodon/features/compose/components/compose_form.js +++ b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -12,7 +12,7 @@ import Collapsable from '../../../components/collapsable'; import SpoilerButtonContainer from '../containers/spoiler_button_container'; import PrivacyDropdownContainer from '../containers/privacy_dropdown_container'; import SensitiveButtonContainer from '../containers/sensitive_button_container'; -import EmojiPickerDropdown from './emoji_picker_dropdown'; +import EmojiPickerDropdown from '../containers/emoji_picker_dropdown_container'; import UploadFormContainer from '../containers/upload_form_container'; import WarningContainer from '../containers/warning_container'; import { isMobile } from '../../../is_mobile'; diff --git a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js index 43e175be5..f55d59e03 100644 --- a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js +++ b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js @@ -4,6 +4,8 @@ import { defineMessages, injectIntl } from 'react-intl'; import { EmojiPicker as EmojiPickerAsync } from '../../ui/util/async-components'; import { Overlay } from 'react-overlays'; import classNames from 'classnames'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { buildCustomEmojis } from '../../../emoji'; const messages = defineMessages({ emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' }, @@ -130,6 +132,7 @@ class ModifierPicker extends React.PureComponent { class EmojiPickerMenu extends React.PureComponent { static propTypes = { + custom_emojis: ImmutablePropTypes.list, loading: PropTypes.bool, onClose: PropTypes.func.isRequired, onPick: PropTypes.func.isRequired, @@ -194,6 +197,10 @@ class EmojiPickerMenu extends React.PureComponent { } handleClick = emoji => { + if (!emoji.native) { + emoji.native = emoji.colons; + } + this.props.onClose(); this.props.onPick(emoji); } @@ -225,6 +232,7 @@ class EmojiPickerMenu extends React.PureComponent { return (
- +
); diff --git a/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js b/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js new file mode 100644 index 000000000..7a8026bbc --- /dev/null +++ b/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js @@ -0,0 +1,8 @@ +import { connect } from 'react-redux'; +import EmojiPickerDropdown from '../components/emoji_picker_dropdown'; + +const mapStateToProps = state => ({ + custom_emojis: state.get('custom_emojis'), +}); + +export default connect(mapStateToProps)(EmojiPickerDropdown); diff --git a/app/javascript/mastodon/reducers/custom_emojis.js b/app/javascript/mastodon/reducers/custom_emojis.js new file mode 100644 index 000000000..15bba7bcc --- /dev/null +++ b/app/javascript/mastodon/reducers/custom_emojis.js @@ -0,0 +1,13 @@ +import { List as ImmutableList } from 'immutable'; +import { STORE_HYDRATE } from '../actions/store'; + +const initialState = ImmutableList(); + +export default function statuses(state = initialState, action) { + switch(action.type) { + case STORE_HYDRATE: + return action.state.get('custom_emojis'); + default: + return state; + } +}; diff --git a/app/javascript/mastodon/reducers/index.js b/app/javascript/mastodon/reducers/index.js index 0a8c3ce6c..e65144871 100644 --- a/app/javascript/mastodon/reducers/index.js +++ b/app/javascript/mastodon/reducers/index.js @@ -20,6 +20,7 @@ import search from './search'; import media_attachments from './media_attachments'; import notifications from './notifications'; import height_cache from './height_cache'; +import custom_emojis from './custom_emojis'; const reducers = { timelines, @@ -43,6 +44,7 @@ const reducers = { media_attachments, notifications, height_cache, + custom_emojis, }; export default combineReducers(reducers); diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss index abf5cfd5b..595ab3658 100644 --- a/app/javascript/styles/components.scss +++ b/app/javascript/styles/components.scss @@ -2629,6 +2629,12 @@ button.icon-button.active i.fa-retweet { } } +.emoji-mart-emoji { + span { + background-repeat: no-repeat; + } +} + .upload-area { align-items: center; background: rgba($base-overlay-background, 0.8); diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb index 88bbc0dff..e2f15a601 100644 --- a/app/serializers/initial_state_serializer.rb +++ b/app/serializers/initial_state_serializer.rb @@ -4,6 +4,12 @@ class InitialStateSerializer < ActiveModel::Serializer attributes :meta, :compose, :accounts, :media_attachments, :settings, :push_subscription + has_many :custom_emojis, serializer: REST::CustomEmojiSerializer + + def custom_emojis + CustomEmoji.local + end + def meta store = { streaming_api_base_url: Rails.configuration.x.streaming_api_base_url, -- cgit