#11 - Update images on careers

astro.config.mjs

@@ -8,6 +8,9 @@ export default defineConfig({
   compressHTML: true,
   site: process.env.ASTRO_SITE,
   trailingSlash: 'always',
+  image: {
+    domains: ['assets.codyops.com','assets.codyops.com.br','assets.codyops.com.es'],
+  },
   integrations: [
     markdownIntegration({
       remarkPlugins: [],

src/libs/careers.ts

@@ -10,6 +10,7 @@ export async function getCareers(): Promise<Careers[]> {
         'slug',
         'name',
         'description',
+        'banner',
         {
           courses: [
             {

src/pages/carreras/[slug].astro

@@ -39,7 +39,7 @@ const FeaturesComponent = (await import(`../../sections/${career.slug}/${career.
       <div class="banner py-10 position-relative">
         <figure class="banner__background-container-image">
           <div class="overlay"></div>
-          <Image src={`/src/assets/img/careers/${career.slug}-banner-desktop.webp`} alt={`${career.name} image`} width={100} height={100} />
+          <Image src={`${import.meta.env.ASTRO_ASSETS}/${career.banner}`} alt={`${career.name} image`} width={1920} height={475} />
         </figure>
         <FeaturesComponent />
       </div> 

src/types/codyops-careers.ts

@@ -12,6 +12,7 @@ export interface Careers {
   date_updated: string | null;
   name: string;
   description: string;
+  banner: string;
   courses: {
     codyops_courses_id: Courses;
   }[];