From 3769176eaa45dfb9e995e7757d8c2c1235ba7f54 Mon Sep 17 00:00:00 2001
From: patak <583075+patak-dev@users.noreply.github.com>
Date: Sat, 24 Feb 2024 15:46:54 +0100
Subject: [PATCH] feat: . shortcut to show new items (#2612)

---
 components/magickeys/MagickeysKeyboardShortcuts.vue | 4 ++++
 components/notification/NotificationPaginator.vue   | 2 +-
 components/timeline/TimelinePaginator.vue           | 2 +-
 locales/en.json                                     | 1 +
 locales/es.json                                     | 1 +
 plugins/magic-keys.client.ts                        | 8 ++++++++
 6 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/components/magickeys/MagickeysKeyboardShortcuts.vue b/components/magickeys/MagickeysKeyboardShortcuts.vue
index d221959e11..51547d616b 100644
--- a/components/magickeys/MagickeysKeyboardShortcuts.vue
+++ b/components/magickeys/MagickeysKeyboardShortcuts.vue
@@ -65,6 +65,10 @@ const shortcutItemGroups = computed<ShortcutItemGroup[]>(() => [
         description: t('magic_keys.groups.actions.compose'),
         shortcut: { keys: ['c'], isSequence: false },
       },
+      {
+        description: t('magic_keys.groups.actions.show_new_items'),
+        shortcut: { keys: ['.'], isSequence: false },
+      },
       {
         description: t('magic_keys.groups.actions.favourite'),
         shortcut: { keys: ['f'], isSequence: false },
diff --git a/components/notification/NotificationPaginator.vue b/components/notification/NotificationPaginator.vue
index 27de5eb28d..63ed410b22 100644
--- a/components/notification/NotificationPaginator.vue
+++ b/components/notification/NotificationPaginator.vue
@@ -174,7 +174,7 @@ const { formatNumber } = useHumanReadableNumber()
     :virtualScroller="virtualScroller"
   >
     <template #updater="{ number, update }">
-      <button py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="() => { update(); clearNotifications() }">
+      <button id="elk_show_new_items" py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="() => { update(); clearNotifications() }">
         {{ $t('timeline.show_new_items', number, { named: { v: formatNumber(number) } }) }}
       </button>
     </template>
diff --git a/components/timeline/TimelinePaginator.vue b/components/timeline/TimelinePaginator.vue
index 6d6feed91c..b24830e04e 100644
--- a/components/timeline/TimelinePaginator.vue
+++ b/components/timeline/TimelinePaginator.vue
@@ -25,7 +25,7 @@ const showOriginSite = computed(() =>
 <template>
   <CommonPaginator v-bind="{ paginator, stream, preprocess, buffer, endMessage }" :virtual-scroller="virtualScroller">
     <template #updater="{ number, update }">
-      <button py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="update">
+      <button id="elk_show_new_items" py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="update">
         {{ $t('timeline.show_new_items', number, { named: { v: formatNumber(number) } }) }}
       </button>
     </template>
diff --git a/locales/en.json b/locales/en.json
index 4f08ae9074..0b0b62329f 100644
--- a/locales/en.json
+++ b/locales/en.json
@@ -228,6 +228,7 @@
         "compose": "Compose",
         "favourite": "Favourite",
         "search": "Search",
+        "show_new_items": "Show new items",
         "title": "Actions"
       },
       "media": {
diff --git a/locales/es.json b/locales/es.json
index 399174cb1d..a27012c2df 100644
--- a/locales/es.json
+++ b/locales/es.json
@@ -228,6 +228,7 @@
         "compose": "Redactar",
         "favourite": "Favorito",
         "search": "Búsqueda",
+        "show_new_items": "Mostrar nuevas publicaciones",
         "title": "Acciones"
       },
       "media": {
diff --git a/plugins/magic-keys.client.ts b/plugins/magic-keys.client.ts
index a790bf6463..00f84ae458 100644
--- a/plugins/magic-keys.client.ts
+++ b/plugins/magic-keys.client.ts
@@ -55,4 +55,12 @@ export default defineNuxtPlugin(({ $scrollToTop }) => {
       ?.click()
   }
   whenever(logicAnd(isAuthenticated, notUsingInput, keys.b), toggleBoostActiveStatus)
+
+  const showNewItems = () => {
+    // TODO: find a better solution than clicking buttons...
+    document
+      ?.querySelector<HTMLElement>('button#elk_show_new_items')
+      ?.click()
+  }
+  whenever(logicAnd(isAuthenticated, notUsingInput, keys['.']), showNewItems)
 })