Filter games #877

Mauritz8 · 2024-07-21T00:59:43Z

Partially implement #454

Mauritz8 · 2024-07-21T13:05:25Z

I've implemented a filter for perf:

Screencast.from.2024-07-21.14.50.36.webm

ZTL-UwU · 2024-07-21T13:59:15Z

It looks awesome! One samll suggestion tho, is it possible to use chips for filtering like the recommended design in material 3? (https://m3.material.io/components/chips/overview)

ijm8710 · 2024-07-21T22:28:49Z

I agree with @ZTL-UwU. Another reason for this is because there will ultimately probably be other filters beyond variant such as result type and piece color

Mauritz8 · 2024-07-23T20:58:00Z

Thanks! Using chips seems like a great idea, I'll try to make it work.

Mauritz8 · 2024-07-25T15:50:20Z

I think this is a significant improvement, let me know what you think.

Screencast.from.2024-07-25.17.41.35.webm

veloce · 2024-07-25T18:00:09Z

Thanks!

Can you try to:

make the chip smaller
call it only "variant" instead of "Time control / variant": it will be shorter;
put the chip in the app bar, or make it look like it is in the app bar; (I guess it is not that hard to do, but I'm not sure)

ijm8710 · 2024-07-25T18:37:45Z

For a first version this is great but would yall agree formatting the chips more similarly organized to the style laid out in the link shared earlier (screenshotting image) ?

That way you can add a few more categories for sub-filters such as win/loss and white/black

I think this organization looks a bit more streamlined

veloce · 2024-07-25T18:44:30Z

Yeah good idea. We could also separate the "Time control" chips from the variant chips. Using a line separator.

Mauritz8 · 2024-07-26T06:01:26Z

Now it looks like the picture, big improvement again I think. I also implemented your suggestions veloce. Though I'm not exactly sure what you mean by making it smaller, was shortening the text to just 'variant' enough? Also, I'm not able to test on ios, so I'm not sure whether the app bar will look good on it.

Screencast.from.2024-07-26.07.50.33.webm

ZTL-UwU · 2024-07-26T07:55:26Z

I think a filter icon button on the right of the appbar will be more concise.

Also, I think putting the chips into a bottom sheet or a separate screen instead of a dialog is better as it gives more space for the chips to spread.

Mauritz8 · 2024-07-26T08:25:26Z

If I understand correctly, you want a single button in the app bar, that opens all the filters?
That would be a different design than what's detailed in #454. To quote:

On top of the list, an horizontal list of filters should be displayed (like in the notifications screen of GitHub app). Filters would include: "rated", "perf type", "bookmarks", etc. (list non exhaustive).

I would prefer using a popup, rather than a separate screen. There's less context switching, and you can easily exit by pressing outside the popup. Overall I think it's a better experience. Also, I don't think space is an issue, It easily fits, and this is one of the filters with the most chips. Filters like color and rated will only have 2 chips, so a separate screen seems excessive, and a bottom sheet would be very far down since there would be so little content on it.

ijm8710 · 2024-07-26T12:22:29Z

I do think I had similar comments to @ZTL-UwU (even before I read his).

Was also thinking:

separate screen or bottom sheet may work better for this
a filter button rather than a chip to launch the screen with all the choices
Smaller chips with headers by section

Just design wise closer to the picture so we can have more sections

You can even have little icons in front of the section names to make it slightly prettier (like some pawn or something before variant type)

Since it's not possible to count games when complex filter in use

Mauritz8 · 2024-07-27T12:45:15Z

So, I created a new branch locally and implemented the design that you both want. I think it looks nice, and I'm willing to go for this design instead of the proposed one. @veloce what do you think?

Screencast.from.2024-07-27.14.41.50.webm

ijm8710 · 2024-07-27T13:33:02Z

Awesome @Mauritz8 i thinks it's starting to look a lot better.

Few more things that I think would get it to finish line

I feel order of variants should be either based on the same order of your perf cards (which I believe is based on total games played) or based on just most popular variant sitewide.
I like that we have the starting filter now! is it still possible to have the filter but still have the designation you had before to show what the filter is currently selecting? Perhaps can change the title of the header screen to say like bullet or something especially if it's just one filter selected
would you be able to add a section for result: won/loss/draw
I think icons before the section names would be the final polish to make them easy to discern quickly? Like perhaps the rabbit, bullet or turtle before the variant section. A black or white pawn before the side section. And the green plus icon for the result section? I'm not to picky with which icon you choose, I just personally feel icons before section names really work well.
posing one question: if you have zero activity for a variant should it show? Personally I lean no so, for example, if you've only played bullet and rapid, you would only see 2 chips. I'm not stubborn on this one, but just my personal take (if it doesn't tax the server to gather that info).

Thanks for trialing out our ideas! It's getting really good!

veloce · 2024-07-27T15:52:29Z

So, I created a new branch locally and implemented the design that you both want. I think it looks nice, and I'm willing to go for this design instead of the proposed one. @veloce what do you think?

Looks good to me. I think on top of the "filter" icon we need a chip indicating the number of selected filters. Same appearance as the "unread messages" chip on the chat icon on game screen.

Mauritz8 · 2024-07-28T09:46:32Z

Thanks @ijm8710, I've made adjustments now in regards to your feedback:

Variants now work the same as the perf cards on the home screen. That is, they are ordered based on total games played, and ones with no games played are not shown.
Chip indicating how many filters are in use, like veloce suggested.
Icon before filter name

would you be able to add a section for result: won/loss/draw

Not supported in the api yet.

This is how it looks:

Screencast.from.2024-07-28.11.26.40.webm

ijm8710 · 2024-07-28T14:49:03Z

Thanks @Mauritz8 think it looks perfect! You rock

Two questions for you:

if only one filter is chosen, any chance to have the title reflect filter chosen as well as the result count "83 classical games"...."83 games" if multi filters chosen (this would then match the format used when opening specific games from the variant screens)
these same filters can be run from another user profile too, correct?

And two questions for @veloce

mauritz mentioned game result is not supported in api. Would this be something worth adding to api if possible? I feel being able to query a win vs loss will have use-case here and possibly elsewhere
on web, there are many more filters. Do you think it may make sense to have a link on the filter screen "advanced filters" for even more advanced filter access?
Dream scenario is a user would be able to open an overlay web screen of the filters, choose what they want and they generate in a native screen within the app. But perhaps this is overboard.

Mauritz8 · 2024-07-28T18:53:55Z

if only one filter is chosen, any chance to have the title reflect filter chosen as well as the result count "83 classical games"...."83 games" if multi filters chosen (this would then match the format used when opening specific games from the variant screens)

Games are only fetched a few at a time, so it's unfortunately not possible to count the total when using filters. We could change the title when only a single filter is used, but I'm a bit worried that there might be too little horizontal space in the app bar.

these same filters can be run from another user profile too, correct?

Yes!

ijm8710 · 2024-07-28T23:01:08Z

Okay, only reason I thought otherwise is because your other pr if you pull all classical games from the variant card it had the count. No worries then! Thanks again for your work on this

Mauritz8 · 2024-07-29T04:31:48Z

Yes it's technically possible to get the number of games if the filter is only made up of variants, but it would require an additional api request for each variant selected, which doesn't seem great. I think it could be done in a better way, and in my opinon it's not that useful unless it works no matter how complex the filter is. If it should be implemented, I think the number of results should probably be a part of the api response instead. The advanced search on the website shows the number of results, so it should be possible to implement.

veloce · 2024-07-30T07:08:45Z

mauritz mentioned game result is not supported in api. Would this be something worth adding to api if possible? I feel being able to query a win vs loss will have use-case here and possibly elsewhere

Yes it is planned to add more filters later.

ijm8710 · 2024-07-31T19:00:46Z

@Mauritz8 one other request, not sure if you agree.

Before filtering on game type in your pr it says Ivan's games

Currently in beta it'll say total # games. I don't think that total count is visible anywhere else in app so can we have it still say total count before filtering?

veloce · 2024-08-03T15:07:49Z

lib/src/model/game/game_history.dart

-  MyRecentGamesRef ref,
-) async {
+  MyRecentGamesRef ref, {
+  GameFilterState filter = const GameFilterState(),


Recent games should not be filtered (whether it is my recent games or any user recent games) so this parameter should be removed.

The game history provider uses the recent games providers in its implementation. We could create new providers that do the same thing, except they watch the game filter provider instead of passing it as a param. I don't really see the point though.

I'd rather make the request again than have an extra complexity and unnecessary filter in the recent game providers.

So you can just remove the dependency to the recent game provider in UserGameHistory and perform the request directly with the filters.

veloce · 2024-08-03T15:13:03Z

lib/src/model/game/game_filter.dart

+        side: filter.side,
+      );
+
+  int countFiltersInUse() {


Provider should not define public getters or expose state through public methods.

The count info is already available in the state. A count getter can be defined in the GameFilterState class directly if needed.

veloce · 2024-08-03T15:14:22Z

lib/src/view/user/game_history_screen.dart

    );
+    final filtersInUse = ref


Cf. other comment. ref.read should not be used in build() methods; to count the filters you should get the filter state with ref.watch.

veloce · 2024-08-03T15:15:49Z

lib/src/view/user/game_history_screen.dart

+          ),
+        );
+
+    return Container(


A Container seems useless here. You could use directly a Padding.

veloce · 2024-08-03T15:17:46Z

lib/src/view/user/game_history_screen.dart

+          controller: scrollController,
+          children: [
+            if (userId != null)
+              ref.watch(userProvider(id: userId)).when(


It is better to put ref.watch at the beginning of build() methods so when we read the code we know immediately what are the watched dependencies of the widget.

The userId might be null though, so we can't listen to it unconditionally.

Mauritz8 · 2024-08-04T12:14:01Z

@Mauritz8 one other request, not sure if you agree.

Before filtering on game type in your pr it says Ivan's games

Currently in beta it'll say total # games. I don't think that total count is visible anywhere else in app so can we have it still say total count before filtering?

I'll add it back in.

* use ref.watch instead of ref.read inside build method * define count getter directly in class * use padding instead of container

veloce · 2024-08-05T13:47:38Z

Thanks again for this!

Mauritz8 marked this pull request as ready for review July 21, 2024 13:05

Mauritz8 force-pushed the filter-games branch from d27a2a4 to ca73eee Compare July 25, 2024 15:46

Mauritz8 added 16 commits July 27, 2024 10:05

feat: create provider for game filters

2b46014

feat: create filter in ui

6f6e18a

feat: apply filter to search

af2bcee

refactor: pass game filters object instead of individual params

b7d536e

feat: filter with multiple perfs

2d9fd9c

feat: indicate how many filters in use

6452a4f

refactor: separate widget for multiple choice filter

fa1bfc0

fix: do not show amount of games found

9b6d104

Since it's not possible to count games when complex filter in use

feat: show message if no games found

35f4c98

fix: only allow valid Perf enum values

304b0c3

feat: highlight button if filter is used

d97afa9

fix: make text readable on all themes

4dcc8eb

fix: sync paginator with filters

af1c3b0

feat: use chips from material3

9026b10

refactor: use ISet instead of Set

c830b57

feat: add btn colors depending on state

1febfbf

Mauritz8 added 4 commits July 27, 2024 12:35

feat: btn opens all filters in a bottom sheet

b296a52

fix: remove incorrect expanded widget

f13f007

feat: add filter for color

69c4c4d

feat: make bottom sheet scrollable

e428e01

Mauritz8 added 5 commits July 28, 2024 07:54

feat: add a chip indicating number of used filters

e5e966a

feat: icons before filter name

3801986

feat: include username in appbar title

2fa7ee3

feat: sort variants and remove unplayed ones

b590d9c

fix: ui adjustments + extract variable + format

477807d

Mauritz8 force-pushed the filter-games branch from 9a585e9 to 477807d Compare July 28, 2024 09:03

veloce reviewed Aug 3, 2024

View reviewed changes

Mauritz8 added 5 commits August 5, 2024 09:27

refactor: address a few pr comments

14c1f57

* use ref.watch instead of ref.read inside build method * define count getter directly in class * use padding instead of container

feat: if no filter is used, set title to number of games

d5e8581

refactor: make UserGameHistory not depend on recent games providers

d418bd8

feat: support filtering games offline

09e1251

Merge branch 'main' of github.com:lichess-org/mobile into filter-games

680b223

veloce merged commit 993ceae into lichess-org:main Aug 5, 2024
1 check passed

Mauritz8 deleted the filter-games branch August 5, 2024 13:54

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Filter games #877

Filter games #877

Mauritz8 commented Jul 21, 2024

Mauritz8 commented Jul 21, 2024

ZTL-UwU commented Jul 21, 2024

ijm8710 commented Jul 21, 2024 •

edited

Loading

Mauritz8 commented Jul 23, 2024

Mauritz8 commented Jul 25, 2024

veloce commented Jul 25, 2024 •

edited

Loading

ijm8710 commented Jul 25, 2024 •

edited

Loading

veloce commented Jul 25, 2024

Mauritz8 commented Jul 26, 2024

ZTL-UwU commented Jul 26, 2024

Mauritz8 commented Jul 26, 2024

ijm8710 commented Jul 26, 2024 •

edited

Loading

Mauritz8 commented Jul 27, 2024

ijm8710 commented Jul 27, 2024 •

edited

Loading

veloce commented Jul 27, 2024

Mauritz8 commented Jul 28, 2024 •

edited

Loading

ijm8710 commented Jul 28, 2024 •

edited

Loading

Mauritz8 commented Jul 28, 2024

ijm8710 commented Jul 28, 2024

Mauritz8 commented Jul 29, 2024

veloce commented Jul 30, 2024

ijm8710 commented Jul 31, 2024 •

edited

Loading

veloce Aug 3, 2024

Mauritz8 Aug 4, 2024

veloce Aug 5, 2024

veloce Aug 3, 2024

veloce Aug 3, 2024

veloce Aug 3, 2024

veloce Aug 3, 2024

Mauritz8 Aug 4, 2024

Mauritz8 commented Aug 4, 2024

veloce commented Aug 5, 2024

Filter games #877

Filter games #877

Conversation

Mauritz8 commented Jul 21, 2024

Mauritz8 commented Jul 21, 2024

ZTL-UwU commented Jul 21, 2024

ijm8710 commented Jul 21, 2024 • edited Loading

Mauritz8 commented Jul 23, 2024

Mauritz8 commented Jul 25, 2024

veloce commented Jul 25, 2024 • edited Loading

ijm8710 commented Jul 25, 2024 • edited Loading

veloce commented Jul 25, 2024

Mauritz8 commented Jul 26, 2024

ZTL-UwU commented Jul 26, 2024

Mauritz8 commented Jul 26, 2024

ijm8710 commented Jul 26, 2024 • edited Loading

Mauritz8 commented Jul 27, 2024

ijm8710 commented Jul 27, 2024 • edited Loading

veloce commented Jul 27, 2024

Mauritz8 commented Jul 28, 2024 • edited Loading

ijm8710 commented Jul 28, 2024 • edited Loading

Mauritz8 commented Jul 28, 2024

ijm8710 commented Jul 28, 2024

Mauritz8 commented Jul 29, 2024

veloce commented Jul 30, 2024

ijm8710 commented Jul 31, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Mauritz8 commented Aug 4, 2024

veloce commented Aug 5, 2024

ijm8710 commented Jul 21, 2024 •

edited

Loading

veloce commented Jul 25, 2024 •

edited

Loading

ijm8710 commented Jul 25, 2024 •

edited

Loading

ijm8710 commented Jul 26, 2024 •

edited

Loading

ijm8710 commented Jul 27, 2024 •

edited

Loading

Mauritz8 commented Jul 28, 2024 •

edited

Loading

ijm8710 commented Jul 28, 2024 •

edited

Loading

ijm8710 commented Jul 31, 2024 •

edited

Loading