From ef2e3ba5c42455a7ff42e1aa1f2e8dbcbbca4b2e Mon Sep 17 00:00:00 2001
From: Massedil <massedil-framagit.org@msd.im>
Date: Wed, 19 Feb 2025 19:37:26 +0100
Subject: [PATCH] Ensure InstanceFollowStatus is checked with equals and
 improve CSS.

Improves #1690
---
 src/views/Admin/InstanceView.vue | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/views/Admin/InstanceView.vue b/src/views/Admin/InstanceView.vue
index 397517318..5b19ea460 100644
--- a/src/views/Admin/InstanceView.vue
+++ b/src/views/Admin/InstanceView.vue
@@ -111,7 +111,7 @@
     <section>
       <div class="mt-3 grid xl:grid-cols-2 gap-4">
         <div
-          class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md"
+          class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md flex flex-col gap-2 justify-center"
           v-if="
             instance.hasRelay &&
             !['mastodon', 'peertube'].includes(
@@ -149,11 +149,14 @@
             {{ t("Follow instance") }}
           </button>
         </div>
-        <div v-else class="md:h-48 py-16 text-center opacity-50">
+        <div
+          v-else
+          class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md flex flex-col gap-2 justify-center"
+        >
           {{ t("Only instances with an application actor can be followed") }}
         </div>
         <div
-          class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md flex flex-col gap-2"
+          class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md flex flex-col gap-2 justify-center"
         >
           <button
             @click="
@@ -172,7 +175,10 @@
                 address: instance?.relayAddress,
               })
             "
-            v-if="instance.followerStatus != InstanceFollowStatus.NONE"
+            v-if="
+              instance.followerStatus == InstanceFollowStatus.PENDING ||
+              instance.followerStatus == InstanceFollowStatus.APPROVED
+            "
             class="bg-red-700 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 focus:ring-offset-gray-50 text-white hover:text-white font-semibold h-12 px-6 rounded-lg w-full flex items-center justify-center sm:w-auto"
           >
             {{ t("Reject follow") }}