From 2cb070c83c79f504e0c28c0292a3710ff4ff0918 Mon Sep 17 00:00:00 2001 From: TAKAHASHI Shuuji Date: Fri, 12 Apr 2024 18:38:43 +0900 Subject: [PATCH] feat: allow choosing favorite buttons in bottom navigation bar (#2761) --- components/nav/NavBottom.vue | 79 ++++++-------- components/nav/button/Explore.vue | 15 +++ components/nav/button/Federated.vue | 11 ++ components/nav/button/Home.vue | 11 ++ components/nav/button/Local.vue | 11 ++ components/nav/button/Mention.vue | 15 +++ components/nav/button/MoreMenu.vue | 19 ++++ components/nav/button/Notification.vue | 20 ++++ components/nav/button/Search.vue | 11 ++ components/settings/SettingsBottomNav.vue | 125 ++++++++++++++++++++++ composables/settings/definition.ts | 2 + constants/index.ts | 1 + locales/en.json | 4 + pages/settings/interface/index.vue | 9 ++ 14 files changed, 286 insertions(+), 47 deletions(-) create mode 100644 components/nav/button/Explore.vue create mode 100644 components/nav/button/Federated.vue create mode 100644 components/nav/button/Home.vue create mode 100644 components/nav/button/Local.vue create mode 100644 components/nav/button/Mention.vue create mode 100644 components/nav/button/MoreMenu.vue create mode 100644 components/nav/button/Notification.vue create mode 100644 components/nav/button/Search.vue create mode 100644 components/settings/SettingsBottomNav.vue diff --git a/components/nav/NavBottom.vue b/components/nav/NavBottom.vue index 96cce32c..145759cb 100644 --- a/components/nav/NavBottom.vue +++ b/components/nav/NavBottom.vue @@ -1,60 +1,45 @@ diff --git a/components/nav/button/Explore.vue b/components/nav/button/Explore.vue new file mode 100644 index 00000000..618daafd --- /dev/null +++ b/components/nav/button/Explore.vue @@ -0,0 +1,15 @@ + + + diff --git a/components/nav/button/Federated.vue b/components/nav/button/Federated.vue new file mode 100644 index 00000000..878a7370 --- /dev/null +++ b/components/nav/button/Federated.vue @@ -0,0 +1,11 @@ + + + diff --git a/components/nav/button/Home.vue b/components/nav/button/Home.vue new file mode 100644 index 00000000..08084481 --- /dev/null +++ b/components/nav/button/Home.vue @@ -0,0 +1,11 @@ + + + diff --git a/components/nav/button/Local.vue b/components/nav/button/Local.vue new file mode 100644 index 00000000..6d1d0a64 --- /dev/null +++ b/components/nav/button/Local.vue @@ -0,0 +1,11 @@ + + + diff --git a/components/nav/button/Mention.vue b/components/nav/button/Mention.vue new file mode 100644 index 00000000..ef530c80 --- /dev/null +++ b/components/nav/button/Mention.vue @@ -0,0 +1,15 @@ + + + diff --git a/components/nav/button/MoreMenu.vue b/components/nav/button/MoreMenu.vue new file mode 100644 index 00000000..75eb6716 --- /dev/null +++ b/components/nav/button/MoreMenu.vue @@ -0,0 +1,19 @@ + + + diff --git a/components/nav/button/Notification.vue b/components/nav/button/Notification.vue new file mode 100644 index 00000000..3e4aa5e7 --- /dev/null +++ b/components/nav/button/Notification.vue @@ -0,0 +1,20 @@ + + + diff --git a/components/nav/button/Search.vue b/components/nav/button/Search.vue new file mode 100644 index 00000000..94b2b79f --- /dev/null +++ b/components/nav/button/Search.vue @@ -0,0 +1,11 @@ + + + diff --git a/components/settings/SettingsBottomNav.vue b/components/settings/SettingsBottomNav.vue new file mode 100644 index 00000000..a457aaa4 --- /dev/null +++ b/components/settings/SettingsBottomNav.vue @@ -0,0 +1,125 @@ + + + diff --git a/composables/settings/definition.ts b/composables/settings/definition.ts index 54c7b9cc..c54c9736 100644 --- a/composables/settings/definition.ts +++ b/composables/settings/definition.ts @@ -7,6 +7,8 @@ export type OldFontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' export type ColorMode = 'light' | 'dark' | 'system' +export type NavButtonName = 'home' | 'search' | 'notification' | 'mention' | 'explore' | 'local' | 'federated' | 'moreMenu' + export interface PreferencesSettings { hideAltIndicatorOnPosts: boolean hideGifIndicatorOnPosts: boolean diff --git a/constants/index.ts b/constants/index.ts index ee4aa5c7..f573b673 100644 --- a/constants/index.ts +++ b/constants/index.ts @@ -24,6 +24,7 @@ export const STORAGE_KEY_NOTIFICATION_POLICY = 'elk-notification-policy' export const STORAGE_KEY_PWA_HIDE_INSTALL = 'elk-pwa-hide-install' export const STORAGE_KEY_LAST_ACCESSED_NOTIFICATION_ROUTE = 'elk-last-accessed-notification-route' export const STORAGE_KEY_LAST_ACCESSED_EXPLORE_ROUTE = 'elk-last-accessed-explore-route' +export const STORAGE_KEY_BOTTOM_NAV_BUTTONS = 'elk-bottom-nav-buttons' export const HANDLED_MASTO_URLS = /^(https?:\/\/)?([\w\d-]+\.)+\w+\/(@[@\w\d-\.]+)(\/objects)?(\/\d+)?$/ diff --git a/locales/en.json b/locales/en.json index 9a36b852..6415bacc 100644 --- a/locales/en.json +++ b/locales/en.json @@ -58,6 +58,7 @@ "boost": "Boost", "boost_count": "{0}", "boosted": "Boosted", + "clear": "Clear", "clear_publish_failed": "Clear publish errors", "clear_save_failed": "Clear save errors", "clear_upload_failed": "Clear file upload errors", @@ -316,6 +317,7 @@ "list": "List", "lists": "Lists", "local": "Local", + "more_menu": "More menu", "muted_users": "Muted users", "notifications": "Notifications", "privacy": "Privacy", @@ -450,6 +452,8 @@ "label": "Account settings" }, "interface": { + "bottom_nav": "Bottom Navigation", + "bottom_nav_instructions": "Choose your favorite navigation buttons up to five for the bottom navigation. Must include the \"More menu\" button.", "color_mode": "Color Mode", "dark_mode": "Dark", "default": " (default)", diff --git a/pages/settings/interface/index.vue b/pages/settings/interface/index.vue index 94ef7e97..bdee1667 100644 --- a/pages/settings/interface/index.vue +++ b/pages/settings/interface/index.vue @@ -30,6 +30,15 @@ useHydratedHead({

+
+

+ {{ $t('settings.interface.bottom_nav') }} +

+

+ {{ $t('settings.interface.bottom_nav_instructions') }} +

+ +