Communication: Improve auto completion for tagging users and channels

[FelberMartin]

Fixed the clipping of the AutoCompletionPopup as described in #72 and closes this issue.

Additionally also changed the search for courses, lectures, and channels to be case-insensitive to be more intuitive.

Before:

After:

[TimOrtel]

Can you please add screenshots on how this will look in the following cases:

1. entering a multi line text into the text field. e.g. when already being in line 3 and then starting an autocomplete dialog
2. when doing the same on a foldable
3. when doing the same on a tablet

[FelberMartin]

Can you please add screenshots on how this will look in the following cases:

1. entering a multi line text into the text field. e.g. when already being in line 3 and then starting an autocomplete dialog
2. when doing the same on a foldable
3. when doing the same on a tablet

I am not at my dev setup right now, so I can't provide screenshots at the moment.

Regarding (1.), with my current understanding of the code, the popup will show above the edit / preview buttons, regardless of the cursor position. I will check that as soon as I am back.

Regarding the foldable and tablet, dont know what the behaviour would be like and I understand that this is important for future proving the app. However, I feel like adjusting the UI for tablet, foldables, flip etc. compatability should probably be part of a different bigger ticket (as this likely also includes a completely altered design (with sidebar navigation eg)) and we should focus our limited resources on the main form factor for now.

[TimOrtel]

Can you please add screenshots on how this will look in the following cases:

1. entering a multi line text into the text field. e.g. when already being in line 3 and then starting an autocomplete dialog
2. when doing the same on a foldable
3. when doing the same on a tablet

I am not at my dev setup right now, so I can't provide screenshots at the moment.

Regarding (1.), with my current understanding of the code, the popup will show above the edit / preview buttons, regardless of the cursor position. I will check that as soon as I am back.

Regarding the foldable and tablet, dont know what the behaviour would be like and I understand that this is important for future proving the app. However, I feel like adjusting the UI for tablet and foldables should probably be part of a different bigger ticket (as this likely also includes a completely altered design (with sidebar navigation eg)) and we should focus our limited resources on the main form factor for now.

The app, and especially the communication component already supports tablet mode interactions. It was part of a greater feature I implemented a some time ago. Therefore, it is important that when making these changes we consider how the tablet and foldable layouts are affected.

So please provide the screenshots once you have time.

[FelberMartin]

Sorry, I did not know that tablet mode is already supported. Here are the screenshots:

Multiline mode on Phone:

Foldable:

Autocompletion on Tablet:

@TimOrtel Do you think the autocompletion dialog is fine for the tablet, or should we introduce some kind of maximum height, so the dialog does not span the whole screen?

EDIT: change "width" -> "height"

[julian-wls]

Just tested it and it looks good to me. The changes seem reasonable.

I think introducing some kind of maximum width does not feel right as it would require users to stretch their fingers all across the screen to reach the middle, which might be annoying.
Although it feels strange to have the view covering the entire screen, I think it might lead to a better user experience.
So, for foldables I would leave it like it is, for tablets I think it would look strange if the width of the view is smaller than the textfield below.

[FelberMartin]

Ah sorry, I meant adding a maximum height for tablets, not width. Sorry for the confusion

[julian-wls]

I think a maximum height would be quite reasonable. It would definitely look visually more appealing on tablets. We could set it to be the height of 5-6 items.

[FelberMartin]

New Changes

• I added a maxHeight to the dialog to show about 5-6 items max
• I also updated the design to be more consistent

Screenshots

Phone

Foldable

Tablet

[julian-wls]

I just tested it. This looks already so much better. The idea of introducing a max height was really good. Code lgtm.

There is only one thing I noticed:
The dividers are not visible in dark theme:

Does this happen to you as well?
I think we could fix this as part of this PR.

[FelberMartin]

Good catch, I'll have a look

[FelberMartin]

Okay, so it turns out this is a flaw of the M3 design specifications. Specifically, in dark mode, the colors surfaceVariant and outlineVariant are exactly the same ("neutral-variant30"). This causes all dividers to be invisible in dark mode.

We could either:

1. Ignore the problem
2. Deviate from the M3 design specs and manually change the value for md_theme_dark_outlineVariant in Color.kt
3. Not use surfaceVariant at all and replace it with something else in the app to avoid the problem. In a newer versions of M3 than we currently use, there eg is surfaceContainer. (This would be a separate PR for sure)

I would suggest that for now we either do 1 or 2 (I'd tent to 2), and eventually follow up with 3 separately, as this involves updating the theme and replacing all occurrences of surfaceVariant. What do you think? @julian-wls

[julian-wls]

I would suggest that for now we either do 1 or 2 (I'd tent to 2), and eventually follow up with 3 separately, as this involves updating the theme and replacing all occurrences of surfaceVariant. What do you think? @julian-wls

I agree. Let's do 2 and follow up with 3 in the future as part of a different PR :)

[FelberMartin]

Turns out the app uses dynamic colors for sdk >= 31, so we can not directly change the outlineVariant color. So, these changes will only be visible for users with sdk 30.

I also noticed that lifting the requirement for minSdk from 30 -> 31 was not necassary (as no other dependencies require this), so I lowered it again to 30.

I created a follow up issue #102