From 91d2263d2ba5fa7956544328a7ca1f72168f327a Mon Sep 17 00:00:00 2001
From: Frank Nguyen <41023671+FrankreedX@users.noreply.github.com>
Date: Fri, 16 Aug 2024 11:12:14 +0700
Subject: [PATCH] added spinner for promote/demote (#319)

---
 app/content/team/users/[user]/index.js | 25 +++++++++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/app/content/team/users/[user]/index.js b/app/content/team/users/[user]/index.js
index 4d934265..a06d86c6 100644
--- a/app/content/team/users/[user]/index.js
+++ b/app/content/team/users/[user]/index.js
@@ -3,7 +3,14 @@ import { useLocalSearchParams, useNavigation } from "expo-router";
 import { doc, setDoc, updateDoc } from "firebase/firestore";
 import { useState } from "react";
 import { FlatList, View } from "react-native";
-import { Appbar, Divider, Menu, SegmentedButtons } from "react-native-paper";
+import {
+  ActivityIndicator,
+  Appbar,
+  Divider,
+  Menu,
+  SegmentedButtons,
+  Text,
+} from "react-native-paper";
 import { SafeAreaView } from "react-native-safe-area-context";
 import { themeColors } from "~/Constants";
 import { getErrorString } from "~/Utility";
@@ -71,6 +78,8 @@ function Index() {
   const hideBanDialog = () => setBanDialogVisible(false);
   const [banLoading, setBanLoading] = useState(false);
 
+  const [promoteLoading, setPromoteLoading] = useState(false);
+
   const { showDialog, showSnackBar } = useAlertContext();
 
   const { currentUserId, currentTeamId } = useAuthContext();
@@ -246,6 +255,7 @@ function Index() {
                 }
                 onPress={async () => {
                   try {
+                    setPromoteLoading(true);
                     await changeRole(
                       currentTeamId,
                       userId,
@@ -258,8 +268,19 @@ function Index() {
                     console.log(e);
                     showDialog("Error", getErrorString(e));
                   }
+                  setPromoteLoading(false);
                 }}
-                title={userInfo.role === "player" ? "Promote" : "Demote"}
+                title={
+                  <>
+                    {promoteLoading ? (
+                      <ActivityIndicator color={"#1C1B1F"} />
+                    ) : (
+                      <Text>
+                        {userInfo.role === "player" ? "Promote" : "Demote"}
+                      </Text>
+                    )}
+                  </>
+                }
               />
               <Divider />
               <Menu.Item