players: remove team_name and add teams from UC

[Joe2k]

For #70 and #72

[punchagan]

Thanks for working on this, @Joe2k ! Can you post screenshots for the UI changes, before I get to reviewing this?

[Joe2k]

Yep sure

[punchagan]

This looks great! Excited to review and merge this. I'll get to it, soon! :)

[Joe2k]

So I decoupled team names from the search now. So the team selected will take first precedence in the search before the search text. But yeah people can always keep the teams seleted to "All Teams" and search names globally

[Joe2k]

The New Select All button will select all that are currently in screen(basically all the players that pass team and search text filter)

Also took care of cases where duplicate selections dont happen

[punchagan]

I fixed a few issues and bugs in the commits, and merged them manually.

Notably:

On the backend:

• set teams when importing members data
• set teams when linking UC profile
• Simplified code for adding teams: used team_id instead of team objects/instances

On the frontend:

• UI incorrectly added players to payments even when they already had valid memberships (either via individual payments or payments for a different team).
• "Make another payment" didn't show the search accordion correctly
• Sort teams in the dropdown to make it easier to find teams

In a separate commit, I pushed some fixes for Razorpay API calls for large groups.

[punchagan]

@Joe2k Why did you undo the change where the search was performed as the user typed, and instead now only search when the button is clicked? I think that was a good improvement? 🤔

[Joe2k]

@punchagan Yeah what i was thinking was before for every key press we are running a very heavy load of js to filter by team and then by search text. So if we have 500 numbers of all india ultimate players the function will take a heavy toll on the browser and thus will lag a lot.

So for this I thought of 2 approaches:

1. [The current implemented] Just add a button to trigger the heavy search function whenever user is ready

2. [What i used to do before in old react projects] I create a setTimeout for 1 to 2 seconds where if a user has not typed any letter for that time then I run the heavy search function. So every key press I cancel the previous set timeout and create a new one. This is super good improvement and very good UX but i dont know how to implement this is Solid xD. I tried searching for setTimeout and all but coudnt find a proper guide how to do it here