Merge branch 'develop' into hackathon/fix-ui

libs/service/src/hooks/teams/index.ts

@@ -312,9 +312,48 @@ export const useManageMember = (teamId: string) => {
 
 export const useRemoveMember = (teamId: string) => {
   const queryClient = useQueryClient();
+  const { session } = useAuthStore();
 
   return useMutation({
-    mutationFn: (userId: string) => teamsApi.removeMember(teamId, userId),
+    mutationFn: async (userId: string) => {
+      if (!session?.user?.id) {
+        throw new Error('You must be logged in to remove a member');
+      }
+
+      // Verify the current user is the team leader
+      const { data: team, error: teamError } = await supabase
+        .from('teams')
+        .select('leader_id')
+        .eq('id', teamId)
+        .single();
+
+      if (teamError || !team) {
+        throw new Error('Team not found');
+      }
+
+      if (team.leader_id !== session.user.id) {
+        throw new Error('Only the team leader can remove members');
+      }
+
+      // Cannot remove the leader
+      if (userId === team.leader_id) {
+        throw new Error('Cannot remove the team leader');
+      }
+
+      // Delete the team member record
+      const { error: deleteError } = await supabase
+        .from('team_members')
+        .delete()
+        .eq('team_id', teamId)
+        .eq('user_id', userId);
+
+      if (deleteError) {
+        console.error('Failed to remove member:', deleteError);
+        throw new Error(deleteError.message || 'Failed to remove member');
+      }
+
+      return { success: true };
+    },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.members(teamId) });
       queryClient.invalidateQueries({ queryKey: teamKeys.detail(teamId) });

libs/ui/src/atoms/button/button.tsx

@@ -26,12 +26,12 @@ type TButtonProps = DetailedHTMLProps<
 const variantClasses: Record<TButtonVariant, string> = {
   primary: 'bg-primary-500 hover:bg-primary-600 text-white shadow-md',
   secondary:
-    'bg-white hover:text-primary-600 hover:bg-gray-50 text-primary-500 shadow-md',
-  text: 'bg-transparent hover:text-primary-600 hover:bg-gray-50 text-primary-500',
+    'bg-white dark:bg-neutral-800 hover:text-primary-600 dark:hover:text-primary-400 hover:bg-gray-50 dark:hover:bg-neutral-700 text-primary-500 dark:text-primary-400 shadow-md dark:shadow-neutral-900/50',
+  text: 'bg-transparent hover:text-primary-600 dark:hover:text-primary-400 hover:bg-gray-50 dark:hover:bg-neutral-800 text-primary-500 dark:text-primary-400',
   bordered:
-    'border border-primary-500 hover:border-primary-600 bg-transparent hover:text-primary-600 hover:bg-gray-50 text-primary-500',
+    'border border-primary-500 dark:border-primary-400 hover:border-primary-600 dark:hover:border-primary-300 bg-transparent hover:text-primary-600 dark:hover:text-primary-300 hover:bg-gray-50 dark:hover:bg-neutral-800 text-primary-500 dark:text-primary-400',
   success: 'bg-success-500 hover:bg-success-600 text-white shadow-md',
-  danger: 'bg-danger-100 hover:bg-danger-200 text-danger-500 shadow-md',
+  danger: 'bg-danger-100 dark:bg-danger-500/20 hover:bg-danger-200 dark:hover:bg-danger-500/30 text-danger-500 shadow-md dark:shadow-neutral-900/50',
 };
 
 const sizeClasses: Record<TButtonSize, string> = {