From 9bd23dc4e51ba47283a8e3a66cd94b4e624a5235 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Sun, 27 May 2018 21:45:30 +0200 Subject: Track trending tags (#7638) * Track trending tags - Half-life of 1 day - Historical usage in daily buckets (last 7 days stored) - GET /api/v1/trends Fix #271 * Add trends to web UI * Don't render compose form on search route, adjust search results header * Disqualify tag from trends if it's in disallowed hashtags setting * Count distinct accounts using tag, ignore silenced accounts --- app/javascript/styles/mastodon/components.scss | 83 +++++++++++++++++++++++++- 1 file changed, 81 insertions(+), 2 deletions(-) (limited to 'app/javascript/styles') diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 2724454fb..c66bc427c 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -3334,9 +3334,15 @@ a.status-card { color: $dark-text-color; background: lighten($ui-base-color, 2%); border-bottom: 1px solid darken($ui-base-color, 4%); - padding: 15px 10px; - font-size: 14px; + padding: 15px; font-weight: 500; + font-size: 16px; + cursor: default; + + .fa { + display: inline-block; + margin-right: 5px; + } } .search-results__section { @@ -5209,3 +5215,76 @@ noscript { background: $ui-base-color; } } + +.trends { + &__header { + color: $dark-text-color; + background: lighten($ui-base-color, 2%); + border-bottom: 1px solid darken($ui-base-color, 4%); + font-weight: 500; + padding: 15px; + font-size: 16px; + cursor: default; + + .fa { + display: inline-block; + margin-right: 5px; + } + } + + &__item { + display: flex; + align-items: center; + padding: 15px; + border-bottom: 1px solid lighten($ui-base-color, 8%); + + &:last-child { + border-bottom: 0; + } + + &__name { + flex: 1 1 auto; + color: $dark-text-color; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + strong { + font-weight: 500; + } + + a { + color: $darker-text-color; + text-decoration: none; + font-size: 14px; + font-weight: 500; + display: block; + + &:hover, + &:focus, + &:active { + span { + text-decoration: underline; + } + } + } + } + + &__current { + width: 100px; + font-size: 24px; + line-height: 36px; + font-weight: 500; + text-align: center; + color: $secondary-text-color; + } + + &__sparkline { + width: 50px; + + path { + stroke: lighten($highlight-text-color, 6%) !important; + } + } + } +} -- cgit From 04a2cf8bcc7ab5878b29ee60af41dd661a6e19eb Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Mon, 28 May 2018 19:12:53 +0200 Subject: Fix incomplete flex style on trends items (#7655) --- app/javascript/styles/mastodon/components.scss | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'app/javascript/styles') diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index c66bc427c..a2a18b5a0 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -5259,6 +5259,9 @@ noscript { font-size: 14px; font-weight: 500; display: block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; &:hover, &:focus, @@ -5271,6 +5274,7 @@ noscript { } &__current { + flex: 0 0 auto; width: 100px; font-size: 24px; line-height: 36px; @@ -5280,6 +5284,7 @@ noscript { } &__sparkline { + flex: 0 0 auto; width: 50px; path { -- cgit From c0355878ba00808d1d8710cb27b1fbb36bcb54e8 Mon Sep 17 00:00:00 2001 From: Lynx Kotoura Date: Tue, 29 May 2018 02:13:20 +0900 Subject: Fix embed, error and onboarding modals in light theme (#7656) --- app/javascript/styles/mastodon-light/diff.scss | 38 ++++++++++++++++++++++++-- 1 file changed, 36 insertions(+), 2 deletions(-) (limited to 'app/javascript/styles') diff --git a/app/javascript/styles/mastodon-light/diff.scss b/app/javascript/styles/mastodon-light/diff.scss index 2b88b830c..fe304317d 100644 --- a/app/javascript/styles/mastodon-light/diff.scss +++ b/app/javascript/styles/mastodon-light/diff.scss @@ -132,20 +132,54 @@ .boost-modal, .confirmation-modal, .mute-modal, -.report-modal { +.report-modal, +.embed-modal, +.error-modal, +.onboarding-modal { background: $ui-base-color; } .boost-modal__action-bar, .confirmation-modal__action-bar, -.mute-modal__action-bar { +.mute-modal__action-bar, +.onboarding-modal__paginator, +.error-modal__footer { background: darken($ui-base-color, 6%); + + .onboarding-modal__nav, + .error-modal__nav { + &:hover, + &:focus, + &:active { + background-color: darken($ui-base-color, 12%); + } + } +} + +.display-case__case { + background: $white; +} + +.embed-modal .embed-modal__container .embed-modal__html { + background: $white; + + &:focus { + background: darken($ui-base-color, 6%); + } } .react-toggle-track { background: $ui-secondary-color; } +.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track { + background: darken($ui-secondary-color, 10%); +} + +.react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled) .react-toggle-track { + background: lighten($ui-highlight-color, 10%); +} + // Change the default color used for the text in an empty column or on the error column .empty-column-indicator, .error-column { -- cgit From 8bb74e50beb3e6602c183e59086ccebe87f96fb2 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Tue, 29 May 2018 02:01:24 +0200 Subject: Add GET /api/v2/search which returns rich tag objects, adjust web UI (#7661) --- app/controllers/api/v2/search_controller.rb | 8 ++++ app/javascript/mastodon/actions/search.js | 2 +- .../features/compose/components/search_results.js | 56 +++++++++++----------- app/javascript/mastodon/reducers/search.js | 4 +- app/javascript/styles/mastodon/components.scss | 44 ++++++++--------- app/serializers/rest/v2/search_serializer.rb | 7 +++ config/routes.rb | 4 ++ 7 files changed, 69 insertions(+), 56 deletions(-) create mode 100644 app/controllers/api/v2/search_controller.rb create mode 100644 app/serializers/rest/v2/search_serializer.rb (limited to 'app/javascript/styles') diff --git a/app/controllers/api/v2/search_controller.rb b/app/controllers/api/v2/search_controller.rb new file mode 100644 index 000000000..2e91d68ee --- /dev/null +++ b/app/controllers/api/v2/search_controller.rb @@ -0,0 +1,8 @@ +# frozen_string_literal: true + +class Api::V2::SearchController < Api::V1::SearchController + def index + @search = Search.new(search) + render json: @search, serializer: REST::V2::SearchSerializer + end +end diff --git a/app/javascript/mastodon/actions/search.js b/app/javascript/mastodon/actions/search.js index 882c1709e..b670d25c3 100644 --- a/app/javascript/mastodon/actions/search.js +++ b/app/javascript/mastodon/actions/search.js @@ -33,7 +33,7 @@ export function submitSearch() { dispatch(fetchSearchRequest()); - api(getState).get('/api/v1/search', { + api(getState).get('/api/v2/search', { params: { q: value, resolve: true, diff --git a/app/javascript/mastodon/features/compose/components/search_results.js b/app/javascript/mastodon/features/compose/components/search_results.js index f2655c14d..445bf27bb 100644 --- a/app/javascript/mastodon/features/compose/components/search_results.js +++ b/app/javascript/mastodon/features/compose/components/search_results.js @@ -16,6 +16,28 @@ const shortNumberFormat = number => { } }; +const renderHashtag = hashtag => ( +
+
+ + #{hashtag.get('name')} + + + {shortNumberFormat(hashtag.getIn(['history', 0, 'accounts']))} }} /> +
+ +
+ {shortNumberFormat(hashtag.getIn(['history', 0, 'uses']))} +
+ +
+ day.get('uses')).toArray()}> + + +
+
+); + export default class SearchResults extends ImmutablePureComponent { static propTypes = { @@ -44,27 +66,7 @@ export default class SearchResults extends ImmutablePureComponent { - {trends && trends.map(hashtag => ( -
-
- - #{hashtag.get('name')} - - - {shortNumberFormat(hashtag.getIn(['history', 0, 'accounts']))} }} /> -
- -
- {shortNumberFormat(hashtag.getIn(['history', 0, 'uses']))} -
- -
- day.get('uses')).toArray()}> - - -
-
- ))} + {trends && trends.map(hashtag => renderHashtag(hashtag))} ); @@ -74,7 +76,7 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('accounts').size; accounts = (
-
+
{results.get('accounts').map(accountId => )}
@@ -85,7 +87,7 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('statuses').size; statuses = (
-
+
{results.get('statuses').map(statusId => )}
@@ -96,13 +98,9 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('hashtags').size; hashtags = (
-
+
- {results.get('hashtags').map(hashtag => ( - - {hashtag} - - ))} + {results.get('hashtags').map(hashtag => renderHashtag(hashtag))}
); } diff --git a/app/javascript/mastodon/reducers/search.js b/app/javascript/mastodon/reducers/search.js index 56fd7226b..4758defb1 100644 --- a/app/javascript/mastodon/reducers/search.js +++ b/app/javascript/mastodon/reducers/search.js @@ -9,7 +9,7 @@ import { COMPOSE_REPLY, COMPOSE_DIRECT, } from '../actions/compose'; -import { Map as ImmutableMap, List as ImmutableList } from 'immutable'; +import { Map as ImmutableMap, List as ImmutableList, fromJS } from 'immutable'; const initialState = ImmutableMap({ value: '', @@ -39,7 +39,7 @@ export default function search(state = initialState, action) { return state.set('results', ImmutableMap({ accounts: ImmutableList(action.results.accounts.map(item => item.id)), statuses: ImmutableList(action.results.statuses.map(item => item.id)), - hashtags: ImmutableList(action.results.hashtags), + hashtags: fromJS(action.results.hashtags), })).set('submitted', true); default: return state; diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index a2a18b5a0..c93d8e86a 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -3284,6 +3284,15 @@ a.status-card { } .search__icon { + &::-moz-focus-inner { + border: 0; + } + + &::-moz-focus-inner, + &:focus { + outline: 0 !important; + } + .fa { position: absolute; top: 10px; @@ -3333,7 +3342,6 @@ a.status-card { .search-results__header { color: $dark-text-color; background: lighten($ui-base-color, 2%); - border-bottom: 1px solid darken($ui-base-color, 4%); padding: 15px; font-weight: 500; font-size: 16px; @@ -3346,33 +3354,21 @@ a.status-card { } .search-results__section { - margin-bottom: 20px; + margin-bottom: 5px; h5 { - position: relative; - - &::before { - content: ""; - display: block; - position: absolute; - left: 0; - right: 0; - top: 50%; - width: 100%; - height: 0; - border-top: 1px solid lighten($ui-base-color, 8%); - } + background: darken($ui-base-color, 4%); + border-bottom: 1px solid lighten($ui-base-color, 8%); + cursor: default; + display: flex; + padding: 15px; + font-weight: 500; + font-size: 16px; + color: $dark-text-color; - span { + .fa { display: inline-block; - background: $ui-base-color; - color: $darker-text-color; - font-size: 14px; - font-weight: 500; - padding: 10px; - position: relative; - z-index: 1; - cursor: default; + margin-right: 5px; } } diff --git a/app/serializers/rest/v2/search_serializer.rb b/app/serializers/rest/v2/search_serializer.rb new file mode 100644 index 000000000..cdb6b3a53 --- /dev/null +++ b/app/serializers/rest/v2/search_serializer.rb @@ -0,0 +1,7 @@ +# frozen_string_literal: true + +class REST::V2::SearchSerializer < ActiveModel::Serializer + has_many :accounts, serializer: REST::AccountSerializer + has_many :statuses, serializer: REST::StatusSerializer + has_many :hashtags, serializer: REST::TagSerializer +end diff --git a/config/routes.rb b/config/routes.rb index 2fcb885ed..31e90e2ff 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -315,6 +315,10 @@ Rails.application.routes.draw do end end + namespace :v2 do + get '/search', to: 'search#index', as: :search + end + namespace :web do resource :settings, only: [:update] resource :embed, only: [:create] -- cgit