feat module 3 : remove contact info, delivery information, replace stay in touch, remove section stay in touch

src/components/Footer/Footer.jsx

-import { useState } from 'react';
-import { Box, Typography, TextField, Button, InputAdornment } from '@mui/material';
+// import { useState } from 'react';
+// import { Box, Typography, TextField, Button, InputAdornment } from '@mui/material';
+import { Box, Typography } from '@mui/material';
 import logoSrc from "../../assets/images/amberlogofooter.png";
 import Grid from '@mui/material/Grid2';
 import InstagramIcon from '@mui/icons-material/Instagram';
 import WhatsAppIcon from '@mui/icons-material/WhatsApp';
 import LocalPhoneIcon from '@mui/icons-material/LocalPhone';
 
-import customerService from '../../services/CustomerService';
+// import customerService from '../../services/CustomerService';
 
 
 const TikTokIcon = ({ color = "#000000" }) => {
 
 const Footer = () => {
 
-  const [email, setEmail] = useState("")
+  // const [email, setEmail] = useState("")
 
   return (
     <Box
 
         <Grid item size={{ xs: 12, sm: 6, md: 6, lg: 4, xl: 4 }} sx={{ position: "relative" }}>
 
+          {/*
           <Typography variant="body1" sx={{ fontWeight: "bold", mb: 4 }}>
             Contact Info
           </Typography>
+          */}
           <Typography variant="body2" sx={{ maxWidth: 350, mb: 2 }}><span style={{ fontWeight: "bold" }}>AMBER MODE (M) SDN BHD (1109469-M) <br /> </span> Lot G-77, Wangsa Walk Mall, <br />Wangsa Avenue, <br />No.9, Jalan Wangsa Perdana 1, <br />Bandar Wangsa Maju, <br />53300 Kuala Lumpur, <br />Malaysia</Typography>
           <Typography
             variant="body2"
 
         </Grid>
 
-
         <Grid item size={{ xs: 12, sm: 6, md: 6, lg: 3, xl: 3 }} sx={{ pl: { xs: 0, sm: 0, md: 0, lg: 5, xl: 5 } }}>
           <Typography variant="body1" sx={{ fontWeight: "bold", mb: 4 }}>
             Get Help
           </Typography>
           <nav>
+            {/*
             <Typography variant="body2" sx={{ mb: 1 }}>
               <a href='/delivery_info' style={{ textDecoration: 'none', color: 'inherit', cursor:"pointer" }}>Delivery Information</a>
             </Typography>
+            */}
             <Typography variant="body2" sx={{ mb: 1 }}>
               <a href='/sale_terms_and_condition' style={{ textDecoration: 'none', color: 'inherit', cursor:"pointer" }}>Sale Terms & Conditions</a>
             </Typography>
         </Grid>
 
         <Grid item size={{ xs: 12, sm: 6, md: 6, lg: 4, xl: 4 }}>
+          <Typography
+            variant="h4"
+            sx={{
+              fontFamily: '"Big Caslon", "Times New Roman", serif',
+              fontWeight: "400",
+              mb: 4,
+              color: "#000",
+            }}
+          >
+            Find us on our socials
+          </Typography>
+
+          <Box sx={{ display: "flex", gap: 1.5, alignItems: "center", color: "#95AAC5" }}>
+            <a
+              href="https://wa.me/+60172282072"
+              target="_blank"
+              rel="noreferrer"
+              style={{
+                color: "inherit",
+                lineHeight: 0,
+              }}><WhatsAppIcon fontSize="small" />
+            </a>
+            <a
+              href="https://www.instagram.com/amber.officials/?hl=en"
+              target="_blank"
+              rel="noreferrer"
+              style={{
+                color: "inherit",
+                lineHeight: 0,
+              }}><InstagramIcon fontSize="small" />
+            </a>
+            <a
+              href="https://www.tiktok.com/@ambermodeofficial"
+              target="_blank"
+              rel="noreferrer"
+              style={{
+                color: "inherit",
+                lineHeight: 0,
+              }}><TikTokIcon color={"#95AAC5"} />
+            </a>
+          </Box>
+
+          {/*
           <Typography variant="body1" sx={{ fontWeight: "bold", mb: 4 }}>
             Let’s stay in touch
           </Typography>
             </Box>
 
           </Box>
+          */}
         </Grid>
       </Grid>
     </Box>

src/pages/Home.jsx

 import CarouselContainer from '../components/CarouselContainer'
 import ProductSelected from '../components/ProductSelected'
 import SocialMedia from '../components/SocialMedia'
-import Feature from '../components/Feature'
+// import Feature from '../components/Feature'
 import { Link } from '@mui/material'
 import VideoAds from '../components/VideoAds'
 import ProductType from '../components/ProductType';
-import NewsLetter from '../components/NewsLetter';
+// import NewsLetter from '../components/NewsLetter';
 import ProductService from "../services/ProductService"
 import AmberHomeWallpaper from "../assets/images/amberHomeWallpaper.webp";
 import AmberBeautyWallpaper from "../assets/images/amberBeautyWallpaper.webp";
 
       </Box>
 
+      {/*
       <NewsLetter />
+      */}
 
       <Box sx={{ px:{
         xs: 2,
         lg: 5
       }, mb: 10 }}>
 
+        {/*
         <Feature />
+        */}
       </Box>
 
 
   )
 }
 
-export default Home
+export default Home