update with develop

src/boot/routes.js

@@ -20,6 +20,7 @@ import ChatPanel from 'components/chat_panel/chat_panel.vue'
 import WhoToFollow from 'components/who_to_follow/who_to_follow.vue'
 import About from 'components/about/about.vue'
 import RemoteUserResolver from 'components/remote_user_resolver/remote_user_resolver.vue'
+import Lists from 'components/lists/lists.vue'
 
 export default (store) => {
   const validateAuthenticatedRoute = (to, from, next) => {
@@ -69,6 +70,7 @@ export default (store) => {
     { name: 'search', path: '/search', component: Search, props: (route) => ({ query: route.query.query }) },
     { name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow, beforeEnter: validateAuthenticatedRoute },
     { name: 'about', path: '/about', component: About },
+    { name: 'lists', path: '/lists', component: Lists, beforeEnter: validateAuthenticatedRoute },
     { name: 'user-profile', path: '/(users/)?:name', component: UserProfile }
   ]
 

src/components/lists/lists.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="Lists panel panel-default">
+    <div class="panel-heading">
+      <TimelineMenu />
+    </div>
+    <div
+      v-for="list in lists"
+      :key="list.id"
+    >
+      {{ list.title }}
+    </div>
+    <div
+      v-if="lists.length === 0"
+      class="list-empty-content faint"
+    >
+      No lists
+    </div>
+  </div>
+</template>
+
+<script>
+import TimelineMenu from '../timeline_menu/timeline_menu.vue'
+
+export default {
+  components: {
+    TimelineMenu
+  },
+  data () {
+    return {
+      lists: [{ title: 'ASD', id: '1' }, { title: 'ASD2', id: '2' }]
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+@import '../../_variables.scss';
+
+.Lists {
+  height: 10em;
+}
+</style>

src/components/timeline_menu/timeline_menu.js

@@ -27,7 +27,9 @@ export const timelineNames = () => {
     'bookmarks': 'nav.bookmarks',
     'dms': 'nav.dms',
     'public-timeline': 'nav.public_tl',
-    'public-external-timeline': 'nav.twkn'
+    'public-external-timeline': 'nav.twkn',
+    'lists': 'nav.lists',
+    'tag-timeline': 'tag'
   }
 }
 

src/components/timeline_menu/timeline_menu.vue

@@ -59,6 +59,15 @@
             />{{ $t("nav.twkn") }}
           </router-link>
         </li>
+        <li v-if="currentUser">
+          <router-link :to="{ name: 'lists' }">
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding "
+              icon="globe"
+            />{{ $t("nav.lists") }}
+          </router-link>
+        </li>
       </ul>
     </div>
     <div

src/i18n/en.json

@@ -131,7 +131,8 @@
     "who_to_follow": "Who to follow",
     "preferences": "Preferences",
     "timelines": "Timelines",
-    "chats": "Chats"
+    "chats": "Chats",
+    "lists": "Lists"
   },
   "notifications": {
     "broken_favorite": "Unknown status, searching for it…",

src/services/api/api.service.js

@@ -79,6 +79,9 @@ const MASTODON_USER_SEARCH_URL = '/api/v1/accounts/search'
 const MASTODON_DOMAIN_BLOCKS_URL = '/api/v1/domain_blocks'
 const MASTODON_STREAMING = '/api/v1/streaming'
 const MASTODON_KNOWN_DOMAIN_LIST_URL = '/api/v1/instance/peers'
+const MASTODON_LISTS_URL = '/api/v1/lists'
+const MASTODON_LIST_URL = id => `/api/v1/lists/${id}`
+const MASTODON_LIST_ACCOUNTS_URL = id => `/api/v1/lists/${id}/accounts`
 const PLEROMA_EMOJI_REACTIONS_URL = id => `/api/v1/pleroma/statuses/${id}/reactions`
 const PLEROMA_EMOJI_REACT_URL = (id, emoji) => `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
 const PLEROMA_EMOJI_UNREACT_URL = (id, emoji) => `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
@@ -1262,6 +1265,77 @@ const deleteChatMessage = ({ chatId, messageId, credentials }) => {
   })
 }
 
+const lists = ({ credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LISTS_URL,
+    method: 'GET',
+    credentials
+  })
+}
+
+const list = ({ listId, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LIST_URL(listId),
+    method: 'GET',
+    credentials
+  })
+}
+
+const createList = ({ title, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LISTS_URL,
+    method: 'POST',
+    payload: { title },
+    credentials
+  })
+}
+
+const updateList = ({ title, listId, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LIST_URL(listId),
+    method: 'PUT',
+    payload: { title },
+    credentials
+  })
+}
+
+const deleteList = ({ listId, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LIST_URL(listId),
+    method: 'DELETE',
+    credentials
+  })
+}
+
+const listUsers = ({ listId, credentials }) => {
+  // TODO: pagination
+  return promisedRequest({
+    url: MASTODON_LIST_ACCOUNTS_URL(listId),
+    method: 'GET',
+    credentials
+  })
+    .then(data => data.json())
+    .then(response => response.map(u => parseUser(u)))
+}
+
+const addUsersToList = ({ listId, userIds, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LIST_ACCOUNTS_URL(listId),
+    method: 'POST',
+    payload: { 'account_ids': userIds },
+    credentials
+  })
+}
+
+const removeUsersFromList = ({ listId, userIds, credentials }) => {
+  return promisedRequest({
+    url: MASTODON_LIST_ACCOUNTS_URL(listId),
+    method: 'DELETE',
+    payload: { 'account_ids': userIds },
+    credentials
+  })
+}
+
 const apiService = {
   verifyCredentials,
   fetchTimeline,
@@ -1347,7 +1421,15 @@ const apiService = {
   chatMessages,
   sendChatMessage,
   readChat,
-  deleteChatMessage
+  deleteChatMessage,
+  lists,
+  list,
+  createList,
+  updateList,
+  deleteList,
+  listUsers,
+  addUsersToList,
+  removeUsersFromList
 }
 
 export default apiService