## Issue
Stickly loads fine when Category Page is opened directly (F5, open), but doesn't load if F5 was at Homepage and then navigated into Category Page.
## Root
There is a bug where AdsSticky cannot be loaded on a page where AdsBanner exists. As long as AdsSticky is loaded in a page without AdsBanner, they both can still be visible together later, says from navigating around.
## Temp fix
Adding inAllowedPath to the logic is a band-aid that relies on AdsBanner only being used in Homepage for now, which we currently happen to not place AdsSticky.
## Ticket
1583: "add incontent ads to category/channel pages (break up every X claims?), or add back bottom ad in those areas."
## Behavioral changes
- Hide when in homepage (as currently we have ads between categories).
- Fix the light theme (it was transparent).
## Code changes
- While an Effect is the 'right' choice given that there is no jsx to mount, the need to prop-drill from the parent was getting a bit annoying, so converted to a Component instead.
- Remove the delay for Core Vitals avoidance for now -- seems to make the sticky less likely to serve an ad.
- Now that the membership state is correctly populated for incognito (see 9d830615), there is no more need to check for `isAuthenticated`.
* Redesign form elements with background
* Adjust list ads
* Fix progress bar in mini player
* Fix progress bar on mobile
* Fix progress bar in theater mode
* Redesign repost modal
* Update channel selector in modal
* Remove border radius from embedded media
* Adjust quality selector
* Adjust updated player theme for light mode
* Rename wrapper class
Run the membership reducer even for incognito.
The GUI needs to differentiate between 'unfetched' (`undefined`) and 'no membership' (`''`), so we must call the action/reducer for the incognito case as well.
Using that global variable was a bad idea. Stick to redux as the source of truth.
The flag is not listed for rehydration, so it will always start off as `undefined`, which is what we need anyways.
`undefined` indicates we haven't tested for ad-blockers, so we'll run the fetch and update the store with a true|false value.
This was tested to be removed during evaluation, but seems like there are cases where it comes back.
This solution should be more robust: hide for all, except when in our designated container.
It would be nice if the individual components can handle the remounting of the ad-script, but there is currently a need to synchronize the cleanup of the `window.OBR` object.
The quickest solution for now is to add a key at the parent side to synchronize the mount-unmounting. Not ideal -- revisit later.
- This increases the amount of ads, filling up the entire width. No more need to restrict with `max-width` ourself.
- Changed the ad-driver to top-right since the "Powered by Outbrain" text is now locked in bottom-right. Also made the container having a minimum height, as the method to "display the driver after ads are loaded" is not future proof -- it depends on the IDs being used by the ad. Reserving some space seems to be easiest, and it also reduces shifts as well.
Previously, we hide when authenticated.
We still need the `isAuthenticated` flag, because `hasPremiumPlus` stays at the unfetched (`undefined`) state for Incognito.
## Behavior in homepage
- Mobile: show after every other category
- Desktop: show after first category, then every 2 categories.
## Known issue:
- "FYP" is not part of the categories array at the moment, so it does mess up the behavior.
## Notes
I think this is also called "in-content" by adnim (not 100% sure of the terminology).