diff --git a/src/pydata_sphinx_theme/assets/scripts/pydata-sphinx-theme.js b/src/pydata_sphinx_theme/assets/scripts/pydata-sphinx-theme.js index dc5b44c6f..f3b54908d 100644 --- a/src/pydata_sphinx_theme/assets/scripts/pydata-sphinx-theme.js +++ b/src/pydata_sphinx_theme/assets/scripts/pydata-sphinx-theme.js @@ -323,6 +323,28 @@ var getCurrentUrlPath = () => { return `${DOCUMENTATION_OPTIONS.pagename}.html`; }; +/** + * Allow user to dismiss the warning banner about the docs version being dev / old. + * We store the dismissal date and version, to give us flexibility about making the + * dismissal last for longer than one browser session, if we decide to do that. + * + * @param {event} event the event that trigger the check + */ +async function DismissBannerAndStorePref(event) { + const banner = document.querySelector("#bd-header-version-warning"); + banner.remove(); + const version = DOCUMENTATION_OPTIONS.VERSION; + const now = new Date(); + const banner_pref = JSON.parse( + localStorage.getItem("pst_banner_pref") || "{}", + ); + console.debug( + `[PST] Dismissing the version warning banner on ${version} starting ${now}.`, + ); + banner_pref[version] = now; + localStorage.setItem("pst_banner_pref", JSON.stringify(banner_pref)); +} + /** * Check if corresponding page path exists in other version of docs * and, if so, go there instead of the homepage of the other docs version @@ -485,23 +507,50 @@ function showVersionWarningBanner(data) { // if already on preferred version, nothing to do const versionsAreComparable = validate(version) && validate(preferredVersion); if (versionsAreComparable && compare(version, preferredVersion, "=")) { + console.log( + "This is the prefered version of the docs, not showing the warning banner.", + ); return; } + // check if banner has been dismissed recently + const dismiss_date_str = JSON.parse( + localStorage.getItem("pst_banner_pref") || "{}", + )[version]; + if (dismiss_date_str != null) { + const dismiss_date = new Date(dismiss_date_str); + const now = new Date(); + const milliseconds_in_a_day = 24 * 60 * 60 * 1000; + const days_passed = (now - dismiss_date) / milliseconds_in_a_day; + const timeout_in_days = 14; + if (days_passed < timeout_in_days) { + console.info( + `[PST] Suppressing version warning banner; was dismissed ${Math.floor(days_passed)} day(s) ago`, + ); + return; + } + } + // now construct the warning banner - const banner = document.querySelector(".bd-header-version-warning"); + const banner = document.querySelector("#bd-header-version-warning"); const middle = document.createElement("div"); const inner = document.createElement("div"); const bold = document.createElement("strong"); const button = document.createElement("a"); + const close_btn = document.createElement("a"); // these classes exist since pydata-sphinx-theme v0.10.0 // the init class is used for animation - middle.classList = "bd-header-announcement__content"; + middle.classList = "bd-header-announcement__content ms-auto me-auto"; inner.classList = "sidebar-message"; button.classList = "btn text-wrap font-weight-bold ms-3 my-1 align-baseline pst-button-link-to-stable-version"; button.href = `${preferredURL}${getCurrentUrlPath()}`; button.innerText = "Switch to stable version"; button.onclick = checkPageExistsAndRedirect; + close_btn.classList = "ms-3 my-1 align-baseline"; + const close_x = document.createElement("i"); + close_btn.append(close_x); + close_x.classList = "fa-solid fa-xmark"; + close_btn.onclick = DismissBannerAndStorePref; // add the version-dependent text inner.innerText = "This is documentation for "; const isDev = @@ -520,6 +569,7 @@ function showVersionWarningBanner(data) { bold.innerText = `version ${version}`; } banner.appendChild(middle); + banner.append(close_btn); middle.appendChild(inner); inner.appendChild(bold); inner.appendChild(document.createTextNode(".")); diff --git a/src/pydata_sphinx_theme/assets/styles/sections/_announcement.scss b/src/pydata_sphinx_theme/assets/styles/sections/_announcement.scss index 331014be3..bdb3cef15 100644 --- a/src/pydata_sphinx_theme/assets/styles/sections/_announcement.scss +++ b/src/pydata_sphinx_theme/assets/styles/sections/_announcement.scss @@ -12,7 +12,7 @@ } } -.bd-header-version-warning, +#bd-header-version-warning, .bd-header-announcement { min-height: 3rem; width: 100%; @@ -69,6 +69,6 @@ background-color: var(--pst-color-secondary-bg); } -.bd-header-version-warning { +#bd-header-version-warning { background-color: var(--pst-color-danger-bg); } diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/sections/announcement.html b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/sections/announcement.html index e97fb2859..b69e459e8 100644 --- a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/sections/announcement.html +++ b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/sections/announcement.html @@ -1,7 +1,7 @@ {#- The "revealer" allows async banners to be loaded, revealed, and animated together in a controlled way -#}