Merge pull request #1558 from tommygonzaleza/development

tommygonzaleza · web-flow · commit e3bf6375becf · 2024-08-01T23:38:17.000-04:00
Change card used on workshop's landing
diff --git a/public/alias-redirects.json b/public/alias-redirects.json
diff --git a/public/locales/en/footer.json b/public/locales/en/footer.json
@@ -11,6 +11,10 @@
     "label": "Terms & Conditions",
     "href": "/terms-and-conditions"
   },
+  "privacy": {
+    "label": "Privacy Policy",
+    "href": "/privacy-policy"
+  },
   "company":{
     "title":"COMPANY",
     "items": [
diff --git a/public/locales/en/podcast.json b/public/locales/en/podcast.json
@@ -48,12 +48,12 @@
   }, {
     "name": "Tomas Gonzalez",
     "description": "4Geeks Academy co-founder",
-    "profile-picture": "https://media.licdn.com/dms/image/C5603AQH-T8ZePCIzYg/profile-displayphoto-shrink_400_400/0/1649829192473?e=2147483647&v=beta&t=jj9Bh0mC2ktumfuC64pNwWdS-e1aMRLechr_uxW5CvE",
+    "profile-picture": "https://storage.googleapis.com/breathecode/logos/foto-perfil-4geeks.jpeg",
     "bio": "A passionate coder, Tomas embarked on his programming journey four years ago after graduating as a Full Stack developer from the renowned 4Geeks Academy bootcamp. Overcoming numerous challenges, he honed his skills and became a proficient developer. Today, as Co-founder of 4Geeks.com, Tomas leverages his expertise to lead a team of six programmers and continues to make strides in the tech world. With a background in teaching at 4Geeks Academy Miami and creating various programming courses in different languages, Tomas is dedicated to empowering others through education and innovation.",
     "media": [{
       "name": "linkedin",
       "logo": "linkedin",
       "href": "https://www.linkedin.com/in/tomasgonzaleza"
     }]
   }]
-}
+}
diff --git a/public/locales/en/pricing.json b/public/locales/en/pricing.json
@@ -22,6 +22,10 @@
     "description": "We have a free plan for you, with it you can enjoy many of our benefits, including a free feedback session.",
     "button": "join for free"
   },
