Fix All Image Add Lazy Loading

src/app/darmasaba/_com/Footer.tsx

@@ -46,7 +46,7 @@ function Footer() {
                   <Group justify="apart" align="center" mt="lg">
                     <Text c="#F3F2EC" ta="center" fz="md" fw={700} style={{ fontStyle: 'italic' }}>&quot;Desa Kuat, Warga Sejahtera!&quot;</Text>
                     <ActionIcon size={80} radius="xl" variant="transparent">
-                      <Image src="/chatbot-removebg-preview.png" alt="Logo Desa" width={80} height={80} />
+                      <Image src="/chatbot-removebg-preview.png" alt="Logo Desa" width={80} height={80} loading="lazy"/>
                     </ActionIcon>
                   </Group>
                 </Stack>

src/app/darmasaba/_com/Navbar.tsx

@@ -38,7 +38,7 @@ export function Navbar() {
               }}
             >
               <Tooltip label="Go to homepage" position="bottom" withArrow>
-                <Image src="/darmasaba-icon.png" alt="Village Logo" width={48} height={48} />
+                <Image src="/darmasaba-icon.png" alt="Village Logo" width={48} height={48} loading="lazy"/>
               </Tooltip>
             </ActionIcon>
             <Tooltip label={mobileOpen ? "Close menu" : "Open menu"} position="bottom" withArrow>

src/app/darmasaba/_com/main-page/desaantikorupsi/FlipScroll.tsx

@@ -28,7 +28,7 @@ const FlipOnScroll = () => {
 
         }}
       >
-        <Image src={"https://awsimages.detik.net.id/community/media/visual/2023/04/14/gambar-pemandangan-6_169.jpeg?w=1200"} alt="a" />
+        <Image src={"https://awsimages.detik.net.id/community/media/visual/2023/04/14/gambar-pemandangan-6_169.jpeg?w=1200"} alt="a" loading="lazy"/>
       </motion.div>
 
     </div>

src/app/darmasaba/_com/main-page/landing-page/ProfileView.tsx

@@ -39,6 +39,7 @@ export default function ProfileView({ data }: ProfileViewProps) {
           alt={data.name || 'Foto profil'}
           fit="cover"
           radius="lg"
+          loading="lazy"
         />
       ) : (
         <Stack align="center" gap="xs" w="100%" py="xl">

src/app/darmasaba/_com/main-page/landing-page/index.tsx

@@ -129,12 +129,12 @@ function LandingPage() {
                 <Grid w="100%">
                   <Grid.Col span={{ base: 3, sm: 2 }}>
                     <Box bg="white" w={72} h={72} p="sm" style={{ borderRadius: 24 }}>
-                      <Image src="/darmasaba-icon.png" alt="Logo Darmasaba" fit="contain" />
+                      <Image loading="lazy" src="/darmasaba-icon.png" alt="Logo Darmasaba" fit="contain" />
                     </Box>
                   </Grid.Col>
                   <Grid.Col span={{ base: 9, sm: 10 }}>
                     <Box bg="white" w={72} h={72} p="sm" style={{ borderRadius: 24 }}>
-                      <Image src="/pudak-icon.png" alt="Logo Pudak" fit="contain" />
+                      <Image loading="lazy" src="/pudak-icon.png" alt="Logo Pudak" fit="contain" />
                     </Box>
                   </Grid.Col>
                   <Grid.Col span={12}>

src/app/darmasaba/_com/main-page/sdgs/index.tsx

@@ -101,6 +101,7 @@ export default function SDGS() {
                           w={mobile ? 90 : 110}
                           h={mobile ? 90 : 110}
                           fit="contain"
+                          loading="lazy"
                         />
                       </Box>
                     </Center>