Bug in UI : Not able to write in Kafka and service account toolbar input fields in Mobile Device (Issue raised by Marek Musil on Mail)

[ajaypratap003]

JIRA isse https://issues.redhat.com/browse/MGDSTRM-2782

1. Not able to write in Kafka and service account toolbar input fields in Mobile Device. On type anything toolbar closed.
2. Extra space between toolbar fields in mobile view Remove empty divs in Filter panel #314

---------Issue raised by Marek Musil on mail ---------

Do we expect customers to be accessing the UI from mobile devices? I was checking how the UI works on a mobile device (Chrome in Android Emulator and later on my OnePlus with Android 11) and found out few things:
It's impossible to write anything to the filter input box, the same happens in the Service Accounts page, see attached video
kafkas_filter_android.m4v
When the filter is opened and you touch and hold on the Kafka instance hidden partially by the filter window, they become both visible and mixed together
kafkas_filter_window_dissapears.m4v
Filter options and inputs positions are moving up and down depending on the selected filter type. The gap between the input and the applied filters is too big (depending again on the filter type selected) and just doesn't look good

I don't have access to a physical iOS device at the moment to test it there, but I'm guessing it will be the same.

[jgiardino]

When the filter is opened and you touch and hold on the Kafka instance hidden partially by the filter window, they become both visible and mixed together

This was an issue that I had recently noticed with PF: patternfly/patternfly#3983

They fixed it for their example and it's available in patternfly core 4.98.1

But they did not have an example of a table view, so I couldn't verify that it would fix our issue. If we get the latest css and this doesn't work (or we aren't pulling css from core patternfly), there is a suggestion on how we can fix this in that issue:

The expanded content should be using a higher z-index, --pf-global--ZIndex--sm, which is what we use for menus that pop out from a toggle.

[jgiardino]

I took a look on my iOS device using safari, and I didn't see any issues other than the one I noted above. There are some things that could be refined a bit, but I was able to access all the contents that I had permission to.

[mmusil]

@jgiardino I wrote to the thread, that the issue with input was not present on iOS devices, but it didn't get to this issue and everything is in #392. Thanks for checking on your device!

[christiemolloy]

Filed an issue in PF React patternfly/patternfly-react#5682 for the Filter text input not working.

It appears issue 2 & 3 have been resolved.

Ill keep this issue open for the time being.

[christiemolloy]

The Filter text input in Android has now been fixed in PatternFly. patternfly/patternfly-react#5692 (comment)

The only remaining issue in this PR is: "Filter options and inputs positions are moving up and down depending on the selected filter type. The gap between the input and the applied filters is too big (depending again on the filter type selected) and just doesn't look good"

^ @mmusil myself and the PF devs were unable to reproduce this bug. Do you still see it? If not, i think we can close out this issue.