From a8c20485b3e41902b25b604b12a9e7e9124f947c Mon Sep 17 00:00:00 2001 From: Jason Henriquez Date: Tue, 23 Apr 2024 20:58:07 -0500 Subject: [PATCH] Update to use getIconForSortPreference util function with all arrows pointing down --- .../ft-playlist-add-video-prompt.js | 16 ++-------- .../ft-playlist-add-video-prompt.vue | 2 +- src/renderer/helpers/utils.js | 29 +++++++++++++++++++ src/renderer/main.js | 8 +++-- src/renderer/views/Channel/Channel.js | 15 ++-------- src/renderer/views/Channel/Channel.vue | 8 ++--- src/renderer/views/Playlist/Playlist.js | 18 ++---------- src/renderer/views/Playlist/Playlist.vue | 2 +- .../views/UserPlaylists/UserPlaylists.js | 18 ++---------- .../views/UserPlaylists/UserPlaylists.vue | 2 +- 10 files changed, 54 insertions(+), 64 deletions(-) diff --git a/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.js b/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.js index 54ef0afd33fc8..dd1d7410687bb 100644 --- a/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.js +++ b/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.js @@ -10,6 +10,7 @@ import FtSelect from '../../components/ft-select/ft-select.vue' import FtToggleSwitch from '../../components/ft-toggle-switch/ft-toggle-switch.vue' import { showToast, + getIconForSortPreference } from '../../helpers/utils' const SORT_BY_VALUES = { @@ -154,19 +155,6 @@ export default defineComponent({ sortBySelectValues() { return Object.values(SORT_BY_VALUES) }, - sortIcon: function () { - switch (this.sortBy) { - case SORT_BY_VALUES.NameDescending: - case SORT_BY_VALUES.LatestCreatedFirst: - case SORT_BY_VALUES.LatestUpdatedFirst: - return ['fas', 'arrow-down-short-wide'] - case SORT_BY_VALUES.NameAscending: - case SORT_BY_VALUES.EarliestCreatedFirst: - case SORT_BY_VALUES.EarliestUpdatedFirst: - default: - return ['fas', 'arrow-up-wide-short'] - } - } }, watch: { allPlaylistsLength(val, oldVal) { @@ -282,6 +270,8 @@ export default defineComponent({ this.query = query }, + getIconForSortPreference: (s) => getIconForSortPreference(s), + ...mapActions([ 'addVideos', 'updatePlaylist', diff --git a/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.vue b/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.vue index f4790f7c3e8bf..a925f5101709e 100644 --- a/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.vue +++ b/src/renderer/components/ft-playlist-add-video-prompt/ft-playlist-add-video-prompt.vue @@ -40,7 +40,7 @@ :select-names="sortBySelectNames" :select-values="sortBySelectValues" :placeholder="$t('User Playlists.Sort By.Sort By')" - :icon="sortIcon" + :icon="getIconForSortPreference(sortBy)" @change="sortBy = $event" /> diff --git a/src/renderer/helpers/utils.js b/src/renderer/helpers/utils.js index bbb8bf66ca366..e5730b23c62eb 100644 --- a/src/renderer/helpers/utils.js +++ b/src/renderer/helpers/utils.js @@ -15,6 +15,35 @@ function currentLocale () { return i18n.locale.replace('_', '-') } +export function getIconForSortPreference(sortPreference) { + switch (sortPreference) { + case 'name_descending': + case 'author_descending': + case 'video_title_descending': + return ['fas', 'sort-alpha-down-alt'] + case 'name_ascending': + case 'author_ascending': + case 'video_title_ascending': + return ['fas', 'sort-alpha-down'] + case 'latest_updated_first': + case 'latest_created_first': + case 'latest_played_first': + case 'date_added_descending': + case 'last': + case 'newest': + case 'popular': + case 'custom': + return ['fas', 'arrow-down-wide-short'] + case 'earliest_updated_first': + case 'earliest_created_first': + case 'earliest_played_first': + case 'date_added_ascending': + case 'oldest': + default: + return ['fas', 'arrow-down-short-wide'] + } +} + /** * @param {string} publishedText * @param {boolean} isLive diff --git a/src/renderer/main.js b/src/renderer/main.js index b53b21373e205..79f8971cd5fd0 100644 --- a/src/renderer/main.js +++ b/src/renderer/main.js @@ -15,10 +15,10 @@ import { faAngleUp, faArrowDown, faArrowDownShortWide, + faArrowDownWideShort, faArrowLeft, faArrowRight, faArrowUp, - faArrowUpWideShort, faBars, faBookmark, faCheck, @@ -74,6 +74,8 @@ import { faServer, faShareAlt, faSlidersH, + faSortAlphaDown, + faSortAlphaDownAlt, faSortDown, faStepBackward, faStepForward, @@ -106,10 +108,10 @@ library.add( faAngleUp, faArrowDown, faArrowDownShortWide, + faArrowDownWideShort, faArrowLeft, faArrowRight, faArrowUp, - faArrowUpWideShort, faBars, faBookmark, faCheck, @@ -166,6 +168,8 @@ library.add( faServer, faShareAlt, faSlidersH, + faSortAlphaDown, + faSortAlphaDownAlt, faSortDown, faStepBackward, faStepForward, diff --git a/src/renderer/views/Channel/Channel.js b/src/renderer/views/Channel/Channel.js index e09efb0b51ecb..5cbf0a037a04d 100644 --- a/src/renderer/views/Channel/Channel.js +++ b/src/renderer/views/Channel/Channel.js @@ -18,7 +18,8 @@ import { copyToClipboard, extractNumberFromString, formatNumber, - showToast + showToast, + getIconForSortPreference } from '../../helpers/utils' import { isNullOrEmpty } from '../../helpers/strings' import packageDetails from '../../../../package.json' @@ -1950,17 +1951,7 @@ export default defineComponent({ }) }, - sortIconFor: function (sortPreference) { - switch (sortPreference) { - case 'last': - case 'newest': - case 'popular': - return ['fas', 'arrow-down-short-wide'] - case 'oldest': - default: - return ['fas', 'arrow-up-wide-short'] - } - }, + getIconForSortPreference: (s) => getIconForSortPreference(s), ...mapActions([ 'showOutlines', diff --git a/src/renderer/views/Channel/Channel.vue b/src/renderer/views/Channel/Channel.vue index bf7d9edf920d4..e2ce0bc85b6ec 100644 --- a/src/renderer/views/Channel/Channel.vue +++ b/src/renderer/views/Channel/Channel.vue @@ -237,7 +237,7 @@ :select-names="videoLiveShortSelectNames" :select-values="videoLiveShortSelectValues" :placeholder="$t('Search Filters.Sort By.Sort By')" - :icon="sortIconFor(videoSortBy)" + :icon="getIconForSortPreference(videoSortBy)" @change="videoSortBy = $event" /> diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 177aab46332c0..39b3469c00c43 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -14,7 +14,7 @@ import { getLocalPlaylistContinuation, parseLocalPlaylistVideo, } from '../../helpers/api/local' -import { extractNumberFromString, setPublishedTimestampsInvidious, showToast } from '../../helpers/utils' +import { extractNumberFromString, getIconForSortPreference, setPublishedTimestampsInvidious, showToast } from '../../helpers/utils' import { invidiousGetPlaylistInfo, youtubeImageUrlToInvidious } from '../../helpers/api/invidious' const SORT_BY_VALUES = { @@ -241,20 +241,6 @@ export default defineComponent({ sortBySelectValues() { return this.sortByValues }, - sortIcon: function () { - switch (this.sortOrder) { - case SORT_BY_VALUES.DateAddedNewest: - case SORT_BY_VALUES.VideoTitleDescending: - case SORT_BY_VALUES.AuthorDescending: - return ['fas', 'arrow-down-short-wide'] - case SORT_BY_VALUES.DateAddedOldest: - case SORT_BY_VALUES.VideoTitleAscending: - case SORT_BY_VALUES.AuthorAscending: - case SORT_BY_VALUES.Custom: - default: - return ['fas', 'arrow-up-wide-short'] - } - } }, watch: { $route () { @@ -571,6 +557,8 @@ export default defineComponent({ } }, + getIconForSortPreference: (s) => getIconForSortPreference(s), + ...mapActions([ 'updateSubscriptionDetails', 'updatePlaylist', diff --git a/src/renderer/views/Playlist/Playlist.vue b/src/renderer/views/Playlist/Playlist.vue index 23dd1c907d6eb..8cb3fc59273e0 100644 --- a/src/renderer/views/Playlist/Playlist.vue +++ b/src/renderer/views/Playlist/Playlist.vue @@ -50,7 +50,7 @@ :select-names="sortBySelectNames" :select-values="sortBySelectValues" :placeholder="$t('Playlist.Sort By.Sort By')" - :icon="sortIcon" + :icon="getIconForSortPreference(sortOrder)" @change="updateUserPlaylistSortOrder" />