From 90027268dd3d8f780e85c83f37b3e39a8e3af4b6 Mon Sep 17 00:00:00 2001
From: Samuel <samuel@gewis.nl>
Date: Mon, 10 Feb 2025 19:29:06 +0100
Subject: [PATCH] fix(dashboard): payout create form hiding users with positive
 balance (#502)

---
 apps/dashboard/src/components/FindUser.vue    | 31 ++++++++++++-------
 .../payout/forms/PayoutCreateForm.vue         |  1 +
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/apps/dashboard/src/components/FindUser.vue b/apps/dashboard/src/components/FindUser.vue
index 22d317eb..466cc0c7 100644
--- a/apps/dashboard/src/components/FindUser.vue
+++ b/apps/dashboard/src/components/FindUser.vue
@@ -12,7 +12,7 @@
       @filter="filterUsers"
   >
   <template #option="slotProps" >
-    <span :class="{'text-gray-500': !isNegative(slotProps.option)}">
+    <span :class="{'text-gray-500': isNegative(slotProps.option) === true}">
       {{ slotProps.option.fullName }} {{ slotProps.option.gewisId ? `(${slotProps.option.gewisId})` : '' }}
     </span>
   </template>
@@ -66,6 +66,19 @@ const userStore = useUserStore();
 const loading = ref(false);
 const users: Ref<(BaseUserResponse & { fullName: string })[]> = ref([]);
 
+const compareBalance = (a: BaseUserResponse, b: BaseUserResponse) => {
+  const isANegative = isNegative(a);
+  const isBNegative = isNegative(b);
+
+  if (isANegative && !isBNegative) {
+    return -1;
+  }
+  if (!isANegative && isBNegative) {
+    return 1;
+  }
+  return 0;
+};
+
 const transformUsers = (userData: BaseUserResponse[]) => {
   const usersData: (BaseUserResponse & { fullName: string})[]
       = userData.map((user) => ({
@@ -74,18 +87,12 @@ const transformUsers = (userData: BaseUserResponse[]) => {
   }));
 
   usersData.sort((a, b) => {
-    const isANegative = isNegative(a);
-    const isBNegative = isNegative(b);
-
-    if (isANegative && !isBNegative) {
-      return -1;
-    }
-    if (!isANegative && isBNegative) {
-      return 1;
+    if (!props.showPositive) {
+      const res = compareBalance(a, b);
+      if (res !== 0) return res;
     }
     return a.fullName.localeCompare(b.fullName);
   });
-
   return usersData;
 };
 
@@ -107,7 +114,9 @@ const filterUsers = (e: any) => {
 };
 
 function isNegative(user: BaseUserResponse) {
-  return userStore.getBalanceById(user.id).amount.amount < 0;
+  const balance = userStore.getBalanceById(user.id);
+  if (!balance) return undefined;
+  else return balance.amount.amount < 0;
 }
 
 onMounted(async () => {
diff --git a/apps/dashboard/src/modules/financial/components/payout/forms/PayoutCreateForm.vue b/apps/dashboard/src/modules/financial/components/payout/forms/PayoutCreateForm.vue
index 86b1caf8..05e22775 100644
--- a/apps/dashboard/src/modules/financial/components/payout/forms/PayoutCreateForm.vue
+++ b/apps/dashboard/src/modules/financial/components/payout/forms/PayoutCreateForm.vue
@@ -4,6 +4,7 @@
                    :value="form.model.user.value.value"
                    @update:value="form.context.setFieldValue('user', $event)"
                    :errors="form.context.errors.value.user"
+                   :show-positive="true"
                    id="name" placeholder="John Doe"/>
 
 <!-- TODO think about turning this into a component? -->