From 6c2941dba04ca3454251c8ad04cafc40ff4900e8 Mon Sep 17 00:00:00 2001 From: Roger Braun Date: Sat, 26 Nov 2016 21:09:41 +0100 Subject: [PATCH] Basic mention support. I still have to think about how to integrate them in the state system... --- src/components/mentions/mentions.js | 28 +++++++++++++++++++ src/components/mentions/mentions.vue | 12 ++++++++ src/components/nav_panel/nav_panel.js | 2 +- src/components/nav_panel/nav_panel.vue | 7 ++++- src/main.js | 4 ++- src/modules/statuses.js | 2 +- src/services/api/api.service.js | 8 ++++++ .../backend_interactor_service.js | 5 ++++ 8 files changed, 64 insertions(+), 4 deletions(-) create mode 100644 src/components/mentions/mentions.js create mode 100644 src/components/mentions/mentions.vue diff --git a/src/components/mentions/mentions.js b/src/components/mentions/mentions.js new file mode 100644 index 0000000000..3563101bb2 --- /dev/null +++ b/src/components/mentions/mentions.js @@ -0,0 +1,28 @@ +import Status from '../status/status.vue' +// Temporary +import { prepareStatus, updateTimestampsInStatuses } from '../../modules/statuses.js' +import { map } from 'lodash' + +const Mentions = { + data () { + return { + mentions: [] + } + }, + computed: { + username () { + return this.$route.params.username + } + }, + components: { + Status + }, + created () { + this.$store.state.api.backendInteractor.fetchMentions({username: this.username}) + .then((mentions) => { + this.mentions = updateTimestampsInStatuses(map(mentions, prepareStatus)) + }) + } +} + +export default Mentions diff --git a/src/components/mentions/mentions.vue b/src/components/mentions/mentions.vue new file mode 100644 index 0000000000..a760719c40 --- /dev/null +++ b/src/components/mentions/mentions.vue @@ -0,0 +1,12 @@ + + + diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js index c2373a26c0..baeaaede29 100644 --- a/src/components/nav_panel/nav_panel.js +++ b/src/components/nav_panel/nav_panel.js @@ -1,6 +1,6 @@ const NavPanel = { computed: { - loggedIn () { + currentUser () { return this.$store.state.users.currentUser } } diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue index f463ef95c1..b709d9140b 100644 --- a/src/components/nav_panel/nav_panel.vue +++ b/src/components/nav_panel/nav_panel.vue @@ -2,11 +2,16 @@
    -
  • +
  • Timeline
    • +
  • + + Mentions + +
  • Public Timeline diff --git a/src/main.js b/src/main.js index eb1ad9b285..9196c5f6a2 100644 --- a/src/main.js +++ b/src/main.js @@ -6,6 +6,7 @@ import PublicTimeline from './components/public_timeline/public_timeline.vue' import PublicAndExternalTimeline from './components/public_and_external_timeline/public_and_external_timeline.vue' import FriendsTimeline from './components/friends_timeline/friends_timeline.vue' import Conversation from './components/conversation/conversation.vue' +import Mentions from './components/mentions/mentions.vue' import statusesModule from './modules/statuses.js' import usersModule from './modules/users.js' @@ -27,7 +28,8 @@ const routes = [ { path: '/main/all', component: PublicAndExternalTimeline }, { path: '/main/public', component: PublicTimeline }, { path: '/main/friends', component: FriendsTimeline }, - { name: 'conversation', path: '/notice/:id', component: Conversation } + { name: 'conversation', path: '/notice/:id', component: Conversation }, + { name: 'mentions', path: '/:username/mentions', component: Mentions } ] const router = new VueRouter({ diff --git a/src/modules/statuses.js b/src/modules/statuses.js index 37115506b4..fee475588f 100644 --- a/src/modules/statuses.js +++ b/src/modules/statuses.js @@ -52,7 +52,7 @@ export const prepareStatus = (status) => { return status } -const updateTimestampsInStatuses = (statuses) => { +export const updateTimestampsInStatuses = (statuses) => { return map(statuses, (statusoid) => { const status = statusoid.retweeted_status || statusoid diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js index 7757dd88f9..0dea2d4697 100644 --- a/src/services/api/api.service.js +++ b/src/services/api/api.service.js @@ -10,6 +10,7 @@ const STATUS_UPDATE_URL = '/api/statuses/update.json' const STATUS_URL = '/api/statuses/show' const MEDIA_UPLOAD_URL = '/api/statusnet/media/upload' const CONVERSATION_URL = '/api/statusnet/conversation' +const MENTIONS_URL = '/api/statuses/mentions.json' const oldfetch = window.fetch @@ -27,6 +28,12 @@ const authHeaders = (user) => { } } +const fetchMentions = ({username, sinceId = 0, credentials}) => { + let url = `${MENTIONS_URL}?since_id=${sinceId}&screen_name=${username}` + return fetch(url, { headers: authHeaders(credentials) }) + .then((data) => data.json()) +} + const fetchConversation = ({id, credentials}) => { let url = `${CONVERSATION_URL}/${id}.json?count=100` return fetch(url, { headers: authHeaders(credentials) }) @@ -120,6 +127,7 @@ const apiService = { fetchTimeline, fetchConversation, fetchStatus, + fetchMentions, favorite, unfavorite, retweet, diff --git a/src/services/backend_interactor_service/backend_interactor_service.js b/src/services/backend_interactor_service/backend_interactor_service.js index d7dcb1cc0b..eff085ae3c 100644 --- a/src/services/backend_interactor_service/backend_interactor_service.js +++ b/src/services/backend_interactor_service/backend_interactor_service.js @@ -9,9 +9,14 @@ const backendInteractorService = (credentials) => { return apiService.fetchConversation({id, credentials}) } + const fetchMentions = ({sinceId, username}) => { + return apiService.fetchMentions({sinceId, username, credentials}) + } + const backendInteractorServiceInstance = { fetchStatus, fetchConversation, + fetchMentions, verifyCredentials: apiService.verifyCredentials }