Skip to content

Commit 222d26f

Browse files
jaayysonijaayysoni
committed
Project Working Successfully
1 parent fdc3fed commit 222d26f

2 files changed

Lines changed: 42 additions & 24 deletions

File tree

‎app/services/sendgrid_service.py‎

Lines changed: 7 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,28 @@
11
# app/services/sendgrid_service.py
2-
32
import os
43
from sendgrid import SendGridAPIClient
54
from sendgrid.helpers.mail import Mail
65
from dotenv import load_dotenv
76

8-
load_dotenv() # Load .env file
7+
load_dotenv()
98

109
SENDGRID_API_KEY = os.getenv("SENDGRID_API_KEY")
11-
TEMPLATE_ID = os.getenv("SENDGRID_TEMPLATE_ID")
12-
FROM_EMAIL = os.getenv("FROM_EMAIL")
13-
14-
if not SENDGRID_API_KEY:
15-
raise ValueError("❌ SENDGRID_API_KEY is not set in environment")
16-
if not FROM_EMAIL:
17-
raise ValueError("❌ FROM_EMAIL is not set in environment")
18-
if not TEMPLATE_ID:
19-
raise ValueError("❌ SENDGRID_TEMPLATE_ID is not set in environment")
20-
10+
FROM_EMAIL = os.getenv("FROM_EMAIL") # e.g., "noreply@jaayysoni.com"
11+
TEMPLATE_ID = os.getenv("SENDGRID_TEMPLATE_ID") # Your SendGrid dynamic template ID
2112

2213
def send_email(to_email: str, name: str):
23-
"""
24-
Send an email using SendGrid dynamic template.
25-
"""
2614
message = Mail(
2715
from_email=FROM_EMAIL,
2816
to_emails=to_email,
2917
)
3018
message.template_id = TEMPLATE_ID
31-
message.dynamic_template_data = {"name": name}
19+
message.dynamic_template_data = {
20+
"name": name # This will replace {{name}} in your SendGrid template
21+
}
3222

3323
try:
3424
sg = SendGridAPIClient(SENDGRID_API_KEY)
3525
response = sg.send(message)
3626
print(f"✅ Email sent to {to_email}, Status Code: {response.status_code}")
3727
except Exception as e:
38-
print("❌ SendGrid Error:", e)
28+
print("❌ SendGrid Error:", str(e))

‎frontend/templates/Dashboard.html‎

Lines changed: 35 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,39 @@
77
<script src="https://cdn.tailwindcss.com"></script>
88
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
99
<style>
10-
/* Confetti, float, glow, toast, panel styles remain same */
10+
/* Confetti, float, glow, notification panel styles */
1111
@keyframes confetti {0% { transform: translateY(-100vh) rotate(0deg); opacity: 1; }100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }}
1212
.confetti-piece {position: absolute; width: 10px; height: 10px; background: var(--color); animation: confetti 6s linear infinite;}
1313
@keyframes float {0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
1414
.float { animation: float 3s ease-in-out infinite; }
1515
@keyframes glow {0%,100% { box-shadow: 0 0 10px rgba(56,189,248,0.6); } 50% { box-shadow: 0 0 40px rgba(56,189,248,1); } }
1616
.glow { animation: glow 1.5s ease-in-out 5; }
17-
.toast {position: fixed; bottom: 20px; right: 20px; background: #38bdf8; color: white; padding: 12px 20px; border-radius: 8px; font-weight: 600; box-shadow: 0 4px 10px rgba(0,0,0,0.2); opacity: 0; transform: translateY(20px); transition: all 0.5s ease; z-index: 100;}
18-
.toast.show {opacity: 1; transform: translateY(0);}
17+
18+
/* Notification Panel */
1919
.notification-panel {position: fixed; top: -100%; left: 0; right: 0; height: 40%; background: white; box-shadow: 0 4px 10px rgba(0,0,0,0.2); border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; transition: top 0.5s ease; overflow-y: auto; z-index: 50;}
2020
.notification-panel.active {top: 0;}
21+
22+
/* Centered persistent email notification */
23+
#emailNotification {
24+
position: fixed;
25+
top: 50%;
26+
left: 50%;
27+
transform: translate(-50%, -50%);
28+
background: #22c55e; /* Tailwind green-500 */
29+
color: white;
30+
padding: 20px 30px;
31+
border-radius: 12px;
32+
font-size: 18px;
33+
font-weight: 600;
34+
box-shadow: 0 8px 20px rgba(0,0,0,0.3);
35+
display: flex;
36+
align-items: center;
37+
gap: 10px;
38+
z-index: 200;
39+
}
40+
#emailNotification i {
41+
font-size: 24px;
42+
}
2143
</style>
2244
</head>
2345
<body class="h-screen bg-gradient-to-br from-sky-200 via-sky-100 to-gray-100 flex items-center justify-center overflow-hidden relative">
@@ -65,7 +87,11 @@ <h2 class="text-xl font-bold text-sky-600 mb-4">User Information</h2>
6587
</div>
6688
</div>
6789

68-
<div id="toast" class="toast">🎉 Notifications celebrated!</div>
90+
<!-- Centered Persistent Email Notification -->
91+
<div id="emailNotification">
92+
<i class="fas fa-check-circle"></i>
93+
🎉 Email sent to your inbox! Kindly check your spam folder if not found in inbox.
94+
</div>
6995

7096
<script>
7197
const confettiContainer = document.getElementById('confetti-container');
@@ -88,9 +114,6 @@ <h2 class="text-xl font-bold text-sky-600 mb-4">User Information</h2>
88114
const card = document.getElementById('dashboardCard');
89115
card.classList.add('glow');
90116
setTimeout(() => card.classList.remove('glow'), 4000);
91-
const toast = document.getElementById('toast');
92-
toast.classList.add('show');
93-
setTimeout(() => toast.classList.remove('show'), 3000);
94117
}
95118

96119
const panel = document.getElementById('notificationPanel');
@@ -101,6 +124,11 @@ <h2 class="text-xl font-bold text-sky-600 mb-4">User Information</h2>
101124
document.getElementById('closeNotifications').addEventListener('click', () => {
102125
panel.classList.remove('active');
103126
});
127+
128+
// Show confetti on page load
129+
window.addEventListener('load', () => {
130+
bombardment();
131+
});
104132
</script>
105133

106134
</body>

0 commit comments

Comments
 (0)