From a71f66dcbd07e54e0244bdab3e0d0206d23c1db7 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Tue, 3 Jan 2023 13:25:55 +0800
Subject: [PATCH] Handle locked accounts

---
 src/components/account.jsx | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/account.jsx b/src/components/account.jsx
index 831e93c2..075421fb 100644
--- a/src/components/account.jsx
+++ b/src/components/account.jsx
@@ -197,17 +197,19 @@ function Account({ account }) {
               {relationshipUIState !== 'loading' && relationship && (
                 <button
                   type="button"
-                  class={`${following ? 'light' : ''} swap`}
-                  data-swap-state={following ? 'danger' : ''}
+                  class={`${following || requested ? 'light swap' : ''}`}
+                  data-swap-state={following || requested ? 'danger' : ''}
                   disabled={relationshipUIState === 'loading'}
                   onClick={() => {
                     setRelationshipUIState('loading');
                     (async () => {
                       try {
                         let newRelationship;
-                        if (following) {
+                        if (following || requested) {
                           const yes = confirm(
-                            'Are you sure that you want to unfollow this account?',
+                            requested
+                              ? 'Are you sure that you want to withdraw follow request?'
+                              : 'Are you sure that you want to unfollow this account?',
                           );
                           if (yes) {
                             newRelationship = await masto.v1.accounts.unfollow(
@@ -231,10 +233,18 @@ function Account({ account }) {
                       <span>Following</span>
                       <span>Unfollow…</span>
                     </>
+                  ) : requested ? (
+                    <>
+                      <span>Requested</span>
+                      <span>Withdraw…</span>
+                    </>
+                  ) : locked ? (
+                    <>
+                      <Icon icon="lock" /> <span>Follow</span>
+                    </>
                   ) : (
                     'Follow'
                   )}
-                  {/* {following ? 'Unfollow…' : 'Follow'} */}
                 </button>
               )}
             </p>