CAM 2023 Data/Feed view User Interface unstable on resize and on load

[tuxpiper]

Problems (interactions with UI)

• Some components/elements just disappear on the page on resize or after interacting with some other elements on the page.
• Post details behave weird: It some times appears more than once and uses both mobile and desktop appearances at some point.

Problems (with code)

Similar to the sidebar issues we fixed sometime ago, there are also code-related problems that affect the data/feed view's UI, or that makes it possible to break other things:

• Some things that could have been taken care of with CSS were done with javascript
• Code around this place is delicate and not really centralized. So while trying to fix the UI issues, you could be breaking collections (or maybe even saved searches, but collections majorly for now)

Proposed solution

Restructure both styles and javascript code for the feed view and components used within it.

Video 1: On resize related UI issues

feed-view-ui-unstable.mov

Video 2: Button focus and on load related UI issues

feed-view-btn-and-onload-ui.mov

---

Created automatically from USH-900 (https://linear.app/ushahidi/issue/USH-900/cam-2023-datafeed-view-user-interface-unstable-on-resize-and-on-load)

[Aquilaafuadajo]

@tuxpiper please can you share the raw video of this issue. I want to make an attempt to fix it but I don't have access to view the video.

[Angamanga]

Done