diff --git a/src/components/columns.jsx b/src/components/columns.jsx index 1c8c64a3..47036dce 100644 --- a/src/components/columns.jsx +++ b/src/components/columns.jsx @@ -9,6 +9,7 @@ import List from '../pages/list'; import Mentions from '../pages/mentions'; import Notifications from '../pages/notifications'; import Public from '../pages/public'; +import Search from '../pages/search'; import Trending from '../pages/trending'; import states from '../utils/states'; import useTitle from '../utils/useTitle'; @@ -33,8 +34,11 @@ function Columns() { hashtag: Hashtag, mentions: Mentions, trending: Trending, + search: Search, }[type]; if (!Component) return null; + // Don't show Search column with no query, for now + if (type === 'search' && !params.query) return null; return ( ); diff --git a/src/components/shortcuts-settings.css b/src/components/shortcuts-settings.css index 1c9aa7b1..1f4b5e00 100644 --- a/src/components/shortcuts-settings.css +++ b/src/components/shortcuts-settings.css @@ -123,6 +123,11 @@ min-width: 0; max-width: 320px; } +#shortcut-settings-form .form-note { + display: flex; + gap: 6px; + align-items: center; +} #shortcut-settings-form form footer { display: flex; gap: 16px; diff --git a/src/components/shortcuts-settings.jsx b/src/components/shortcuts-settings.jsx index ae4b0f74..5578f319 100644 --- a/src/components/shortcuts-settings.jsx +++ b/src/components/shortcuts-settings.jsx @@ -32,12 +32,12 @@ const TYPES = [ 'list', 'public', 'trending', - // NOTE: Hide for now - // 'search', // Search on Mastodon ain't great - // 'account-statuses', // Need @acct search first + 'search', 'hashtag', 'bookmarks', 'favourites', + // NOTE: Hide for now + // 'account-statuses', // Need @acct search first ]; const TYPE_TEXT = { following: 'Home / Following', @@ -87,6 +87,8 @@ const TYPE_PARAMS = { text: 'Search term', name: 'query', type: 'text', + placeholder: 'Optional, unless for multi-column mode', + notRequired: true, }, ], 'account-statuses': [ @@ -168,9 +170,11 @@ export const SHORTCUTS_META = { }, search: { id: 'search', - title: ({ query }) => query, - path: ({ query }) => `/search?q=${query}`, + title: ({ query }) => (query ? `"${query}"` : 'Search'), + path: ({ query }) => + query ? `/search?q=${query}&type=statuses` : '/search', icon: 'search', + excludeViewMode: ({ query }) => (!query ? ['multi-column'] : []), }, 'account-statuses': { id: 'account-statuses', @@ -279,7 +283,8 @@ function ShortcutsSettings({ onClose }) { const key = Object.values(shortcut).join('-'); const { type } = shortcut; if (!SHORTCUTS_META[type]) return null; - let { icon, title, subtitle } = SHORTCUTS_META[type]; + let { icon, title, subtitle, excludeViewMode } = + SHORTCUTS_META[type]; if (typeof title === 'function') { title = title(shortcut, i); } @@ -289,6 +294,12 @@ function ShortcutsSettings({ onClose }) { if (typeof icon === 'function') { icon = icon(shortcut, i); } + if (typeof excludeViewMode === 'function') { + excludeViewMode = excludeViewMode(shortcut, i); + } + const excludedViewMode = excludeViewMode?.includes( + snapStates.settings.shortcutsViewMode, + ); return (
  • @@ -300,6 +311,11 @@ function ShortcutsSettings({ onClose }) { {subtitle} )} + {excludedViewMode && ( + + Not available in current view mode + + )} +
    - {!!q && ( + {!!q && !columnMode && (