Dus, nu ik de banner weer kan laten zien, aangezien deze conflicteert met de kanalen, hoe kan ik dit oplossen? Ik dacht eraan om CSS te gebruiken om de banner te verbergen wanneer de kanalen zichtbaar zijn, ervan uitgaande dat de URL zou veranderen, maar dat doet deze niet.
Heeft iemand tips om dit op te lossen zonder de banner op mobiel uit te schakelen via de instellingenpagina?
UPDATE: Ik had het mis toen ik aannam dat de URL niet veranderde. Ik zag net dat de URL “General” bevatte, wat een van mijn categorieën is, en ik ging ervan uit dat deze niet veranderde. Dus, ChatGPT heeft me hier ook mee geholpen, mocht iemand geïnteresseerd zijn (ook al zou dit iets kunnen zijn dat de Component zelf heeft opgenomen om conflicten met de kanalen op mobiel te voorkomen):
import { apiInitializer } from "discourse/lib/api";
export default apiInitializer((api) => {
api.onPageChange(() => {
const chatPath = /^\\/chat(\\/|$)/;
let attempts = 0;
const maxAttempts = 10;
function hideBanner() {
const banner = document.querySelector('.welcome-link-banner-wrapper');
if (banner) {
banner.style.display = chatPath.test(window.location.pathname) ? 'none' : 'block';
} else if (attempts < maxAttempts) {
attempts++;
setTimeout(hideBanner, 200);
}
}
hideBanner();
});
});
Ik heb dit toegevoegd aan een nieuwe component die ik heb gemaakt, genaamd: Hide Welcome Banner on Channels (mobile), in het JS tabblad.
Het lijkt te werken. Als er JavaScript-experts zijn die iets zien dat aangepast/verbeterd kan worden, deel het dan alsjeblieft.