+  "why-trust-us": {
+    "title": "Why trust us?",
+    "description": "We have 9+ years helping people to learn to code, more than 4000 students graduated, and 84% of our students graduated from our bootcamp got hired!"
+  },
   "faq": [{
     "label": "What payment options do we accept?",
     "answer": "At 4Geeks.com, we currently accept payments via credit and debit cards. We strive to make the subscription process convenient for our users, and as such, we support major credit and debit card providers for seamless transactions."
diff --git a/public/locales/es/footer.json b/public/locales/es/footer.json
@@ -11,6 +11,10 @@
     "label": "Términos y condiciones",
     "href": "/es/terminos-y-condiciones"
   },
+  "privacy": {
+    "label": "Políticas de Privacidad",
+    "href": "/es/politicas-de-privacidad"
+  },
   "company":{
     "title":"EMPRESA",
     "items":[
diff --git a/public/locales/es/podcast.json b/public/locales/es/podcast.json
@@ -48,7 +48,7 @@
   }, {
     "name": "Tomas Gonzalez",
     "description": "4Geeks Academy co-founder",
-    "profile-picture": "https://media.licdn.com/dms/image/C5603AQH-T8ZePCIzYg/profile-displayphoto-shrink_400_400/0/1649829192473?e=2147483647&v=beta&t=jj9Bh0mC2ktumfuC64pNwWdS-e1aMRLechr_uxW5CvE",
+    "profile-picture": "https://storage.googleapis.com/breathecode/logos/foto-perfil-4geeks.jpeg",
     "bio": "Tomas, un programador apasionado, se embarcó en su viaje de programación hace cuatro años después de graduarse como desarrollador Full Stack en el reconocido bootcamp 4Geeks Academy. Superando numerosos desafíos, perfeccionó sus habilidades y se convirtió en un desarrollador competente. Hoy, como cofundador de 4Geeks.com, Tomas aprovecha su experiencia para liderar un equipo de seis programadores y continúa avanzando en el mundo de la tecnología. Con experiencia en la enseñanza en 4Geeks Academy Miami y la creación de varios cursos de programación en diferentes idiomas, Tomas se dedica a empoderar a otros a través de la educación y la innovación.",
     "media": [{
       "name": "linkedin",
diff --git a/public/locales/es/pricing.json b/public/locales/es/pricing.json
@@ -22,6 +22,10 @@
     "description": "Tenemos un plan gratis para ti, con él puedes acceder de forma limitada a todos los servicios, incluyendo mentorías y workshops gratis.",
     "button": "Únete gratis"
   },
+  "why-trust-us": {
+    "title": "¿Por qué debería aprender con 4Geeks?",
+    "description": "¡Tenemos más de 9 años enseñando a programar, más de 4000 estudiantes graduados y el 84% de nuestros graduados consiguieron trabajo!"
+  },
   "faq": [{
     "label": "¿Qué opciones de pago aceptamos?",
     "answer": "Actualmente aceptamos pagos con tarjetas de crédito y débito. Nos esforzamos por hacer el proceso de suscripción conveniente para nuestros usuarios."
diff --git a/public/redirects-from-api.json b/public/redirects-from-api.json
diff --git a/public/sitemap.xml b/public/sitemap.xml
@@ -2,26 +2,26 @@
 <sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <sitemap>
     <loc>https://4geeks.com/pages-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
   <sitemap>
     <loc>https://4geeks.com/howto-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
   <sitemap>
     <loc>https://4geeks.com/lessons-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
   <sitemap>
     <loc>https://4geeks.com/projects-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
   <sitemap>
     <loc>https://4geeks.com/exercises-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
   <sitemap>
     <loc>https://4geeks.com/technologies-sitemap.xml</loc>
-    <lastmod>2024-05-08T22:20:12.800Z</lastmod>
+    <lastmod>2024-08-01T23:38:14.331Z</lastmod>
   </sitemap>
 </sitemapindex>
diff --git a/public/syllabus.json b/public/syllabus.json
@@ -1 +1 @@
-"[\n    {\"label\": \"Web Developer\", \"href\": \"/read/web-development\"},{\"label\": \"Full-Stack Software Developer - 16w\", \"href\": \"/read/full-stack\"}\n  ]"
+"[\n    {\"label\": \"Full-Stack Software Developer\", \"href\": \"/read/full-stack\"},{\"label\": \"Web Developer\", \"href\": \"/read/web-development\"}\n  ]"
diff --git a/src/common/components/DynamicContentCard/HeadInfo.jsx b/src/common/components/DynamicContentCard/HeadInfo.jsx
@@ -35,10 +35,9 @@ function HeadInfo({ technologies, duration, type, date }) {
   const intervalDurationText = getIntervalDurationTranslation(date);
   const existsDuration = intervalDurationText || duration;
   const isWorkshop = type === 'workshop';
-  const shouldDisplay = technologies?.length > 0 || existsDuration || isWorkshop;
 
   return (
-    <Flex display={shouldDisplay ? 'flex' : 'none'} alignItems="center" justifyContent="space-between" width="100%">
+    <Flex minHeight="24px" alignItems="center" justifyContent="space-between" width="100%">
       {technologies?.length > 0 ? (
         <Flex alignItems="center" gridGap="8px">
           {technologies.filter((tech) => tech.icon_url).map((tech) => {
diff --git a/src/common/components/DynamicContentCard/index.jsx b/src/common/components/DynamicContentCard/index.jsx
@@ -24,6 +24,8 @@ const getAssetPath = (asset) => {
 };
 
 export const getDifficultyColors = (currDifficulty) => {
+  const currentDifficulty = currDifficulty.toLowerCase();
+
   const background = {
     beginner: 'featuredLight',
     easy: 'green.light',
@@ -37,14 +39,14 @@ export const getDifficultyColors = (currDifficulty) => {
     hard: '#7e0000',
   };
   return {
-    bg: background[currDifficulty],
-    color: color[currDifficulty],
+    bg: background[currentDifficulty],
+    color: color[currentDifficulty],
   };
 };
 
 function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest }) {
   const { t, lang } = useTranslation('live-event');
-  const { featuredColor, borderColor } = useStyle();
+  const { featuredColor, borderColor, backgroundColor, fontColor } = useStyle();
   const [date, setDate] = useState({});
   const language = data?.lang;
   const { formattedTime } = useFormatDate();
@@ -104,7 +106,20 @@ function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest
   }, [lang]);
 
   return (
-    <Flex flexDirection="column" border={isWorkshopStarted ? 'solid 2px' : 'solid 1px'} borderColor={isWorkshopStarted ? 'blue.default' : borderColor} padding={isWorkshop ? '10px 16px 0px' : '16px'} gridGap="14px" width={isWorkshop ? { base: '310px', md: '360px' } : 'auto'} background={isWorkshopStarted ? featuredColor : 'inherit'} borderRadius="10px" position="relative" {...rest}>
+    <Flex
+      flexDirection="column"
+      border={isWorkshopStarted ? 'solid 2px' : 'solid 1px'}
+      borderColor={isWorkshopStarted ? 'blue.default' : borderColor}
+      padding={isWorkshop ? '10px 16px 0px' : '16px'}
+      gridGap="14px"
+      width={isWorkshop ? { base: '310px', md: '360px' } : 'auto'}
+      minWidth={{ base: '280px', md: '310px' }}
+      background={isWorkshopStarted ? featuredColor : backgroundColor}
+      color={fontColor}
+      borderRadius="10px"
+      position="relative"
+      {...rest}
+    >
       {/* <--------------- Head content (average duration and technology icon/tag) ---------------> */}
       <HeadInfo
         technologies={data?.technologies || technologies}
@@ -130,27 +145,30 @@ function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest
               {data?.title}
             </Box>
           ) : (
-            <Link
-              href={getLink()}
-              onClick={() => {
-                reportDatalayer({
-                  dataLayer: {
-                    event: 'select_content',
-                    asset_slug: data?.slug,
-                    asset_title: data?.title,
-                    asset_lang: data?.lang,
-                    asset_category: data?.category?.slug,
-                  },
-                });
-              }}
-              _after={{
-                content: '""',
-                position: 'absolute',
-                inset: 0,
-              }}
-            >
-              {data?.title}
-            </Link>
+            <Flex flexDirection="row" justifyContent="space-between">
+              <Link
+                href={getLink()}
+                onClick={() => {
+                  reportDatalayer({
+                    dataLayer: {
+                      event: 'select_content',
+                      asset_slug: data?.slug,
+                      asset_title: data?.title,
+                      asset_lang: data?.lang,
+                      asset_category: data?.category?.slug,
+                    },
+                  });
+                }}
+                _after={{
+                  content: '""',
+                  position: 'absolute',
+                  inset: 0,
+                }}
+              >
+                {data?.title}
+              </Link>
+              <Icon icon="arrowRight" color={fontColor} width="15px" height="15px" />
+            </Flex>
           )}
         </Heading>
         {description?.length > 0 && (
@@ -202,9 +220,9 @@ function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest
                   {`By ${data?.host_user?.first_name} ${data?.host_user?.last_name}`}
                 </Text>
                 {data?.host_user?.profesion && (
-                <Text fontSize="12px" lineHeight="normal">
-                  {data.host_user.profesion}
-                </Text>
+                  <Text fontSize="12px" lineHeight="normal">
+                    {data.host_user.profesion}
+                  </Text>
                 )}
               </Flex>
             </Flex>
@@ -231,10 +249,10 @@ function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest
       </Flex>
 
       <Box display={[types.workshop, types.project].includes(type) ? 'block' : 'none'}>
-        <Divider mb={isWorkshop ? '0px' : '16px'} />
         {/* <--------------- Event link ---------------> */}
         {isWorkshop ? (
           <>
+            <Divider mb={isWorkshop ? '0px' : '16px'} />
             {date?.ended ? (
               <Text size="17px" padding="10px 0" lineHeight="normal" textAlign="center" fontWeight={700}>
                 {date?.text}
@@ -265,32 +283,35 @@ function DynamicContentCard({ data, type, technologies, usersWorkedHere, ...rest
         ) : (
           <>
             {type === types.project && usersWorkedHere?.length > 0 && (
-              <Flex gridGap="8px" alignItems="center">
-                {usersWithPicture?.map((user, index) => {
-                  const avatarNumber = adjustNumberBeetwenMinMax({
-                    number: user?.id,
-                    min: 1,
-                    max: 20,
-                  });
-                  const avatar = user?.profile?.avatar_url || `${BREATHECODE_HOST}/static/img/avatar-${avatarNumber}.png`;
-                  return (
-                    <Avatar
-                      key={user?.id}
-                      width="32px"
-                      height="32px"
-                      style={{ userSelect: 'none' }}
-                      src={avatar}
-                      marginLeft={index !== 0 && usersWorkedHere.length > index ? '-24px' : '0px'}
-                      zIndex={index}
-                    />
-                  );
-                })}
-                {remainingUsers && (
-                  <Text size="12px">
-                    {t('students-worked-here', { count: remainingUsers })}
-                  </Text>
-                )}
-              </Flex>
+              <>
+                <Divider mb={isWorkshop ? '0px' : '16px'} />
+                <Flex gridGap="8px" alignItems="center">
+                  {usersWithPicture?.map((user, index) => {
+                    const avatarNumber = adjustNumberBeetwenMinMax({
+                      number: user?.id,
+                      min: 1,
+                      max: 20,
+                    });
+                    const avatar = user?.profile?.avatar_url || `${BREATHECODE_HOST}/static/img/avatar-${avatarNumber}.png`;
+                    return (
+                      <Avatar
+                        key={user?.id}
+                        width="32px"
+                        height="32px"
+                        style={{ userSelect: 'none' }}
+                        src={avatar}
+                        marginLeft={index !== 0 && usersWorkedHere.length > index ? '-24px' : '0px'}
+                        zIndex={index}
+                      />
+                    );
+                  })}
+                  {remainingUsers && (
+                    <Text size="12px">
+                      {t('students-worked-here', { count: remainingUsers })}
+                    </Text>
+                  )}
+                </Flex>
+              </>
             )}
           </>
         )}
diff --git a/src/common/components/Footer.jsx b/src/common/components/Footer.jsx
@@ -352,13 +352,16 @@ function Footer({ pageProps }) {
         <Text marginBottom={['20px', '20px', '0', '0']} fontSize="sm">{t('copyright', { name: copyrightName, year: actualYear })}</Text>
         <Flex
           wrap={['wrap', 'wrap', 'nowrap', 'nowrap']}
-          justifyContent="center"
-          width={['100%', '100%', '35%', '40%']}
+          justifyContent={['center', 'center', 'space-between', 'space-between']}
+          width={['100%', '100%', '35%', '25%']}
         // alignItems="center"
         >
           <NextChakraLink href={t('terms.href')}>
             <Text fontSize="sm">{t('terms.label')}</Text>
           </NextChakraLink>
+          <NextChakraLink href={t('privacy.href')}>
+            <Text fontSize="sm">{t('privacy.label')}</Text>
+          </NextChakraLink>
         </Flex>
       </Flex>
     </Container>
diff --git a/src/common/components/SmallCardsCarousel.jsx b/src/common/components/SmallCardsCarousel.jsx
diff --git a/src/pages/pricing.jsx b/src/pages/pricing.jsx
diff --git a/src/pages/workshops/[event_slug].jsx b/src/pages/workshops/[event_slug].jsx

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-"[\n {\"label\": \"Web Developer\", \"href\": \"/read/web-development\"},{\"label\": \"Full-Stack Software Developer - 16w\", \"href\": \"/read/full-stack\"}\n ]"`
	`1`	`+"[\n {\"label\": \"Full-Stack Software Developer\", \"href\": \"/read/full-stack\"},{\"label\": \"Web Developer\", \"href\": \"/read/web-development\"}\n ]"`