From 03e0ac72d2fb6ec06cc79acf27d8a052ca57014b Mon Sep 17 00:00:00 2001
From: codl <codl@codl.fr>
Date: Sun, 22 Apr 2018 20:06:54 +0200
Subject: [PATCH] add lists of follows and followers

---
 routes/_api/followsAndFollowers.js            | 14 +++++++++
 .../profile/AccountProfileDetails.html        | 30 +++++++++++--------
 .../accounts/[accountId]/followers.html       | 20 +++++++++++++
 .../_pages/accounts/[accountId]/follows.html  | 20 +++++++++++++
 routes/accounts/[accountId]/followers.html    | 21 +++++++++++++
 routes/accounts/[accountId]/follows.html      | 21 +++++++++++++
 6 files changed, 113 insertions(+), 13 deletions(-)
 create mode 100644 routes/_api/followsAndFollowers.js
 create mode 100644 routes/_pages/accounts/[accountId]/followers.html
 create mode 100644 routes/_pages/accounts/[accountId]/follows.html
 create mode 100644 routes/accounts/[accountId]/followers.html
 create mode 100644 routes/accounts/[accountId]/follows.html

diff --git a/routes/_api/followsAndFollowers.js b/routes/_api/followsAndFollowers.js
new file mode 100644
index 00000000..607e5cec
--- /dev/null
+++ b/routes/_api/followsAndFollowers.js
@@ -0,0 +1,14 @@
+import { getWithTimeout, paramsString } from '../_utils/ajax'
+import { auth, basename } from './utils'
+
+export async function getFollows (instanceName, accessToken, accountId, limit = 80) {
+  let url = `${basename(instanceName)}/api/v1/accounts/${accountId}/following`
+  url += '?' + paramsString({ limit })
+  return getWithTimeout(url, auth(accessToken))
+}
+
+export async function getFollowers (instanceName, accessToken, accountId, limit = 80) {
+  let url = `${basename(instanceName)}/api/v1/accounts/${accountId}/followers`
+  url += '?' + paramsString({ limit })
+  return getWithTimeout(url, auth(accessToken))
+}
diff --git a/routes/_components/profile/AccountProfileDetails.html b/routes/_components/profile/AccountProfileDetails.html
index 4a89b5bc..bf8d34a7 100644
--- a/routes/_components/profile/AccountProfileDetails.html
+++ b/routes/_components/profile/AccountProfileDetails.html
@@ -8,20 +8,24 @@
     </span>
   </div>
   <div class="account-profile-details-item">
-    <span class="account-profile-details-item-title">
-      Follows
-    </span>
-    <span class="account-profile-details-item-datum">
-      {{numFollowingDisplay}}
-    </span>
+    <a href='/accounts/{{account.id}}/follows'>
+      <span class="account-profile-details-item-title">
+        Follows
+      </span>
+      <span class="account-profile-details-item-datum">
+        {{numFollowingDisplay}}
+      </span>
+    </a>
   </div>
   <div class="account-profile-details-item">
-    <span class="account-profile-details-item-title">
-      Followers
-    </span>
-    <span class="account-profile-details-item-datum">
-      {{numFollowersDisplay}}
-    </span>
+    <a href='/accounts/{{account.id}}/followers'>
+      <span class="account-profile-details-item-title">
+        Followers
+      </span>
+      <span class="account-profile-details-item-datum">
+        {{numFollowersDisplay}}
+      </span>
+    </a>
   </div>
   <!-- TODO: re-enable this when we support profile editing -->
   {{#if account && verifyCredentials && account.id !== verifyCredentials.id}}
@@ -130,4 +134,4 @@
       IconButton
     }
   }
-</script>
\ No newline at end of file
+</script>
diff --git a/routes/_pages/accounts/[accountId]/followers.html b/routes/_pages/accounts/[accountId]/followers.html
new file mode 100644
index 00000000..f2f711d6
--- /dev/null
+++ b/routes/_pages/accounts/[accountId]/followers.html
@@ -0,0 +1,20 @@
+<DynamicPageBanner title="Followers" />
+<AccountsListPage :accountsFetcher />
+<script>
+  import { getFollowers } from '../../../_api/followsAndFollowers'
+  import AccountsListPage from '../../../_components/AccountsListPage.html'
+  import { store } from '../../../_store/store'
+  import DynamicPageBanner from '../../../_components/DynamicPageBanner.html'
+
+  export default {
+    computed: {
+      accountId: params => params.accountId,
+      accountsFetcher: ($currentInstance, $accessToken, accountId) => () => getFollowers($currentInstance, $accessToken, accountId)
+    },
+    store: () => store,
+    components: {
+      AccountsListPage,
+      DynamicPageBanner
+    }
+  }
+</script>
diff --git a/routes/_pages/accounts/[accountId]/follows.html b/routes/_pages/accounts/[accountId]/follows.html
new file mode 100644
index 00000000..d2a3151a
--- /dev/null
+++ b/routes/_pages/accounts/[accountId]/follows.html
@@ -0,0 +1,20 @@
+<DynamicPageBanner title="Follows" />
+<AccountsListPage :accountsFetcher />
+<script>
+  import { getFollows } from '../../../_api/followsAndFollowers'
+  import AccountsListPage from '../../../_components/AccountsListPage.html'
+  import { store } from '../../../_store/store'
+  import DynamicPageBanner from '../../../_components/DynamicPageBanner.html'
+
+  export default {
+    computed: {
+      accountId: params => params.accountId,
+      accountsFetcher: ($currentInstance, $accessToken, accountId) => () => getFollows($currentInstance, $accessToken, accountId)
+    },
+    store: () => store,
+    components: {
+      AccountsListPage,
+      DynamicPageBanner
+    }
+  }
+</script>
diff --git a/routes/accounts/[accountId]/followers.html b/routes/accounts/[accountId]/followers.html
new file mode 100644
index 00000000..b6a155e9
--- /dev/null
+++ b/routes/accounts/[accountId]/followers.html
@@ -0,0 +1,21 @@
+<:Head>
+  <title>Pinafore – Followers</title>
+</:Head>
+<Layout page='tags'>
+  <LazyPage :pageComponent :params />
+</Layout>
+<script>
+  import Layout from '../../_components/Layout.html'
+  import LazyPage from '../../_components/LazyPage.html'
+  import pageComponent from '../../_pages/accounts/[accountId]/followers.html'
+
+  export default {
+    components: {
+      Layout,
+      LazyPage
+    },
+    data: () => ({
+      pageComponent
+    })
+  }
+</script>
diff --git a/routes/accounts/[accountId]/follows.html b/routes/accounts/[accountId]/follows.html
new file mode 100644
index 00000000..214488c3
--- /dev/null
+++ b/routes/accounts/[accountId]/follows.html
@@ -0,0 +1,21 @@
+<:Head>
+  <title>Pinafore – Follows</title>
+</:Head>
+<Layout page='tags'>
+  <LazyPage :pageComponent :params />
+</Layout>
+<script>
+  import Layout from '../../_components/Layout.html'
+  import LazyPage from '../../_components/LazyPage.html'
+  import pageComponent from '../../_pages/accounts/[accountId]/follows.html'
+
+  export default {
+    components: {
+      Layout,
+      LazyPage
+    },
+    data: () => ({
+      pageComponent
+    })
+  }
+</script>