diff --git a/src/boot/routes.js b/src/boot/routes.js
index 7e54a98b..1a179099 100644
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@@ -3,7 +3,7 @@ import PublicAndExternalTimeline from 'components/public_and_external_timeline/p
import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue'
import TagTimeline from 'components/tag_timeline/tag_timeline.vue'
import ConversationPage from 'components/conversation-page/conversation-page.vue'
-import Mentions from 'components/mentions/mentions.vue'
+import Interactions from 'components/interactions/interactions.vue'
import DMs from 'components/dm_timeline/dm_timeline.vue'
import UserProfile from 'components/user_profile/user_profile.vue'
import Settings from 'components/settings/settings.vue'
@@ -34,7 +34,7 @@ export default (store) => {
{ name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
{ name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } },
{ name: 'external-user-profile', path: '/users/:id', component: UserProfile },
- { name: 'mentions', path: '/users/:username/mentions', component: Mentions },
+ { name: 'interactions', path: '/users/:username/interactions', component: Interactions },
{ name: 'dms', path: '/users/:username/dms', component: DMs },
{ name: 'settings', path: '/settings', component: Settings },
{ name: 'registration', path: '/registration', component: Registration },
diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js
new file mode 100644
index 00000000..d4e3cc17
--- /dev/null
+++ b/src/components/interactions/interactions.js
@@ -0,0 +1,25 @@
+import Notifications from '../notifications/notifications.vue'
+
+const tabModeDict = {
+ mentions: ['mention'],
+ 'likes+repeats': ['repeat', 'like'],
+ follows: ['follow']
+}
+
+const Interactions = {
+ data () {
+ return {
+ filterMode: tabModeDict['mentions']
+ }
+ },
+ methods: {
+ onModeSwitch (index, dataset) {
+ this.filterMode = tabModeDict[dataset.filter]
+ }
+ },
+ components: {
+ Notifications
+ }
+}
+
+export default Interactions
diff --git a/src/components/interactions/interactions.vue b/src/components/interactions/interactions.vue
new file mode 100644
index 00000000..5a204ca7
--- /dev/null
+++ b/src/components/interactions/interactions.vue
@@ -0,0 +1,25 @@
+
+
+
+
+
diff --git a/src/components/mentions/mentions.vue b/src/components/mentions/mentions.vue
index bba06da6..6b4e96e0 100644
--- a/src/components/mentions/mentions.vue
+++ b/src/components/mentions/mentions.vue
@@ -1,5 +1,5 @@
-
+
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index 7a7212fb..e6e0f074 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -8,8 +8,8 @@
-
- {{ $t("nav.mentions") }}
+
+ {{ $t("nav.interactions") }}
diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js
index 5b13b98e..8c97eb04 100644
--- a/src/components/notifications/notifications.js
+++ b/src/components/notifications/notifications.js
@@ -7,15 +7,24 @@ import {
} from '../../services/notification_utils/notification_utils.js'
const Notifications = {
- props: [
- 'noHeading'
- ],
+ props: {
+ // Disables display of panel header
+ noHeading: Boolean,
+ // Disables panel styles, unread mark, potentially other notification-related actions
+ // meant for "Interactions" timeline
+ minimalMode: Boolean,
+ // Custom filter mode, an array of strings, possible values 'mention', 'repeat', 'like', 'follow', used to override global filter for use in "Interactions" timeline
+ filterMode: Array
+ },
data () {
return {
bottomedOut: false
}
},
computed: {
+ mainClass () {
+ return this.minimalMode ? '' : 'panel panel-default'
+ },
notifications () {
return notificationsFromStore(this.$store)
},
@@ -26,7 +35,8 @@ const Notifications = {
return unseenNotificationsFromStore(this.$store)
},
visibleNotifications () {
- return visibleNotificationsFromStore(this.$store)
+ console.log(this.filterMode)
+ return visibleNotificationsFromStore(this.$store, this.filterMode)
},
unseenCount () {
return this.unseenNotifications.length
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index c0b458cc..622d12f4 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -1,8 +1,10 @@
@import '../../_variables.scss';
.notifications {
- // a bit of a hack to allow scrolling below notifications
- padding-bottom: 15em;
+ &:not(.minimal) {
+ // a bit of a hack to allow scrolling below notifications
+ padding-bottom: 15em;
+ }
.loadmore-error {
color: $fallback--text;
diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue
index 88775be1..c71499b2 100644
--- a/src/components/notifications/notifications.vue
+++ b/src/components/notifications/notifications.vue
@@ -1,6 +1,6 @@
-
-
+
+
{{$t('notifications.notifications')}}
@@ -12,7 +12,7 @@
-
+
@@ -22,7 +22,9 @@
{{$t('notifications.no_more_notifications')}}
-
+