zelo72
/
mastodon
mirror of https://github.com/mastodon/mastodon
2
2
Fork 1
Code Issues 12 Releases Wiki Activity

Add button to clear all recent searches 

This reimplements the changes from #27318 rebased to the latest icons and code

Co-authored-by: Hugh Rawlinson <hughr2005@gmail.com>
This commit is contained in:
Emelia Smith 2025-01-07 21:09:50 +01:00
parent b3243ef41c
commit 095f36f374
No known key found for this signature in database
3 changed files with 31 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
app/javascript/mastodon/features/compose/components/search.tsx
View File

@ -33,6 +33,10 @@ const messages = defineMessages({
id: 'search.search_or_paste', id: 'search.search_or_paste',
defaultMessage: 'Search or paste URL', defaultMessage: 'Search or paste URL',
}, },
clearAllRecent: {
id: 'search.clear_all_recent',
defaultMessage: 'Clear all recent searches',
},
}); });
const labelForRecentSearch = (search: RecentSearch) => { const labelForRecentSearch = (search: RecentSearch) => {
@ -225,6 +229,17 @@ export const Search: React.FC<{
}, },
})); }));
const forgetAll = useCallback(
(e: React.MouseEvent) => {
e.preventDefault();
e.stopPropagation();
recent.forEach((search) => {
void dispatch(forgetSearchResult(search.q));
});
},
[dispatch, recent],
);
const navigableOptions = hasValue const navigableOptions = hasValue
? quickActions.concat(searchOptions) ? quickActions.concat(searchOptions)
: recentOptions.concat(quickActions, searchOptions); : recentOptions.concat(quickActions, searchOptions);
@ -451,6 +466,18 @@ export const Search: React.FC<{
setSelectedOption(-1); setSelectedOption(-1);
}, [setExpanded, setSelectedOption]); }, [setExpanded, setSelectedOption]);
const clearAllRecentButton =
recentOptions.length === 0 ? null : (
<button
className='icon-button'
onMouseDown={forgetAll}
aria-label={intl.formatMessage(messages.clearAllRecent)}
title={intl.formatMessage(messages.clearAllRecent)}
>
<Icon id='times' icon={CloseIcon} />
</button>
);
return ( return (
<form className={classNames('search', { active: expanded })}> <form className={classNames('search', { active: expanded })}>
<input <input
@ -492,6 +519,7 @@ export const Search: React.FC<{
id='search_popout.recent' id='search_popout.recent'
defaultMessage='Recent searches' defaultMessage='Recent searches'
/> />
{clearAllRecentButton}
</h4> </h4>
<div className='search__popout__menu'> <div className='search__popout__menu'>

1
app/javascript/mastodon/locales/en.json
View File

@ -762,6 +762,7 @@
"report_notification.categories.violation": "Rule violation", "report_notification.categories.violation": "Rule violation",
"report_notification.categories.violation_sentence": "rule violation", "report_notification.categories.violation_sentence": "rule violation",
"report_notification.open": "Open report", "report_notification.open": "Open report",
"search.clear_all_recent": "Clear all recent searches",
"search.no_recent_searches": "No recent searches", "search.no_recent_searches": "No recent searches",
"search.placeholder": "Search", "search.placeholder": "Search",
"search.quick_action.account_search": "Profiles matching {x}", "search.quick_action.account_search": "Profiles matching {x}",

2
app/javascript/styles/mastodon/components.scss
View File

@ -5328,6 +5328,8 @@ a.status-card {
font-weight: 500; font-weight: 500;
padding: 0 10px; padding: 0 10px;
margin-bottom: 10px; margin-bottom: 10px;
display: flex;
justify-content: space-between;
} }
.icon-button { .icon-button {