revert: restore lucide-react icons for emails

components/email/components/Footer.tsx

@@ -1,17 +1,12 @@
-const iconStyle = {
+import {
-  display: 'inline-block',
+  User,
-  verticalAlign: 'middle'
+  Building2,
-};
+  Mail,
-
+  LogOut,
-const Icon = ({ name, size = 16 }: { name: string; size?: number }) => (
+  LayoutGrid,
-  <img
+  Shield,
-    src={`${process.env.NEXT_PUBLIC_HOME_URL}/email-icons/${name}.png`}
+  Home
-    width={size}
+} from 'lucide-react';
-    height={size}
-    alt=""
-    style={iconStyle}
-  />
-);
 
 export const Footer = () => {
   return (
@@ -49,7 +44,7 @@ export const Footer = () => {
               letterSpacing: '0.05em'
             }}
           >
-            <Icon name="user" size={16} />
+            <User size={16} color='#386FA4' />
             Contact Us
           </h4>
           <p
@@ -62,7 +57,7 @@ export const Footer = () => {
               color: '#4A5568'
             }}
           >
-            <Icon name="building-2" size={14} />
+            <Building2 size={14} color='#386FA4' />
             {process.env.NEXT_PUBLIC_BRAND_NAME}
           </p>
           <p
@@ -75,7 +70,7 @@ export const Footer = () => {
               color: '#4A5568'
             }}
           >
-            <Icon name="mail" size={14} />
+            <Mail size={14} color='#386FA4' />
             <a
               href={`mailto:${process.env.NEXT_PUBLIC_BRAND_EMAIL}`}
               style={{ color: '#386FA4', textDecoration: 'none' }}
@@ -93,7 +88,7 @@ export const Footer = () => {
               color: '#4A5568'
             }}
           >
-            <Icon name="log-out" size={14} />
+            <LogOut size={14} color='#386FA4' />
             <span>
               Click{' '}
               <a
@@ -129,7 +124,7 @@ export const Footer = () => {
               letterSpacing: '0.05em'
             }}
           >
-            <Icon name="layout-grid" size={16} />
+            <LayoutGrid size={16} color='#386FA4' />
             Quick Links
           </h4>
           <p
@@ -142,7 +137,7 @@ export const Footer = () => {
               color: '#4A5568'
             }}
           >
-            <Icon name="shield" size={14} />
+            <Shield size={14} color='#386FA4' />
             <a
               href={`${process.env.NEXT_PUBLIC_HOME_URL}/privacy`}
               style={{ color: '#386FA4', textDecoration: 'none' }}
@@ -160,7 +155,7 @@ export const Footer = () => {
               color: '#4A5568'
             }}
           >
-            <Icon name="house" size={14} />
+            <Home size={14} color='#386FA4' />
             <a
               href={process.env.NEXT_PUBLIC_HOME_URL}
               style={{ color: '#386FA4', textDecoration: 'none' }}