From d13998f94d039c58dbbe3a40431acd0ea46ba29b Mon Sep 17 00:00:00 2001 From: Sarah German Date: Wed, 11 Jan 2023 19:26:15 +0000 Subject: Populate deprecation dates from JSON file --- content/frontend/deprecations/deprecations.js | 75 +++++++++++++++++++++++++++ content/frontend/deprecations/filters.js | 57 -------------------- content/frontend/services/fetch_versions.js | 18 ++++++- content/release_dates.json | 75 +++++++++++++++++++++++++++ layouts/default.html | 3 +- 5 files changed, 168 insertions(+), 60 deletions(-) create mode 100644 content/frontend/deprecations/deprecations.js delete mode 100644 content/frontend/deprecations/filters.js create mode 100644 content/release_dates.json diff --git a/content/frontend/deprecations/deprecations.js b/content/frontend/deprecations/deprecations.js new file mode 100644 index 00000000..3a651f67 --- /dev/null +++ b/content/frontend/deprecations/deprecations.js @@ -0,0 +1,75 @@ +import Vue from 'vue'; +import { compareVersions } from 'compare-versions'; +import { getReleaseDates } from '../services/fetch_versions'; +import DeprecationFilters from './components/deprecation_filters.vue'; + +/** + * Add some helper markup to allow for simpler filter logic. + */ +document.querySelectorAll('.deprecation').forEach((el, index) => { + el.setAttribute('data-deprecation-id', index + 1); +}); + +/** + * Builds an array of removal milestone options from page content. + * + * Each milestone object contains: + * - A text string, used for labels in the select options list. + * - A value string, which is the same as the text string, but without periods. + * This is used to match the query with CSS classes on deprecations. + * CSS classes cannot include periods, so we drop those for this element. + * + * @param {String} showAllText + * @return {Array} + */ +const buildMilestonesList = (showAllText) => { + let milestones = []; + document.querySelectorAll('.removal-milestone').forEach((el) => { + if (!milestones.includes(el.innerText)) { + milestones.push(el.innerText); + } + }); + milestones.sort(compareVersions).reverse(); + milestones = milestones.map((el) => { + return { value: el.replaceAll('.', ''), text: el }; + }); + milestones.unshift({ value: showAllText, text: showAllText }); + return milestones; +}; + +document.addEventListener('DOMContentLoaded', async () => { + // Populate milestone dates. + const releaseDates = await getReleaseDates(); + const dateFields = ['removal-date', 'support-end-date']; + + dateFields.forEach((field) => { + const depDates = document.querySelectorAll(`span.${field}`); + depDates.forEach((dd) => { + // Find the milestone value from within the sibling span tag. + // Use this to populate the date for the milestone. + const milestone = dd.parentNode.querySelector('.removal-milestone').innerText; + const releaseDate = Object.keys(releaseDates).find((key) => releaseDates[key] === milestone); + // eslint-disable-next-line no-param-reassign + dd.innerText = `(${releaseDate})`; + }); + }); + + // Initialize the filters Vue component. + const showAllText = 'Show all'; + const milestonesOptions = buildMilestonesList(showAllText); + + return new Vue({ + el: '.js-deprecation-filters', + components: { + DeprecationFilters, + }, + render(createElement) { + return createElement(DeprecationFilters, { + props: { + milestonesOptions, + showAllText, + }, + }); + }, + }); +}); diff --git a/content/frontend/deprecations/filters.js b/content/frontend/deprecations/filters.js deleted file mode 100644 index 472cba50..00000000 --- a/content/frontend/deprecations/filters.js +++ /dev/null @@ -1,57 +0,0 @@ -import Vue from 'vue'; -import { compareVersions } from 'compare-versions'; -import DeprecationFilters from './components/deprecation_filters.vue'; - -/** - * Add some helper markup to allow for simpler filter logic. - */ -document.querySelectorAll('.deprecation').forEach((el, index) => { - el.setAttribute('data-deprecation-id', index + 1); -}); - -/** - * Builds an array of removal milestone options from page content. - * - * Each milestone object contains: - * - A text string, used for labels in the select options list. - * - A value string, which is the same as the text string, but without periods. - * This is used to match the query with CSS classes on deprecations. - * CSS classes cannot include periods, so we drop those for this element. - * - * @param {String} showAllText - * @return {Array} - */ -const buildMilestonesList = (showAllText) => { - let milestones = []; - document.querySelectorAll('.removal-milestone').forEach((el) => { - if (!milestones.includes(el.innerText)) { - milestones.push(el.innerText); - } - }); - milestones.sort(compareVersions).reverse(); - milestones = milestones.map((el) => { - return { value: el.replaceAll('.', ''), text: el }; - }); - milestones.unshift({ value: showAllText, text: showAllText }); - return milestones; -}; - -document.addEventListener('DOMContentLoaded', () => { - const showAllText = 'Show all'; - const milestonesOptions = buildMilestonesList(showAllText); - - return new Vue({ - el: '.js-deprecation-filters', - components: { - DeprecationFilters, - }, - render(createElement) { - return createElement(DeprecationFilters, { - props: { - milestonesOptions, - showAllText, - }, - }); - }, - }); -}); diff --git a/content/frontend/services/fetch_versions.js b/content/frontend/services/fetch_versions.js index 4b73d879..6edf3e45 100644 --- a/content/frontend/services/fetch_versions.js +++ b/content/frontend/services/fetch_versions.js @@ -2,7 +2,9 @@ import { compareVersions } from 'compare-versions'; -const DOCS_VERSIONS_ENDPOINT = 'https://docs.gitlab.com/versions.json'; +const BASE_URL = `${window.location.protocol}//${window.location.host}`; +const DOCS_VERSIONS_ENDPOINT = `${BASE_URL}/versions.json`; +const GITLAB_RELEASE_DATES_ENDPOINT = `${BASE_URL}/release_dates.json`; const DOCS_IMAGES_ENDPOINT = 'https://gitlab.com/api/v4/projects/1794617/registry/repositories/631635/tags?per_page=100'; @@ -56,3 +58,17 @@ export async function getArchivesVersions() { !Object.values(onlineVersions).flat().includes(v), ); } + +/** + * Fetch a list of versions with their associated release dates. + * + * @returns Array + */ +export function getReleaseDates() { + return fetch(GITLAB_RELEASE_DATES_ENDPOINT) + .then((response) => response.json()) + .then((data) => { + return Object.assign(...data); + }) + .catch((error) => console.error(error)); +} diff --git a/content/release_dates.json b/content/release_dates.json new file mode 100644 index 00000000..75284757 --- /dev/null +++ b/content/release_dates.json @@ -0,0 +1,75 @@ +[ + { + "2021-05-22": "14.0", + "2021-06-22": "14.1", + "2021-07-22": "14.2", + "2021-08-22": "14.3", + "2021-09-22": "14.4", + "2021-10-22": "14.5", + "2021-11-22": "14.6", + "2021-12-22": "14.7", + "2022-01-22": "14.8", + "2022-03-22": "14.9", + "2022-04-22": "14.10", + "2022-05-22": "15.0", + "2022-06-22": "15.1", + "2022-07-22": "15.2", + "2022-08-22": "15.3", + "2022-09-22": "15.4", + "2022-10-22": "15.5", + "2022-11-22": "15.6", + "2022-12-22": "15.7", + "2023-01-22": "15.8", + "2023-02-22": "15.9", + "2023-03-22": "15.10", + "2023-04-22": "15.11", + "2023-05-22": "16.0", + "2023-06-22": "16.1", + "2023-07-22": "16.2", + "2023-08-22": "16.3", + "2023-09-22": "16.4", + "2023-10-22": "16.5", + "2023-11-22": "16.6", + "2023-12-22": "16.7", + "2024-01-22": "16.8", + "2024-02-22": "16.9", + "2024-03-22": "16.10", + "2024-04-22": "16.11", + "2024-05-22": "17.0", + "2024-06-22": "17.1", + "2024-07-22": "17.2", + "2024-08-22": "17.3", + "2024-09-22": "17.4", + "2024-10-22": "17.5", + "2024-11-22": "17.6", + "2024-12-22": "17.7", + "2025-01-22": "17.8", + "2025-02-22": "17.9", + "2025-03-22": "17.10", + "2025-04-22": "17.11", + "2025-05-22": "18.0", + "2025-06-22": "18.1", + "2025-07-22": "18.2", + "2025-08-22": "18.3", + "2025-09-22": "18.4", + "2025-10-22": "18.5", + "2025-11-22": "18.6", + "2025-12-22": "18.7", + "2026-01-22": "18.8", + "2026-02-22": "18.9", + "2026-03-22": "18.10", + "2026-04-22": "18.11", + "2026-05-22": "19.0", + "2026-06-22": "19.1", + "2026-07-22": "19.2", + "2026-08-22": "19.3", + "2026-09-22": "19.4", + "2026-10-22": "19.5", + "2026-11-22": "19.6", + "2026-12-22": "19.7", + "2027-01-22": "19.8", + "2027-02-22": "19.9", + "2027-03-22": "19.10", + "2027-04-22": "19.11" + } +] diff --git a/layouts/default.html b/layouts/default.html index 2e81869c..b5684b6d 100644 --- a/layouts/default.html +++ b/layouts/default.html @@ -112,7 +112,7 @@ <%= render '/analytics.*' %> <% end %> <% if @item.identifier.to_s == '/ee/update/deprecations.md' %> - + <% end %> @@ -121,4 +121,3 @@ - -- cgit v1.2.3