diff --git a/blocks/gmo-program-details/gmo-program-details.css b/blocks/gmo-program-details/gmo-program-details.css index b0972680..c653aafd 100644 --- a/blocks/gmo-program-details/gmo-program-details.css +++ b/blocks/gmo-program-details/gmo-program-details.css @@ -313,6 +313,16 @@ body { color: #505050; display: flex; align-items: center; + position: sticky; + position: -webkit-sticky; + top: 0; + } +} +.table-content { + height: 45vh; + overflow-y: auto; + &::-webkit-scrollbar { + display: none; } } .inactive { diff --git a/blocks/gmo-program-details/gmo-program-details.js b/blocks/gmo-program-details/gmo-program-details.js index 6a609229..5347cb4a 100644 --- a/blocks/gmo-program-details/gmo-program-details.js +++ b/blocks/gmo-program-details/gmo-program-details.js @@ -1,19 +1,24 @@ import { decorateIcons, readBlockConfig } from '../../scripts/lib-franklin.js'; import { getQueryVariable } from '../../scripts/shared.js'; -import { getProgramInfo } from '../../scripts/graphql.js'; +import { executeQuery } from '../../scripts/graphql.js'; import { resolveMappings, filterArray, getProductMapping, checkBlankString } from '../../scripts/shared-program.js'; import { getBaseConfigPath } from '../../scripts/site-config.js'; import { searchAsset } from '../../scripts/assets.js'; let blockConfig; const programName = getQueryVariable('programName'); +const programRefNumber = getQueryVariable('programReferenceNumber'); const deliverableMappings = resolveMappings("getDeliverableTypeMapping"); const platformMappings = resolveMappings("getPlatformsMapping"); export default async function decorate(block) { - const programData = await getProgramInfo(programName, "getProgramDetails"); - const deliverables = getProgramInfo(programName, "getProgramDeliverables"); + const encodedSemi = encodeURIComponent(';'); + const encodedProgram = encodeURIComponent(programName); + const programQueryString = `getProgramDetails${encodedSemi}programName=${encodedProgram}${encodedSemi}programReferenceNumber=${encodeURIComponent(programRefNumber)}`; + const programData = await executeQuery(programQueryString); + const deliverableQueryString = `getProgramDeliverables${encodedSemi}programName=${encodedProgram}`; + const deliverables = await executeQuery(deliverableQueryString); const p0TargetMarketArea = programData.data.programList.items[0].p0TargetMarketArea; const p1TargetMarketArea = programData.data.programList.items[0].p1TargetMarketArea; diff --git a/blocks/gmo-program-list/gmo-program-list.js b/blocks/gmo-program-list/gmo-program-list.js index 591ad9cc..4099efcb 100644 --- a/blocks/gmo-program-list/gmo-program-list.js +++ b/blocks/gmo-program-list/gmo-program-list.js @@ -165,7 +165,9 @@ async function buildCampaignList(campaigns, numPerPage) { campaignInfoWrapper.classList.add('campaign-info-wrapper', 'column-1'); const campaignIconLink = document.createElement('a'); - campaignIconLink.href = host + `/${detailsPage}?programName=${campaign.node.programName}`; + let campaignDetailsLink = host + `/${detailsPage}?programName=${campaign.node.programName}&`; + campaignDetailsLink += `programReferenceNumber=${campaign.node.programReferenceNumber ? campaign.node.programReferenceNumber : ""}` + campaignIconLink.href = campaignDetailsLink; const campaignIcon = document.createElement('div'); campaignIcon.classList.add('campaign-icon'); diff --git a/scripts/graphql.js b/scripts/graphql.js index 6677ef1b..504685ba 100644 --- a/scripts/graphql.js +++ b/scripts/graphql.js @@ -222,23 +222,18 @@ export function generateFilterJSON(filterParams) { return result; } -// add additional query types as needed -export async function getProgramInfo(programName, queryType) { +// general function for executing graphql queries +export async function executeQuery(queryString) { const baseApiUrl = `${await getGraphqlEndpoint()}/graphql/execute.json`; const projectId = 'gmo'; - //const queryName = (queryType == "deliverables") ? "getProgramDeliverables" : "getProgramDetails"; - const encodedProgramName = encodeURIComponent(programName); - const encodedSemiColon = encodeURIComponent(';'); - //persisted query URLs have to be encoded together with the first semicolon - const graphqlEndpoint = `${baseApiUrl}/${projectId}/${queryType}${encodedSemiColon}programName=${encodedProgramName}`; + const queryEndpoint = `${baseApiUrl}/${projectId}/${queryString}`; const jwtToken = await getBearerToken(); - // Return the fetch promise chain so that it can be awaited outside - return fetch(graphqlEndpoint, { - method: 'GET', - headers: { - Authorization: jwtToken, - }, + return fetch(queryEndpoint, { + method: 'GET', + headers: { + Authorization: jwtToken, + }, }).then(response => { if (!response.ok) { throw new Error(`HTTP error! Status: ${response.status}`); @@ -250,4 +245,4 @@ export async function getProgramInfo(programName, queryType) { console.error('Error fetching data: ', error); throw error; // Rethrow or handle error as appropriate }); -} \ No newline at end of file +}; \ No newline at end of file