Skip to content

Commit

Permalink
Merge pull request #1743 from tommygonzaleza/main
Browse files Browse the repository at this point in the history 
Allow getting info from landing_variables
  • Loading branch information
@tommygonzaleza
tommygonzaleza authored Dec 16, 2024
2 parents 8e832fc + 8c70746 commit d399194
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 32 deletions.
70 changes: 40 additions & 30 deletions src/pages/bootcamp/[course_slug].jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -258,6 +258,16 @@ function CoursePage({ data }) {
};
const featurePrice = getPlanPrice().toLocaleLowerCase();

const getAlternativeTranslation = (slug) => {
const keys = slug.split('.');
const result = keys.reduce((acc, key) => {
if (acc && acc[key] !== undefined) return acc[key];
return null;
}, data?.course_translation?.landing_variables);

return result !== null ? result : t(slug);
};

useEffect(() => {
if (isRigoInitialized && data.course_translation && !initialDataIsFetching) {
const context = document.body.innerText;
Expand Down Expand Up @@ -570,13 +580,13 @@ function CoursePage({ data }) {
) : (
<>
<Heading as="span" size={{ base: '38px', md: '46px' }} fontFamily="lato" letterSpacing="0.05em" fontWeight="normal" lineHeight="normal">
{!isVisibilityPublic ? t('title-connectors.learning') : t('title-connectors.start')}
{!isVisibilityPublic ? getAlternativeTranslation('title-connectors.learning') : getAlternativeTranslation('title-connectors.start')}
</Heading>
<Heading as="span" color="blue.default" width="100%" size={{ base: '42px', md: '64px' }} lineHeight="1.1" fontFamily="Space Grotesk Variable" fontWeight={700}>
{data?.course_translation?.title}
</Heading>
<Heading as="span" size={{ base: '38px', md: '46px' }} fontFamily="lato" letterSpacing="0.05em" fontWeight="normal" lineHeight="normal">
{!isVisibilityPublic ? t('title-connectors.own-pace') : t('title-connectors.end')}
{!isVisibilityPublic ? getAlternativeTranslation('title-connectors.own-pace') : getAlternativeTranslation('title-connectors.end')}
</Heading>
</>
)
Expand Down Expand Up @@ -622,7 +632,7 @@ function CoursePage({ data }) {
: (

<Text size="16px" color="currentColor" fontWeight={400}>
{students.length > limitViewStudents ? t('students-enrolled-count', { count: students.length - limitViewStudents }) : ''}
{students.length > limitViewStudents ? getAlternativeTranslation('students-enrolled-count', { count: students.length - limitViewStudents }) : ''}
</Text>
)}
</Flex>
Expand Down Expand Up @@ -660,9 +670,9 @@ function CoursePage({ data }) {
</Flex>
<Flex flexDirection="column" gridColumn="9 / span 4" mt={{ base: '2rem', md: '0' }} ref={showBottomCTA}>
<ShowOnSignUp
title={t('join-cohort')}
title={getAlternativeTranslation('join-cohort')}
maxWidth="396px"
description={isAuthenticated ? t('join-cohort-description') : t('create-account-text')}
description={isAuthenticated ? getAlternativeTranslation('join-cohort-description') : getAlternativeTranslation('create-account-text')}
borderColor={data.color || 'green.400'}
textAlign="center"
gridGap="11px"
Expand Down Expand Up @@ -703,7 +713,7 @@ function CoursePage({ data }) {
textTransform="uppercase"
onClick={() => joinCohort()}
>
{t('join-cohort')}
{getAlternativeTranslation('join-cohort')}
</Button>
) : (
<>
Expand All @@ -717,7 +727,7 @@ function CoursePage({ data }) {
}}
>
{!featuredPlanToEnroll?.isFreeTier
? `${t('common:enroll-for-connector')} ${featurePrice}`
? `${getAlternativeTranslation('common:enroll-for-connector')} ${featurePrice}`
: capitalizeFirstLetter(featurePrice)}
</Button>
{payableList?.length > 0 && (
Expand Down Expand Up @@ -786,14 +796,14 @@ function CoursePage({ data }) {
<GridContainer maxWidth="1280px" padding="0 10px" gridTemplateColumns="repeat(12, 1fr)" childrenStyle={{ display: 'flex', flexDirection: 'column', gridGap: '100px' }} withContainer gridColumn="1 / span 12">
<Flex flexDirection="column">
<OneColumnWithIcon
title={t('rigobot.title')}
title={getAlternativeTranslation('rigobot.title')}
icon=""
handleButton={() => tryRigobot('#try-rigobot')}
buttonText={t('rigobot.button')}
buttonText={getAlternativeTranslation('rigobot.button')}
buttonProps={{ id: 'try-rigobot' }}
>
<Text size="14px" color="currentColor">
{t('rigobot.description')}
{getAlternativeTranslation('rigobot.description')}
</Text>
</OneColumnWithIcon>
</Flex>
Expand All @@ -807,14 +817,14 @@ function CoursePage({ data }) {
)}
<Flex flexDirection="column" gridGap="16px">
<Heading size="24px" lineHeight="normal" textAlign="center">
{t('build-connector.what-you-will')}
{getAlternativeTranslation('build-connector.what-you-will')}
{' '}
<Box as="span" color="blue.default">
{t('build-connector.build')}
{getAlternativeTranslation('build-connector.build')}
</Box>
</Heading>
<Text size="18px" textAlign="center">
{t('build-connector.description')}
{getAlternativeTranslation('build-connector.description')}
</Text>
<Flex flexDirection={{ base: 'column', md: 'row' }} gridGap={{ base: '10px', md: '32px' }} mt="16px">
{assignmentList?.length > 0 && assignmentList.slice(0, 3).map((item) => {
Expand Down Expand Up @@ -855,13 +865,13 @@ function CoursePage({ data }) {
<Flex flexDirection="column" gridGap="4rem">
<Flex flexDirection="column" gridGap="1rem">
<Heading size="24px" textAlign="center">
{t('why-learn-4geeks-connector.why-learn-with')}
{getAlternativeTranslation('why-learn-4geeks-connector.why-learn-with')}
{' '}
<Box as="span" color="blue.default">4Geeks</Box>
?
</Heading>
<Text size="18px" margin={{ base: 'auto', md: '0 8vw' }} textAlign="center" style={{ textWrap: 'balance' }}>
{t('why-learn-4geeks-connector.benefits-connector')}
{getAlternativeTranslation('why-learn-4geeks-connector.benefits-connector')}
</Text>
</Flex>
<Flex gridGap="2rem" flexDirection={{ base: 'column', md: 'row' }}>
Expand Down Expand Up @@ -910,12 +920,12 @@ function CoursePage({ data }) {

<MktTwoColumnSideImage
mt="6.25rem"
imageUrl={t('certificate.image')}
title={t('certificate.title')}
description={t('certificate.description')}
imageUrl={getAlternativeTranslation('certificate.image')}
title={getAlternativeTranslation('certificate.title')}
description={getAlternativeTranslation('certificate.description')}
informationSize="Medium"
buttonUrl={t('certificate.button-link')}
buttonLabel={t('certificate.button')}
buttonUrl={getAlternativeTranslation('certificate.button-link')}
buttonLabel={getAlternativeTranslation('certificate.button')}
containerProps={{
padding: '0px',
marginTop: '0px',
Expand All @@ -926,13 +936,13 @@ function CoursePage({ data }) {

<MktTwoColumnSideImage
mt="6.25rem"
imageUrl={t('job-section.image')}
title={t('job-section.title')}
subTitle={t('job-section.subtitle')}
description={t('job-section.description')}
imageUrl={getAlternativeTranslation('job-section.image')}
title={getAlternativeTranslation('job-section.title')}
subTitle={getAlternativeTranslation('job-section.subtitle')}
description={getAlternativeTranslation('job-section.description')}
informationSize="Medium"
buttonUrl={t('job-section.button-link')}
buttonLabel={t('job-section.button')}
buttonUrl={getAlternativeTranslation('job-section.button-link')}
buttonLabel={getAlternativeTranslation('job-section.button')}
imagePosition="right"
textBackgroundColor="#EEF9FE"
titleColor="#0097CF"
Expand Down Expand Up @@ -962,17 +972,17 @@ function CoursePage({ data }) {
gridColumn1="1 / span 7"
gridColumn2="8 / span 5"
gridGap="3rem"
title={t('show-prices.title')}
description={t('show-prices.description')}
title={getAlternativeTranslation('show-prices.title')}
description={getAlternativeTranslation('show-prices.description')}
plan={data?.plan_slug}
cohortId={cohortId}
/>
)}

<GridContainer padding="0 10px" maxWidth="1280px" width="100%" mt="6.25rem" withContainer childrenStyle={{ display: 'flex', flexDirection: 'column', gridGap: '100px' }} gridTemplateColumns="repeat(12, 1fr)" gridColumn="1 / 12 span">
<MktTrustCards
title={t('why-learn-with-4geeks.title')}
description={t('why-learn-with-4geeks.description')}
title={getAlternativeTranslation('why-learn-with-4geeks.title')}
description={getAlternativeTranslation('why-learn-with-4geeks.description')}
/>
</GridContainer>
{/* FAQ section */}
Expand Down
4 changes: 2 additions & 2 deletions src/pages/pricing.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -336,9 +336,9 @@ function PricingView() {
<Text fontSize="auto">{t('see-plans-and-prices')}</Text>
<Icon icon="longArrowRight" width="18px" height="18px" color="white" />
</Link>
{course?.course_translation?.landing_variables?.length > 0 && (
{course?.course_translation?.landing_variables?.card?.length > 0 && (
<Flex flexDirection="column" gridGap="10px" borderRadius="4px" padding="12px">
{course?.course_translation?.landing_variables.map((content) => {
{course?.course_translation?.landing_variables?.card?.map((content) => {
const isUrlImage = content?.icon?.includes('http');
return (
<Flex key={content.title} gridGap="10px">
Expand Down

0 comments on commit d399194

Please sign in to comment.