Compare commits
11 Commits
v0.1.0
...
ad79531f33
| Author | SHA1 | Date | |
|---|---|---|---|
| ad79531f33 | |||
| db1a401230 | |||
| cceb4d4e60 | |||
| ca20516080 | |||
| f2963ca951 | |||
| 8aea5bb400 | |||
| 14d0c2f9c3 | |||
| eb9ddc535f | |||
| 8fa17f58c9 | |||
| 92ed7a2c93 | |||
| ce644c31e1 |
@@ -3,7 +3,13 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/png" href="/favicon.png" />
|
<link rel="icon" type="image/png" href="/favicon.png" />
|
||||||
|
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" />
|
||||||
|
<link rel="manifest" href="/manifest.json" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta name="theme-color" content="#ec4899" />
|
||||||
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||||
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
||||||
|
<meta name="apple-mobile-web-app-title" content="Stargirlnails" />
|
||||||
<title>Stargirlnails Kiel - Terminbuchung</title>
|
<title>Stargirlnails Kiel - Terminbuchung</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "quests-template-basic",
|
"name": "quests-template-basic",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "0.0.0",
|
"version": "0.1.4",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"check:types": "tsc --noEmit",
|
"check:types": "tsc --noEmit",
|
||||||
|
|||||||
45
public/icons/README.md
Normal file
45
public/icons/README.md
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
# PWA Icons Required
|
||||||
|
|
||||||
|
This directory must contain the following icon files for proper PWA installation on iOS and Android devices:
|
||||||
|
|
||||||
|
## Required Icon Files
|
||||||
|
|
||||||
|
### Android Icons
|
||||||
|
- **icon-192x192.png** (192×192 pixels)
|
||||||
|
- Used for Android home screen and app drawer
|
||||||
|
- Should have transparent background or match theme color
|
||||||
|
- Include safe zone padding for maskable icons (40px margin)
|
||||||
|
|
||||||
|
- **icon-512x512.png** (512×512 pixels)
|
||||||
|
- Used for Android splash screens and high-resolution displays
|
||||||
|
- Should have transparent background or match theme color
|
||||||
|
- Include safe zone padding for maskable icons (102px margin)
|
||||||
|
|
||||||
|
### iOS Icon
|
||||||
|
- **apple-touch-icon.png** (180×180 pixels)
|
||||||
|
- Used for iOS home screen
|
||||||
|
- Should NOT have transparent background (iOS adds its own rounded corners)
|
||||||
|
- Fill entire canvas with brand colors/logo
|
||||||
|
- iOS automatically applies rounded corners and shadow
|
||||||
|
|
||||||
|
## Design Guidelines
|
||||||
|
|
||||||
|
1. **Brand consistency**: Use Stargirlnails logo and brand colors
|
||||||
|
2. **Theme color**: Primary pink (#ec4899) matches manifest theme_color
|
||||||
|
3. **Contrast**: Ensure icon is visible on various backgrounds
|
||||||
|
4. **Simplicity**: Icons should be recognizable at small sizes
|
||||||
|
5. **No text**: Avoid small text that becomes unreadable when scaled
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
|
||||||
|
After adding icons:
|
||||||
|
- Test on Android: Check home screen icon appearance
|
||||||
|
- Test on iOS Safari: Add to home screen and verify icon quality
|
||||||
|
- Validate with Lighthouse PWA audit
|
||||||
|
|
||||||
|
## Placeholder
|
||||||
|
|
||||||
|
Until actual icons are created, you can use a favicon.png (if available) or generate placeholder icons using tools like:
|
||||||
|
- https://realfavicongenerator.net/
|
||||||
|
- https://www.pwabuilder.com/imageGenerator
|
||||||
|
|
||||||
BIN
public/icons/apple-touch-icon.png
Normal file
BIN
public/icons/apple-touch-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
public/icons/icon-192x192.png
Normal file
BIN
public/icons/icon-192x192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
public/icons/icon-512x512.png
Normal file
BIN
public/icons/icon-512x512.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
32
public/manifest.json
Normal file
32
public/manifest.json
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
{
|
||||||
|
"name": "Stargirlnails Kiel - Terminbuchung",
|
||||||
|
"short_name": "Stargirlnails",
|
||||||
|
"description": "Online Terminbuchung für Nagelstudio Stargirlnails in Kiel",
|
||||||
|
"start_url": "/",
|
||||||
|
"scope": "/",
|
||||||
|
"display": "standalone",
|
||||||
|
"background_color": "#ffffff",
|
||||||
|
"theme_color": "#ec4899",
|
||||||
|
"orientation": "portrait",
|
||||||
|
"lang": "de",
|
||||||
|
"icons": [
|
||||||
|
{
|
||||||
|
"src": "/icons/icon-192x192.png",
|
||||||
|
"sizes": "192x192",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "any maskable"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/icons/icon-512x512.png",
|
||||||
|
"sizes": "512x512",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "any maskable"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/icons/apple-touch-icon.png",
|
||||||
|
"sizes": "180x180",
|
||||||
|
"type": "image/png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
@@ -55,6 +55,9 @@ if (process.env.NODE_ENV === 'production') {
|
|||||||
app.use('/assets/*', serveStatic({ root: './dist' }));
|
app.use('/assets/*', serveStatic({ root: './dist' }));
|
||||||
}
|
}
|
||||||
app.use('/favicon.png', serveStatic({ path: './public/favicon.png' }));
|
app.use('/favicon.png', serveStatic({ path: './public/favicon.png' }));
|
||||||
|
app.use('/AGB.pdf', serveStatic({ path: './public/AGB.pdf' }));
|
||||||
|
app.use('/icons/*', serveStatic({ root: './public' }));
|
||||||
|
app.use('/manifest.json', serveStatic({ path: './public/manifest.json' }));
|
||||||
app.route("/rpc", rpcApp);
|
app.route("/rpc", rpcApp);
|
||||||
app.route("/caldav", caldavApp);
|
app.route("/caldav", caldavApp);
|
||||||
app.get("/*", clientEntry);
|
app.get("/*", clientEntry);
|
||||||
|
|||||||
@@ -28,13 +28,17 @@ async function renderBrandedEmail(title, bodyHtml) {
|
|||||||
const domain = process.env.DOMAIN || 'localhost:5173';
|
const domain = process.env.DOMAIN || 'localhost:5173';
|
||||||
const protocol = domain.includes('localhost') ? 'http' : 'https';
|
const protocol = domain.includes('localhost') ? 'http' : 'https';
|
||||||
const homepageUrl = `${protocol}://${domain}`;
|
const homepageUrl = `${protocol}://${domain}`;
|
||||||
|
const instagramProfile = process.env.INSTAGRAM_PROFILE;
|
||||||
|
const tiktokProfile = process.env.TIKTOK_PROFILE;
|
||||||
|
const companyName = process.env.COMPANY_NAME || 'Stargirlnails Kiel';
|
||||||
return `
|
return `
|
||||||
<div style="font-family: Arial, sans-serif; color: #0f172a; background:#fdf2f8; padding:24px;">
|
<div style="font-family: Arial, sans-serif; color: #0f172a; background:#fdf2f8; padding:24px;">
|
||||||
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="max-width:640px; margin:0 auto; background:#ffffff; border-radius:12px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,0.06)">
|
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="max-width:640px; margin:0 auto; background:#ffffff; border-radius:12px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,0.06)">
|
||||||
<tr>
|
<tr>
|
||||||
<td style="padding:24px 24px 0 24px; text-align:center;">
|
<td style="padding:24px 24px 0 24px; text-align:center;">
|
||||||
${logo ? `<img src="${logo}" alt="Stargirlnails" style="width:120px; height:auto; display:inline-block;" />` : `<div style=\"font-size:24px\">💅</div>`}
|
${logo ? `<img src="${logo}" alt="${companyName}" style="width:120px; height:auto; display:inline-block;" />` : `<div style=\"font-size:24px\">💅</div>`}
|
||||||
<h1 style="margin:16px 0 0 0; font-size:22px; color:#db2777;">${title}</h1>
|
<div style="margin:16px 0 4px 0; font-size:16px; font-weight:600; color:#64748b;">${companyName}</div>
|
||||||
|
<h1 style="margin:0; font-size:22px; color:#db2777;">${title}</h1>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
@@ -46,6 +50,29 @@ async function renderBrandedEmail(title, bodyHtml) {
|
|||||||
<div style="text-align:center; margin-bottom:16px;">
|
<div style="text-align:center; margin-bottom:16px;">
|
||||||
<a href="${homepageUrl}" style="display: inline-block; background-color: #db2777; color: white; padding: 12px 24px; text-decoration: none; border-radius: 6px; font-weight: 600; font-size: 14px;">Zur Website</a>
|
<a href="${homepageUrl}" style="display: inline-block; background-color: #db2777; color: white; padding: 12px 24px; text-decoration: none; border-radius: 6px; font-weight: 600; font-size: 14px;">Zur Website</a>
|
||||||
</div>
|
</div>
|
||||||
|
${(instagramProfile || tiktokProfile) ? `
|
||||||
|
<div style="text-align:center; margin-bottom:16px;">
|
||||||
|
<p style="font-size:14px; color:#64748b; margin:0 0 8px 0;">Folge uns auf Social Media:</p>
|
||||||
|
<div style="display:inline-block;">
|
||||||
|
${instagramProfile ? `
|
||||||
|
<a href="${instagramProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
||||||
|
<svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24" style="vertical-align:middle; margin-right:6px;">
|
||||||
|
<path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/>
|
||||||
|
</svg>
|
||||||
|
Instagram
|
||||||
|
</a>
|
||||||
|
` : ''}
|
||||||
|
${tiktokProfile ? `
|
||||||
|
<a href="${tiktokProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:#000000; color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
||||||
|
<svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24" style="vertical-align:middle; margin-right:6px;">
|
||||||
|
<path d="M19.59 6.69a4.83 4.83 0 0 1-3.77-4.25V2h-3.45v13.67a2.89 2.89 0 0 1-5.2 1.74 2.89 2.89 0 0 1 2.31-4.64 2.93 2.93 0 0 1 .88.13V9.4a6.84 6.84 0 0 0-1-.05A6.33 6.33 0 0 0 5 20.1a6.34 6.34 0 0 0 10.86-4.43v-7a8.16 8.16 0 0 0 4.77 1.52v-3.4a4.85 4.85 0 0 1-1-.1z"/>
|
||||||
|
</svg>
|
||||||
|
TikTok
|
||||||
|
</a>
|
||||||
|
` : ''}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
` : ''}
|
||||||
<div style="font-size:12px; color:#64748b; text-align:center;">
|
<div style="font-size:12px; color:#64748b; text-align:center;">
|
||||||
© ${new Date().getFullYear()} Stargirlnails Kiel • Professional Nail Care
|
© ${new Date().getFullYear()} Stargirlnails Kiel • Professional Nail Care
|
||||||
</div>
|
</div>
|
||||||
@@ -256,3 +283,35 @@ export async function renderAdminRescheduleExpiredHTML(params) {
|
|||||||
`;
|
`;
|
||||||
return renderBrandedEmail("Abgelaufene Terminänderungsvorschläge", inner);
|
return renderBrandedEmail("Abgelaufene Terminänderungsvorschläge", inner);
|
||||||
}
|
}
|
||||||
|
export async function renderCustomerMessageHTML(params) {
|
||||||
|
const { customerName, message, appointmentDate, appointmentTime, treatmentName } = params;
|
||||||
|
const formattedDate = appointmentDate ? formatDateGerman(appointmentDate) : null;
|
||||||
|
const domain = process.env.DOMAIN || 'localhost:5173';
|
||||||
|
const protocol = domain.includes('localhost') ? 'http' : 'https';
|
||||||
|
const legalUrl = `${protocol}://${domain}/legal`;
|
||||||
|
const ownerName = process.env.OWNER_NAME || 'Stargirlnails Kiel';
|
||||||
|
const inner = `
|
||||||
|
<p>Hallo ${customerName},</p>
|
||||||
|
${(appointmentDate && appointmentTime && treatmentName) ? `
|
||||||
|
<div style="background-color: #f8fafc; border-left: 4px solid #db2777; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #db2777;">📅 Zu deinem Termin:</p>
|
||||||
|
<ul style="margin: 8px 0 0 0; color: #475569; list-style: none; padding: 0;">
|
||||||
|
<li><strong>Behandlung:</strong> ${treatmentName}</li>
|
||||||
|
<li><strong>Datum:</strong> ${formattedDate}</li>
|
||||||
|
<li><strong>Uhrzeit:</strong> ${appointmentTime}</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
` : ''}
|
||||||
|
<div style="background-color: #fef9f5; border-left: 4px solid #f59e0b; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #f59e0b;">💬 Nachricht von ${ownerName}:</p>
|
||||||
|
<div style="margin: 12px 0 0 0; color: #475569; white-space: pre-wrap; line-height: 1.6;">${message.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')}</div>
|
||||||
|
</div>
|
||||||
|
<p>Bei Fragen oder Anliegen kannst du einfach auf diese E-Mail antworten – wir helfen dir gerne weiter!</p>
|
||||||
|
<div style="background-color: #f8fafc; border-left: 4px solid #3b82f6; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #3b82f6;">📋 Rechtliche Informationen:</p>
|
||||||
|
<p style="margin: 8px 0 12px 0; color: #475569;">Weitere Informationen findest du in unserem <a href="${legalUrl}" style="color: #3b82f6; text-decoration: underline;">Impressum und Datenschutz</a>.</p>
|
||||||
|
</div>
|
||||||
|
<p>Liebe Grüße,<br/>${ownerName}</p>
|
||||||
|
`;
|
||||||
|
return renderBrandedEmail("Nachricht zu deinem Termin", inner);
|
||||||
|
}
|
||||||
|
|||||||
@@ -97,13 +97,7 @@ export async function sendEmail(params) {
|
|||||||
console.warn("Resend API key not configured. Skipping email send.");
|
console.warn("Resend API key not configured. Skipping email send.");
|
||||||
return { success: false };
|
return { success: false };
|
||||||
}
|
}
|
||||||
const response = await fetch("https://api.resend.com/emails", {
|
const payload = {
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Authorization": `Bearer ${RESEND_API_KEY}`,
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
from: params.from || DEFAULT_FROM,
|
from: params.from || DEFAULT_FROM,
|
||||||
to: Array.isArray(params.to) ? params.to : [params.to],
|
to: Array.isArray(params.to) ? params.to : [params.to],
|
||||||
subject: params.subject,
|
subject: params.subject,
|
||||||
@@ -111,14 +105,25 @@ export async function sendEmail(params) {
|
|||||||
html: params.html,
|
html: params.html,
|
||||||
cc: params.cc ? (Array.isArray(params.cc) ? params.cc : [params.cc]) : undefined,
|
cc: params.cc ? (Array.isArray(params.cc) ? params.cc : [params.cc]) : undefined,
|
||||||
bcc: params.bcc ? (Array.isArray(params.bcc) ? params.bcc : [params.bcc]) : undefined,
|
bcc: params.bcc ? (Array.isArray(params.bcc) ? params.bcc : [params.bcc]) : undefined,
|
||||||
|
reply_to: params.replyTo ? (Array.isArray(params.replyTo) ? params.replyTo : [params.replyTo]) : undefined,
|
||||||
attachments: params.attachments,
|
attachments: params.attachments,
|
||||||
}),
|
};
|
||||||
|
console.log(`Sending email via Resend: to=${JSON.stringify(payload.to)}, subject="${params.subject}"`);
|
||||||
|
const response = await fetch("https://api.resend.com/emails", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Authorization": `Bearer ${RESEND_API_KEY}`,
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(payload),
|
||||||
});
|
});
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
const body = await response.text().catch(() => "");
|
const body = await response.text().catch(() => "");
|
||||||
console.error("Resend send error:", response.status, body);
|
console.error("Resend send error:", response.status, body);
|
||||||
return { success: false };
|
return { success: false };
|
||||||
}
|
}
|
||||||
|
const responseData = await response.json().catch(() => ({}));
|
||||||
|
console.log("Resend email sent successfully:", responseData);
|
||||||
return { success: true };
|
return { success: true };
|
||||||
}
|
}
|
||||||
export async function sendEmailWithAGB(params) {
|
export async function sendEmailWithAGB(params) {
|
||||||
|
|||||||
@@ -24,5 +24,5 @@ export function clientEntry(c) {
|
|||||||
cssFiles = ["/assets/index-RdX4PbOO.css"];
|
cssFiles = ["/assets/index-RdX4PbOO.css"];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return c.html(_jsxs("html", { lang: "en", children: [_jsxs("head", { children: [_jsx("meta", { charSet: "utf-8" }), _jsx("meta", { content: "width=device-width, initial-scale=1", name: "viewport" }), _jsx("title", { children: "Stargirlnails Kiel" }), _jsx("link", { rel: "icon", type: "image/png", href: "/favicon.png" }), cssFiles && cssFiles.map((css) => (_jsx("link", { rel: "stylesheet", href: css }, css))), process.env.NODE_ENV === 'production' ? (_jsx("script", { src: jsFile, type: "module" })) : (_jsxs(_Fragment, { children: [_jsx("script", { src: "/@vite/client", type: "module" }), _jsx("script", { src: jsFile, type: "module" })] }))] }), _jsx("body", { children: _jsx("div", { id: "root" }) })] }));
|
return c.html(_jsxs("html", { lang: "de", children: [_jsxs("head", { children: [_jsx("meta", { charSet: "utf-8" }), _jsx("meta", { content: "width=device-width, initial-scale=1", name: "viewport" }), _jsx("meta", { name: "theme-color", content: "#ec4899" }), _jsx("meta", { name: "apple-mobile-web-app-capable", content: "yes" }), _jsx("meta", { name: "apple-mobile-web-app-status-bar-style", content: "default" }), _jsx("meta", { name: "apple-mobile-web-app-title", content: "Stargirlnails" }), _jsx("title", { children: "Stargirlnails Kiel" }), _jsx("link", { rel: "icon", type: "image/png", href: "/favicon.png" }), _jsx("link", { rel: "apple-touch-icon", href: "/icons/apple-touch-icon.png" }), _jsx("link", { rel: "manifest", href: "/manifest.json" }), cssFiles && cssFiles.map((css) => (_jsx("link", { rel: "stylesheet", href: css }, css))), process.env.NODE_ENV === 'production' ? (_jsx("script", { src: jsFile, type: "module" })) : (_jsxs(_Fragment, { children: [_jsx("script", { src: "/@vite/client", type: "module" }), _jsx("script", { src: jsFile, type: "module" })] }))] }), _jsx("body", { children: _jsx("div", { id: "root" }) })] }));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { z } from "zod";
|
|||||||
import { randomUUID } from "crypto";
|
import { randomUUID } from "crypto";
|
||||||
import { createKV } from "../lib/create-kv.js";
|
import { createKV } from "../lib/create-kv.js";
|
||||||
import { sendEmail, sendEmailWithAGBAndCalendar, sendEmailWithInspirationPhoto } from "../lib/email.js";
|
import { sendEmail, sendEmailWithAGBAndCalendar, sendEmailWithInspirationPhoto } from "../lib/email.js";
|
||||||
import { renderBookingPendingHTML, renderBookingConfirmedHTML, renderBookingCancelledHTML, renderAdminBookingNotificationHTML, renderBookingRescheduleProposalHTML, renderAdminRescheduleAcceptedHTML, renderAdminRescheduleDeclinedHTML } from "../lib/email-templates.js";
|
import { renderBookingPendingHTML, renderBookingConfirmedHTML, renderBookingCancelledHTML, renderAdminBookingNotificationHTML, renderBookingRescheduleProposalHTML, renderAdminRescheduleAcceptedHTML, renderAdminRescheduleDeclinedHTML, renderCustomerMessageHTML } from "../lib/email-templates.js";
|
||||||
import { createORPCClient } from "@orpc/client";
|
import { createORPCClient } from "@orpc/client";
|
||||||
import { RPCLink } from "@orpc/client/fetch";
|
import { RPCLink } from "@orpc/client/fetch";
|
||||||
import { checkBookingRateLimit } from "../lib/rate-limiter.js";
|
import { checkBookingRateLimit } from "../lib/rate-limiter.js";
|
||||||
@@ -745,4 +745,63 @@ export const router = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
}),
|
}),
|
||||||
|
// Admin sendet Nachricht an Kunden
|
||||||
|
sendCustomerMessage: os
|
||||||
|
.input(z.object({
|
||||||
|
sessionId: z.string(),
|
||||||
|
bookingId: z.string(),
|
||||||
|
message: z.string().min(1, "Nachricht darf nicht leer sein").max(5000, "Nachricht ist zu lang (max. 5000 Zeichen)"),
|
||||||
|
}))
|
||||||
|
.handler(async ({ input }) => {
|
||||||
|
await assertOwner(input.sessionId);
|
||||||
|
const booking = await kv.getItem(input.bookingId);
|
||||||
|
if (!booking)
|
||||||
|
throw new Error("Buchung nicht gefunden");
|
||||||
|
// Check if booking has customer email
|
||||||
|
if (!booking.customerEmail) {
|
||||||
|
throw new Error("Diese Buchung hat keine E-Mail-Adresse. Bitte kontaktiere den Kunden telefonisch.");
|
||||||
|
}
|
||||||
|
// Check if booking is in the future
|
||||||
|
const today = new Date().toISOString().split("T")[0];
|
||||||
|
const bookingDate = booking.appointmentDate;
|
||||||
|
if (bookingDate < today) {
|
||||||
|
throw new Error("Nachrichten können nur für zukünftige Termine gesendet werden.");
|
||||||
|
}
|
||||||
|
// Get treatment name for context
|
||||||
|
const treatment = await treatmentsKV.getItem(booking.treatmentId);
|
||||||
|
const treatmentName = treatment?.name || "Behandlung";
|
||||||
|
// Prepare email with Reply-To header
|
||||||
|
const ownerName = process.env.OWNER_NAME || "Stargirlnails Kiel";
|
||||||
|
const emailFrom = process.env.EMAIL_FROM || "Stargirlnails <no-reply@stargirlnails.de>";
|
||||||
|
const replyToEmail = process.env.ADMIN_EMAIL;
|
||||||
|
const formattedDate = formatDateGerman(bookingDate);
|
||||||
|
const html = await renderCustomerMessageHTML({
|
||||||
|
customerName: booking.customerName,
|
||||||
|
message: input.message,
|
||||||
|
appointmentDate: bookingDate,
|
||||||
|
appointmentTime: booking.appointmentTime,
|
||||||
|
treatmentName: treatmentName,
|
||||||
|
});
|
||||||
|
const textContent = `Hallo ${booking.customerName},\n\nZu deinem Termin:\nBehandlung: ${treatmentName}\nDatum: ${formattedDate}\nUhrzeit: ${booking.appointmentTime}\n\nNachricht von ${ownerName}:\n${input.message}\n\nBei Fragen oder Anliegen kannst du einfach auf diese E-Mail antworten – wir helfen dir gerne weiter!\n\nLiebe Grüße,\n${ownerName}`;
|
||||||
|
// Send email with BCC to admin for monitoring
|
||||||
|
// Note: Not using explicit 'from' or 'replyTo' to match behavior of other system emails
|
||||||
|
console.log(`Sending customer message to ${booking.customerEmail} for booking ${input.bookingId}`);
|
||||||
|
console.log(`Email config: from=${emailFrom}, replyTo=${replyToEmail}, bcc=${replyToEmail}`);
|
||||||
|
const emailResult = await sendEmail({
|
||||||
|
to: booking.customerEmail,
|
||||||
|
subject: `Nachricht zu deinem Termin am ${formattedDate}`,
|
||||||
|
text: textContent,
|
||||||
|
html: html,
|
||||||
|
bcc: replyToEmail ? [replyToEmail] : undefined,
|
||||||
|
});
|
||||||
|
if (!emailResult.success) {
|
||||||
|
console.error(`Failed to send customer message to ${booking.customerEmail}`);
|
||||||
|
throw new Error("E-Mail konnte nicht versendet werden. Bitte überprüfe die E-Mail-Konfiguration oder versuche es später erneut.");
|
||||||
|
}
|
||||||
|
console.log(`Successfully sent customer message to ${booking.customerEmail}`);
|
||||||
|
return {
|
||||||
|
success: true,
|
||||||
|
message: `Nachricht wurde erfolgreich an ${booking.customerEmail} gesendet.`
|
||||||
|
};
|
||||||
|
}),
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ import { router as cancellation } from "./cancellation.js";
|
|||||||
import { router as legal } from "./legal.js";
|
import { router as legal } from "./legal.js";
|
||||||
import { router as gallery } from "./gallery.js";
|
import { router as gallery } from "./gallery.js";
|
||||||
import { router as reviews } from "./reviews.js";
|
import { router as reviews } from "./reviews.js";
|
||||||
|
import { router as social } from "./social.js";
|
||||||
export const router = {
|
export const router = {
|
||||||
demo,
|
demo,
|
||||||
treatments,
|
treatments,
|
||||||
@@ -17,4 +18,5 @@ export const router = {
|
|||||||
legal,
|
legal,
|
||||||
gallery,
|
gallery,
|
||||||
reviews,
|
reviews,
|
||||||
|
social,
|
||||||
};
|
};
|
||||||
|
|||||||
10
server-dist/rpc/social.js
Normal file
10
server-dist/rpc/social.js
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
import { os } from "@orpc/server";
|
||||||
|
const getSocialMedia = os.handler(async () => {
|
||||||
|
return {
|
||||||
|
tiktokProfile: process.env.TIKTOK_PROFILE,
|
||||||
|
instagramProfile: process.env.INSTAGRAM_PROFILE,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
export const router = os.router({
|
||||||
|
getSocialMedia,
|
||||||
|
});
|
||||||
@@ -16,6 +16,7 @@ import BookingStatusPage from "@/client/components/booking-status-page";
|
|||||||
import ReviewSubmissionPage from "@/client/components/review-submission-page";
|
import ReviewSubmissionPage from "@/client/components/review-submission-page";
|
||||||
import LegalPage from "@/client/components/legal-page";
|
import LegalPage from "@/client/components/legal-page";
|
||||||
import { ProfileLanding } from "@/client/components/profile-landing";
|
import { ProfileLanding } from "@/client/components/profile-landing";
|
||||||
|
import { PWAInstallPrompt } from "@/client/components/pwa-install-prompt";
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
const { user, isLoading, isOwner } = useAuth();
|
const { user, isLoading, isOwner } = useAuth();
|
||||||
@@ -36,10 +37,15 @@ function App() {
|
|||||||
|
|
||||||
// Handle booking status page
|
// Handle booking status page
|
||||||
const path = window.location.pathname;
|
const path = window.location.pathname;
|
||||||
|
const PwaPrompt = <PWAInstallPrompt />;
|
||||||
|
|
||||||
if (path.startsWith('/booking/')) {
|
if (path.startsWith('/booking/')) {
|
||||||
const token = path.split('/booking/')[1];
|
const token = path.split('/booking/')[1];
|
||||||
if (token) {
|
if (token) {
|
||||||
return <BookingStatusPage token={token} />;
|
return <>
|
||||||
|
{PwaPrompt}
|
||||||
|
<BookingStatusPage token={token} />
|
||||||
|
</>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -47,7 +53,10 @@ function App() {
|
|||||||
if (path.startsWith('/review/')) {
|
if (path.startsWith('/review/')) {
|
||||||
const token = path.split('/review/')[1];
|
const token = path.split('/review/')[1];
|
||||||
if (token) {
|
if (token) {
|
||||||
return <ReviewSubmissionPage token={token} />;
|
return <>
|
||||||
|
{PwaPrompt}
|
||||||
|
<ReviewSubmissionPage token={token} />
|
||||||
|
</>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -381,6 +390,9 @@ function App() {
|
|||||||
)}
|
)}
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
{/* PWA Installation Prompt for iOS */}
|
||||||
|
<PWAInstallPrompt hidden={isMobileMenuOpen} />
|
||||||
|
|
||||||
{/* Footer */}
|
{/* Footer */}
|
||||||
<footer className="bg-white border-t border-pink-100 mt-16">
|
<footer className="bg-white border-t border-pink-100 mt-16">
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||||
|
|||||||
@@ -7,6 +7,8 @@ export function AdminBookings() {
|
|||||||
const [selectedPhoto, setSelectedPhoto] = useState<string>("");
|
const [selectedPhoto, setSelectedPhoto] = useState<string>("");
|
||||||
const [showPhotoModal, setShowPhotoModal] = useState(false);
|
const [showPhotoModal, setShowPhotoModal] = useState(false);
|
||||||
const [showCancelConfirm, setShowCancelConfirm] = useState<string | null>(null);
|
const [showCancelConfirm, setShowCancelConfirm] = useState<string | null>(null);
|
||||||
|
const [showMessageModal, setShowMessageModal] = useState<string | null>(null);
|
||||||
|
const [messageText, setMessageText] = useState<string>("");
|
||||||
const [successMsg, setSuccessMsg] = useState<string>("");
|
const [successMsg, setSuccessMsg] = useState<string>("");
|
||||||
const [errorMsg, setErrorMsg] = useState<string>("");
|
const [errorMsg, setErrorMsg] = useState<string>("");
|
||||||
|
|
||||||
@@ -49,6 +51,19 @@ export function AdminBookings() {
|
|||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const { mutate: sendMessage, isPending: isSendingMessage } = useMutation(
|
||||||
|
queryClient.bookings.sendCustomerMessage.mutationOptions({
|
||||||
|
onSuccess: () => {
|
||||||
|
setSuccessMsg("Nachricht wurde erfolgreich gesendet.");
|
||||||
|
setShowMessageModal(null);
|
||||||
|
setMessageText("");
|
||||||
|
},
|
||||||
|
onError: (error: any) => {
|
||||||
|
setErrorMsg(error?.message || "Fehler beim Senden der Nachricht.");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
|
||||||
const getTreatmentName = (treatmentId: string) => {
|
const getTreatmentName = (treatmentId: string) => {
|
||||||
return treatments?.find(t => t.id === treatmentId)?.name || "Unbekannte Behandlung";
|
return treatments?.find(t => t.id === treatmentId)?.name || "Unbekannte Behandlung";
|
||||||
};
|
};
|
||||||
@@ -83,6 +98,35 @@ export function AdminBookings() {
|
|||||||
setSelectedPhoto("");
|
setSelectedPhoto("");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const openMessageModal = (bookingId: string) => {
|
||||||
|
setShowMessageModal(bookingId);
|
||||||
|
setMessageText("");
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeMessageModal = () => {
|
||||||
|
setShowMessageModal(null);
|
||||||
|
setMessageText("");
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSendMessage = () => {
|
||||||
|
if (!showMessageModal || !messageText.trim()) {
|
||||||
|
setErrorMsg("Bitte gib eine Nachricht ein.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
sendMessage({
|
||||||
|
sessionId: localStorage.getItem("sessionId") || "",
|
||||||
|
bookingId: showMessageModal,
|
||||||
|
message: messageText.trim(),
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Check if booking is in the future
|
||||||
|
const isFutureBooking = (appointmentDate: string) => {
|
||||||
|
const today = new Date().toISOString().split("T")[0];
|
||||||
|
return appointmentDate >= today;
|
||||||
|
};
|
||||||
|
|
||||||
const filteredBookings = bookings?.filter(booking =>
|
const filteredBookings = bookings?.filter(booking =>
|
||||||
selectedDate ? booking.appointmentDate === selectedDate : true
|
selectedDate ? booking.appointmentDate === selectedDate : true
|
||||||
).sort((a, b) => {
|
).sort((a, b) => {
|
||||||
@@ -251,6 +295,7 @@ export function AdminBookings() {
|
|||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
||||||
|
<div className="flex flex-col space-y-2">
|
||||||
<div className="flex space-x-2">
|
<div className="flex space-x-2">
|
||||||
{booking.status === "pending" && (
|
{booking.status === "pending" && (
|
||||||
<>
|
<>
|
||||||
@@ -293,6 +338,17 @@ export function AdminBookings() {
|
|||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
{/* Show message button for future bookings with email */}
|
||||||
|
{isFutureBooking(booking.appointmentDate) && booking.customerEmail && (
|
||||||
|
<button
|
||||||
|
onClick={() => openMessageModal(booking.id)}
|
||||||
|
className="text-pink-600 hover:text-pink-900 text-left"
|
||||||
|
title="Nachricht an Kunden senden"
|
||||||
|
>
|
||||||
|
💬 Nachricht
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
))}
|
||||||
@@ -369,6 +425,87 @@ export function AdminBookings() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* Message Modal */}
|
||||||
|
{showMessageModal && (
|
||||||
|
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
|
||||||
|
<div className="bg-white rounded-lg p-6 max-w-2xl w-full mx-4">
|
||||||
|
<div className="flex justify-between items-center mb-4">
|
||||||
|
<h3 className="text-lg font-medium text-gray-900">Nachricht an Kunden senden</h3>
|
||||||
|
<button
|
||||||
|
onClick={closeMessageModal}
|
||||||
|
className="text-gray-400 hover:text-gray-600 text-2xl"
|
||||||
|
disabled={isSendingMessage}
|
||||||
|
>
|
||||||
|
×
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{(() => {
|
||||||
|
const booking = bookings?.find(b => b.id === showMessageModal);
|
||||||
|
if (!booking) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="mb-4 bg-gray-50 p-4 rounded-md">
|
||||||
|
<p className="text-sm text-gray-700">
|
||||||
|
<strong>Kunde:</strong> {booking.customerName}
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-gray-700">
|
||||||
|
<strong>E-Mail:</strong> {booking.customerEmail}
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-gray-700">
|
||||||
|
<strong>Termin:</strong> {new Date(booking.appointmentDate).toLocaleDateString()} um {booking.appointmentTime}
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-gray-700">
|
||||||
|
<strong>Behandlung:</strong> {getTreatmentName(booking.treatmentId)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})()}
|
||||||
|
|
||||||
|
<div className="mb-4">
|
||||||
|
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||||
|
Deine Nachricht
|
||||||
|
</label>
|
||||||
|
<textarea
|
||||||
|
value={messageText}
|
||||||
|
onChange={(e) => setMessageText(e.target.value)}
|
||||||
|
placeholder="Schreibe hier deine Nachricht an den Kunden..."
|
||||||
|
rows={6}
|
||||||
|
maxLength={5000}
|
||||||
|
className="w-full p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-pink-500 focus:border-pink-500"
|
||||||
|
disabled={isSendingMessage}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-gray-500 mt-1">
|
||||||
|
{messageText.length} / 5000 Zeichen
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border-l-4 border-blue-400 p-3 mb-4">
|
||||||
|
<p className="text-sm text-blue-700">
|
||||||
|
💡 <strong>Hinweis:</strong> Der Kunde kann direkt auf diese E-Mail antworten. Die Antwort geht an die in den Einstellungen hinterlegte Admin-E-Mail-Adresse.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex space-x-3">
|
||||||
|
<button
|
||||||
|
onClick={handleSendMessage}
|
||||||
|
disabled={isSendingMessage || !messageText.trim()}
|
||||||
|
className="flex-1 bg-pink-600 text-white py-2 px-4 rounded-md hover:bg-pink-700 transition-colors disabled:bg-gray-300 disabled:cursor-not-allowed"
|
||||||
|
>
|
||||||
|
{isSendingMessage ? "Wird gesendet..." : "Nachricht senden"}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={closeMessageModal}
|
||||||
|
disabled={isSendingMessage}
|
||||||
|
className="flex-1 bg-gray-200 text-gray-800 py-2 px-4 rounded-md hover:bg-gray-300 transition-colors disabled:bg-gray-100 disabled:cursor-not-allowed"
|
||||||
|
>
|
||||||
|
Abbrechen
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
187
src/client/components/pwa-install-prompt.tsx
Normal file
187
src/client/components/pwa-install-prompt.tsx
Normal file
@@ -0,0 +1,187 @@
|
|||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
|
||||||
|
interface BeforeInstallPromptEvent extends Event {
|
||||||
|
prompt: () => Promise<void>;
|
||||||
|
userChoice: Promise<{ outcome: 'accepted' | 'dismissed' }>;
|
||||||
|
}
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface Navigator { standalone?: boolean }
|
||||||
|
interface WindowEventMap {
|
||||||
|
beforeinstallprompt: BeforeInstallPromptEvent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const LAST_SHOWN_KEY = 'pwaInstallPrompt_lastShown';
|
||||||
|
const ANDROID_DISMISSED_KEY = 'pwaInstallPrompt_androidDismissed';
|
||||||
|
|
||||||
|
function isIOS(): boolean {
|
||||||
|
if (typeof navigator === 'undefined') return false;
|
||||||
|
const ua = navigator.userAgent || '';
|
||||||
|
const iOS = /iPhone|iPad|iPod/i.test(ua);
|
||||||
|
const iPadOS13Plus = /Macintosh/.test(ua) && 'ontouchend' in document;
|
||||||
|
return iOS || iPadOS13Plus;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isSafari(): boolean {
|
||||||
|
const ua = navigator.userAgent || '';
|
||||||
|
const isSafari = /Safari/i.test(ua) && !/CriOS|FxiOS|EdgiOS/i.test(ua);
|
||||||
|
return isSafari;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isStandalone(): boolean {
|
||||||
|
const navStandalone = (navigator as any)?.standalone === true;
|
||||||
|
const mm = typeof window !== 'undefined' && window.matchMedia
|
||||||
|
? window.matchMedia('(display-mode: standalone)').matches
|
||||||
|
: false;
|
||||||
|
return Boolean(navStandalone || mm);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function PWAInstallPrompt({ hidden = false }: { hidden?: boolean }) {
|
||||||
|
if (hidden) return null;
|
||||||
|
const [show, setShow] = useState(false);
|
||||||
|
const [promptType, setPromptType] = useState<'ios' | 'android' | null>(null);
|
||||||
|
const [deferredPrompt, setDeferredPrompt] = useState<BeforeInstallPromptEvent | null>(null);
|
||||||
|
const [initialized, setInitialized] = useState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// Only run on client
|
||||||
|
if (typeof window === 'undefined') return;
|
||||||
|
|
||||||
|
// Check if already in standalone mode
|
||||||
|
if (isStandalone()) {
|
||||||
|
setInitialized(true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle iOS
|
||||||
|
const isIOSDevice = isIOS() && isSafari();
|
||||||
|
if (isIOSDevice) {
|
||||||
|
let lastShown = 0;
|
||||||
|
try {
|
||||||
|
lastShown = Number(localStorage.getItem(LAST_SHOWN_KEY) || 0);
|
||||||
|
} catch {}
|
||||||
|
const oneWeek = 7 * 24 * 60 * 60 * 1000;
|
||||||
|
const shouldShow = !lastShown || Date.now() - lastShown > oneWeek;
|
||||||
|
|
||||||
|
if (shouldShow) {
|
||||||
|
setPromptType('ios');
|
||||||
|
setShow(true);
|
||||||
|
}
|
||||||
|
setInitialized(true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle Android (beforeinstallprompt)
|
||||||
|
const handleBeforeInstall = (e: BeforeInstallPromptEvent) => {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
// Check if user has dismissed Android prompt before
|
||||||
|
let dismissed = false;
|
||||||
|
try {
|
||||||
|
dismissed = localStorage.getItem(ANDROID_DISMISSED_KEY) === 'true';
|
||||||
|
} catch {}
|
||||||
|
|
||||||
|
if (!dismissed) {
|
||||||
|
setDeferredPrompt(e);
|
||||||
|
setPromptType('android');
|
||||||
|
setShow(true);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.addEventListener('beforeinstallprompt', handleBeforeInstall);
|
||||||
|
setInitialized(true);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
window.removeEventListener('beforeinstallprompt', handleBeforeInstall);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const dismiss = () => {
|
||||||
|
if (promptType === 'ios') {
|
||||||
|
try { localStorage.setItem(LAST_SHOWN_KEY, String(Date.now())); } catch {}
|
||||||
|
} else if (promptType === 'android') {
|
||||||
|
try { localStorage.setItem(ANDROID_DISMISSED_KEY, 'true'); } catch {}
|
||||||
|
}
|
||||||
|
setShow(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleAndroidInstall = async () => {
|
||||||
|
if (!deferredPrompt) return;
|
||||||
|
|
||||||
|
try {
|
||||||
|
await deferredPrompt.prompt();
|
||||||
|
const choiceResult = await deferredPrompt.userChoice;
|
||||||
|
|
||||||
|
if (choiceResult.outcome === 'accepted') {
|
||||||
|
console.log('PWA installation accepted');
|
||||||
|
}
|
||||||
|
|
||||||
|
setDeferredPrompt(null);
|
||||||
|
setShow(false);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error during PWA installation:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (!initialized || !show || !promptType) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
role="dialog"
|
||||||
|
aria-label={promptType === 'android' ? 'PWA Installation' : 'PWA Installation Anleitung'}
|
||||||
|
className="fixed bottom-0 left-0 right-0 z-50 px-4 pb-4"
|
||||||
|
style={{ paddingBottom: `max(env(safe-area-inset-bottom), 1rem)` }}
|
||||||
|
>
|
||||||
|
<div className="relative max-w-3xl mx-auto rounded-xl shadow-lg bg-gradient-to-r from-pink-500 to-purple-600 text-white p-4 sm:p-6">
|
||||||
|
<button aria-label="Hinweis schließen" onClick={dismiss} className="absolute top-2 right-2 text-white/90 hover:text-white text-2xl leading-none">×</button>
|
||||||
|
|
||||||
|
{promptType === 'android' ? (
|
||||||
|
// Android: Direct install button
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<div className="text-3xl">📱</div>
|
||||||
|
<div className="flex-1">
|
||||||
|
<h3 className="text-lg sm:text-xl font-bold mb-2">App installieren</h3>
|
||||||
|
<p className="text-white/90 mb-3">
|
||||||
|
Installiere Stargirlnails als App für schnellen Zugriff direkt vom Startbildschirm!
|
||||||
|
</p>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<button
|
||||||
|
onClick={handleAndroidInstall}
|
||||||
|
className="bg-white text-pink-600 px-4 py-2 rounded-lg font-semibold hover:bg-pink-50 transition-colors"
|
||||||
|
>
|
||||||
|
Jetzt installieren
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={dismiss}
|
||||||
|
className="bg-white/20 text-white px-4 py-2 rounded-lg font-semibold hover:bg-white/30 transition-colors"
|
||||||
|
>
|
||||||
|
Später
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
// iOS: Manual instructions
|
||||||
|
<div className="flex items-start gap-3">
|
||||||
|
<div className="text-2xl">📱</div>
|
||||||
|
<div className="flex-1">
|
||||||
|
<h3 className="text-lg sm:text-xl font-bold mb-2">App installieren</h3>
|
||||||
|
<p className="text-white/90 mb-2">So installierst du Stargirlnails als App auf deinem iPhone/iPad:</p>
|
||||||
|
<ol className="list-decimal pl-5 space-y-1 text-white/95">
|
||||||
|
<li>Öffne diese Seite in Safari (nicht Chrome oder andere Browser).</li>
|
||||||
|
<li>Tippe auf das Teilen-Symbol (□↑) unten in der Mitte.</li>
|
||||||
|
<li>Scrolle nach unten und wähle „Zum Home-Bildschirm".</li>
|
||||||
|
<li>Tippe auf „Hinzufügen".</li>
|
||||||
|
</ol>
|
||||||
|
<p className="mt-3 text-sm text-white/90">✨ Schneller Zugriff, keine App-Store-Installation nötig, automatische Updates.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default PWAInstallPrompt;
|
||||||
|
|
||||||
@@ -63,6 +63,8 @@ if (process.env.NODE_ENV === 'production') {
|
|||||||
}
|
}
|
||||||
app.use('/favicon.png', serveStatic({ path: './public/favicon.png' }));
|
app.use('/favicon.png', serveStatic({ path: './public/favicon.png' }));
|
||||||
app.use('/AGB.pdf', serveStatic({ path: './public/AGB.pdf' }));
|
app.use('/AGB.pdf', serveStatic({ path: './public/AGB.pdf' }));
|
||||||
|
app.use('/icons/*', serveStatic({ root: './public' }));
|
||||||
|
app.use('/manifest.json', serveStatic({ path: './public/manifest.json' }));
|
||||||
|
|
||||||
app.route("/rpc", rpcApp);
|
app.route("/rpc", rpcApp);
|
||||||
app.route("/caldav", caldavApp);
|
app.route("/caldav", caldavApp);
|
||||||
|
|||||||
@@ -33,14 +33,16 @@ async function renderBrandedEmail(title: string, bodyHtml: string): Promise<stri
|
|||||||
|
|
||||||
const instagramProfile = process.env.INSTAGRAM_PROFILE;
|
const instagramProfile = process.env.INSTAGRAM_PROFILE;
|
||||||
const tiktokProfile = process.env.TIKTOK_PROFILE;
|
const tiktokProfile = process.env.TIKTOK_PROFILE;
|
||||||
|
const companyName = process.env.COMPANY_NAME || 'Stargirlnails Kiel';
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<div style="font-family: Arial, sans-serif; color: #0f172a; background:#fdf2f8; padding:24px;">
|
<div style="font-family: Arial, sans-serif; color: #0f172a; background:#fdf2f8; padding:24px;">
|
||||||
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="max-width:640px; margin:0 auto; background:#ffffff; border-radius:12px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,0.06)">
|
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="max-width:640px; margin:0 auto; background:#ffffff; border-radius:12px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,0.06)">
|
||||||
<tr>
|
<tr>
|
||||||
<td style="padding:24px 24px 0 24px; text-align:center;">
|
<td style="padding:24px 24px 0 24px; text-align:center;">
|
||||||
${logo ? `<img src="${logo}" alt="Stargirlnails" style="width:120px; height:auto; display:inline-block;" />` : `<div style=\"font-size:24px\">💅</div>`}
|
${logo ? `<img src="${logo}" alt="${companyName}" style="width:120px; height:auto; display:inline-block;" />` : `<div style=\"font-size:24px\">💅</div>`}
|
||||||
<h1 style="margin:16px 0 0 0; font-size:22px; color:#db2777;">${title}</h1>
|
<div style="margin:16px 0 4px 0; font-size:16px; font-weight:600; color:#64748b;">${companyName}</div>
|
||||||
|
<h1 style="margin:0; font-size:22px; color:#db2777;">${title}</h1>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
@@ -58,12 +60,18 @@ async function renderBrandedEmail(title: string, bodyHtml: string): Promise<stri
|
|||||||
<div style="display:inline-block;">
|
<div style="display:inline-block;">
|
||||||
${instagramProfile ? `
|
${instagramProfile ? `
|
||||||
<a href="${instagramProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
<a href="${instagramProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
||||||
📷 Instagram
|
<svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24" style="vertical-align:middle; margin-right:6px;">
|
||||||
|
<path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/>
|
||||||
|
</svg>
|
||||||
|
Instagram
|
||||||
</a>
|
</a>
|
||||||
` : ''}
|
` : ''}
|
||||||
${tiktokProfile ? `
|
${tiktokProfile ? `
|
||||||
<a href="${tiktokProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:#000000; color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
<a href="${tiktokProfile}" target="_blank" rel="noopener noreferrer" style="display:inline-block; margin:0 6px; background:#000000; color:white; padding:10px 20px; text-decoration:none; border-radius:20px; font-size:14px; font-weight:600;">
|
||||||
🎵 TikTok
|
<svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24" style="vertical-align:middle; margin-right:6px;">
|
||||||
|
<path d="M19.59 6.69a4.83 4.83 0 0 1-3.77-4.25V2h-3.45v13.67a2.89 2.89 0 0 1-5.2 1.74 2.89 2.89 0 0 1 2.31-4.64 2.93 2.93 0 0 1 .88.13V9.4a6.84 6.84 0 0 0-1-.05A6.33 6.33 0 0 0 5 20.1a6.34 6.34 0 0 0 10.86-4.43v-7a8.16 8.16 0 0 0 4.77 1.52v-3.4a4.85 4.85 0 0 1-1-.1z"/>
|
||||||
|
</svg>
|
||||||
|
TikTok
|
||||||
</a>
|
</a>
|
||||||
` : ''}
|
` : ''}
|
||||||
</div>
|
</div>
|
||||||
@@ -339,3 +347,43 @@ export async function renderAdminRescheduleExpiredHTML(params: {
|
|||||||
return renderBrandedEmail("Abgelaufene Terminänderungsvorschläge", inner);
|
return renderBrandedEmail("Abgelaufene Terminänderungsvorschläge", inner);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function renderCustomerMessageHTML(params: {
|
||||||
|
customerName: string;
|
||||||
|
message: string;
|
||||||
|
appointmentDate?: string;
|
||||||
|
appointmentTime?: string;
|
||||||
|
treatmentName?: string;
|
||||||
|
}) {
|
||||||
|
const { customerName, message, appointmentDate, appointmentTime, treatmentName } = params;
|
||||||
|
const formattedDate = appointmentDate ? formatDateGerman(appointmentDate) : null;
|
||||||
|
const domain = process.env.DOMAIN || 'localhost:5173';
|
||||||
|
const protocol = domain.includes('localhost') ? 'http' : 'https';
|
||||||
|
const legalUrl = `${protocol}://${domain}/legal`;
|
||||||
|
const ownerName = process.env.OWNER_NAME || 'Stargirlnails Kiel';
|
||||||
|
|
||||||
|
const inner = `
|
||||||
|
<p>Hallo ${customerName},</p>
|
||||||
|
${(appointmentDate && appointmentTime && treatmentName) ? `
|
||||||
|
<div style="background-color: #f8fafc; border-left: 4px solid #db2777; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #db2777;">📅 Zu deinem Termin:</p>
|
||||||
|
<ul style="margin: 8px 0 0 0; color: #475569; list-style: none; padding: 0;">
|
||||||
|
<li><strong>Behandlung:</strong> ${treatmentName}</li>
|
||||||
|
<li><strong>Datum:</strong> ${formattedDate}</li>
|
||||||
|
<li><strong>Uhrzeit:</strong> ${appointmentTime}</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
` : ''}
|
||||||
|
<div style="background-color: #fef9f5; border-left: 4px solid #f59e0b; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #f59e0b;">💬 Nachricht von ${ownerName}:</p>
|
||||||
|
<div style="margin: 12px 0 0 0; color: #475569; white-space: pre-wrap; line-height: 1.6;">${message.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')}</div>
|
||||||
|
</div>
|
||||||
|
<p>Bei Fragen oder Anliegen kannst du einfach auf diese E-Mail antworten – wir helfen dir gerne weiter!</p>
|
||||||
|
<div style="background-color: #f8fafc; border-left: 4px solid #3b82f6; padding: 16px; margin: 20px 0; border-radius: 4px;">
|
||||||
|
<p style="margin: 0; font-weight: 600; color: #3b82f6;">📋 Rechtliche Informationen:</p>
|
||||||
|
<p style="margin: 8px 0 12px 0; color: #475569;">Weitere Informationen findest du in unserem <a href="${legalUrl}" style="color: #3b82f6; text-decoration: underline;">Impressum und Datenschutz</a>.</p>
|
||||||
|
</div>
|
||||||
|
<p>Liebe Grüße,<br/>${ownerName}</p>
|
||||||
|
`;
|
||||||
|
return renderBrandedEmail("Nachricht zu deinem Termin", inner);
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ type SendEmailParams = {
|
|||||||
from?: string;
|
from?: string;
|
||||||
cc?: string | string[];
|
cc?: string | string[];
|
||||||
bcc?: string | string[];
|
bcc?: string | string[];
|
||||||
|
replyTo?: string | string[];
|
||||||
attachments?: Array<{
|
attachments?: Array<{
|
||||||
filename: string;
|
filename: string;
|
||||||
content: string; // base64 encoded
|
content: string; // base64 encoded
|
||||||
@@ -130,13 +131,7 @@ export async function sendEmail(params: SendEmailParams): Promise<{ success: boo
|
|||||||
return { success: false };
|
return { success: false };
|
||||||
}
|
}
|
||||||
|
|
||||||
const response = await fetch("https://api.resend.com/emails", {
|
const payload = {
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Authorization": `Bearer ${RESEND_API_KEY}`,
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
from: params.from || DEFAULT_FROM,
|
from: params.from || DEFAULT_FROM,
|
||||||
to: Array.isArray(params.to) ? params.to : [params.to],
|
to: Array.isArray(params.to) ? params.to : [params.to],
|
||||||
subject: params.subject,
|
subject: params.subject,
|
||||||
@@ -144,8 +139,19 @@ export async function sendEmail(params: SendEmailParams): Promise<{ success: boo
|
|||||||
html: params.html,
|
html: params.html,
|
||||||
cc: params.cc ? (Array.isArray(params.cc) ? params.cc : [params.cc]) : undefined,
|
cc: params.cc ? (Array.isArray(params.cc) ? params.cc : [params.cc]) : undefined,
|
||||||
bcc: params.bcc ? (Array.isArray(params.bcc) ? params.bcc : [params.bcc]) : undefined,
|
bcc: params.bcc ? (Array.isArray(params.bcc) ? params.bcc : [params.bcc]) : undefined,
|
||||||
|
reply_to: params.replyTo ? (Array.isArray(params.replyTo) ? params.replyTo : [params.replyTo]) : undefined,
|
||||||
attachments: params.attachments,
|
attachments: params.attachments,
|
||||||
}),
|
};
|
||||||
|
|
||||||
|
console.log(`Sending email via Resend: to=${JSON.stringify(payload.to)}, subject="${params.subject}"`);
|
||||||
|
|
||||||
|
const response = await fetch("https://api.resend.com/emails", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Authorization": `Bearer ${RESEND_API_KEY}`,
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(payload),
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
@@ -153,6 +159,9 @@ export async function sendEmail(params: SendEmailParams): Promise<{ success: boo
|
|||||||
console.error("Resend send error:", response.status, body);
|
console.error("Resend send error:", response.status, body);
|
||||||
return { success: false };
|
return { success: false };
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const responseData = await response.json().catch(() => ({}));
|
||||||
|
console.log("Resend email sent successfully:", responseData);
|
||||||
return { success: true };
|
return { success: true };
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -30,12 +30,18 @@ export function clientEntry(c: Context<BlankEnv>) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return c.html(
|
return c.html(
|
||||||
<html lang="en">
|
<html lang="de">
|
||||||
<head>
|
<head>
|
||||||
<meta charSet="utf-8" />
|
<meta charSet="utf-8" />
|
||||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||||
|
<meta name="theme-color" content="#ec4899" />
|
||||||
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||||
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
||||||
|
<meta name="apple-mobile-web-app-title" content="Stargirlnails" />
|
||||||
<title>Stargirlnails Kiel</title>
|
<title>Stargirlnails Kiel</title>
|
||||||
<link rel="icon" type="image/png" href="/favicon.png" />
|
<link rel="icon" type="image/png" href="/favicon.png" />
|
||||||
|
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" />
|
||||||
|
<link rel="manifest" href="/manifest.json" />
|
||||||
{cssFiles && cssFiles.map((css: string) => (
|
{cssFiles && cssFiles.map((css: string) => (
|
||||||
<link key={css} rel="stylesheet" href={css} />
|
<link key={css} rel="stylesheet" href={css} />
|
||||||
))}
|
))}
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { z } from "zod";
|
|||||||
import { randomUUID } from "crypto";
|
import { randomUUID } from "crypto";
|
||||||
import { createKV } from "../lib/create-kv.js";
|
import { createKV } from "../lib/create-kv.js";
|
||||||
import { sendEmail, sendEmailWithAGB, sendEmailWithAGBAndCalendar, sendEmailWithInspirationPhoto } from "../lib/email.js";
|
import { sendEmail, sendEmailWithAGB, sendEmailWithAGBAndCalendar, sendEmailWithInspirationPhoto } from "../lib/email.js";
|
||||||
import { renderBookingPendingHTML, renderBookingConfirmedHTML, renderBookingCancelledHTML, renderAdminBookingNotificationHTML, renderBookingRescheduleProposalHTML, renderAdminRescheduleAcceptedHTML, renderAdminRescheduleDeclinedHTML } from "../lib/email-templates.js";
|
import { renderBookingPendingHTML, renderBookingConfirmedHTML, renderBookingCancelledHTML, renderAdminBookingNotificationHTML, renderBookingRescheduleProposalHTML, renderAdminRescheduleAcceptedHTML, renderAdminRescheduleDeclinedHTML, renderCustomerMessageHTML } from "../lib/email-templates.js";
|
||||||
import { router as rootRouter } from "./index.js";
|
import { router as rootRouter } from "./index.js";
|
||||||
import { createORPCClient } from "@orpc/client";
|
import { createORPCClient } from "@orpc/client";
|
||||||
import { RPCLink } from "@orpc/client/fetch";
|
import { RPCLink } from "@orpc/client/fetch";
|
||||||
@@ -911,4 +911,74 @@ export const router = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
// Admin sendet Nachricht an Kunden
|
||||||
|
sendCustomerMessage: os
|
||||||
|
.input(z.object({
|
||||||
|
sessionId: z.string(),
|
||||||
|
bookingId: z.string(),
|
||||||
|
message: z.string().min(1, "Nachricht darf nicht leer sein").max(5000, "Nachricht ist zu lang (max. 5000 Zeichen)"),
|
||||||
|
}))
|
||||||
|
.handler(async ({ input }) => {
|
||||||
|
await assertOwner(input.sessionId);
|
||||||
|
|
||||||
|
const booking = await kv.getItem(input.bookingId);
|
||||||
|
if (!booking) throw new Error("Buchung nicht gefunden");
|
||||||
|
|
||||||
|
// Check if booking has customer email
|
||||||
|
if (!booking.customerEmail) {
|
||||||
|
throw new Error("Diese Buchung hat keine E-Mail-Adresse. Bitte kontaktiere den Kunden telefonisch.");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if booking is in the future
|
||||||
|
const today = new Date().toISOString().split("T")[0];
|
||||||
|
const bookingDate = booking.appointmentDate;
|
||||||
|
if (bookingDate < today) {
|
||||||
|
throw new Error("Nachrichten können nur für zukünftige Termine gesendet werden.");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get treatment name for context
|
||||||
|
const treatment = await treatmentsKV.getItem(booking.treatmentId);
|
||||||
|
const treatmentName = treatment?.name || "Behandlung";
|
||||||
|
|
||||||
|
// Prepare email with Reply-To header
|
||||||
|
const ownerName = process.env.OWNER_NAME || "Stargirlnails Kiel";
|
||||||
|
const emailFrom = process.env.EMAIL_FROM || "Stargirlnails <no-reply@stargirlnails.de>";
|
||||||
|
const replyToEmail = process.env.ADMIN_EMAIL;
|
||||||
|
|
||||||
|
const formattedDate = formatDateGerman(bookingDate);
|
||||||
|
|
||||||
|
const html = await renderCustomerMessageHTML({
|
||||||
|
customerName: booking.customerName,
|
||||||
|
message: input.message,
|
||||||
|
appointmentDate: bookingDate,
|
||||||
|
appointmentTime: booking.appointmentTime,
|
||||||
|
treatmentName: treatmentName,
|
||||||
|
});
|
||||||
|
|
||||||
|
const textContent = `Hallo ${booking.customerName},\n\nZu deinem Termin:\nBehandlung: ${treatmentName}\nDatum: ${formattedDate}\nUhrzeit: ${booking.appointmentTime}\n\nNachricht von ${ownerName}:\n${input.message}\n\nBei Fragen oder Anliegen kannst du einfach auf diese E-Mail antworten – wir helfen dir gerne weiter!\n\nLiebe Grüße,\n${ownerName}`;
|
||||||
|
|
||||||
|
// Send email with BCC to admin for monitoring
|
||||||
|
// Note: Not using explicit 'from' or 'replyTo' to match behavior of other system emails
|
||||||
|
console.log(`Sending customer message to ${booking.customerEmail} for booking ${input.bookingId}`);
|
||||||
|
console.log(`Email config: from=${emailFrom}, replyTo=${replyToEmail}, bcc=${replyToEmail}`);
|
||||||
|
const emailResult = await sendEmail({
|
||||||
|
to: booking.customerEmail,
|
||||||
|
subject: `Nachricht zu deinem Termin am ${formattedDate}`,
|
||||||
|
text: textContent,
|
||||||
|
html: html,
|
||||||
|
bcc: replyToEmail ? [replyToEmail] : undefined,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!emailResult.success) {
|
||||||
|
console.error(`Failed to send customer message to ${booking.customerEmail}`);
|
||||||
|
throw new Error("E-Mail konnte nicht versendet werden. Bitte überprüfe die E-Mail-Konfiguration oder versuche es später erneut.");
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(`Successfully sent customer message to ${booking.customerEmail}`);
|
||||||
|
return {
|
||||||
|
success: true,
|
||||||
|
message: `Nachricht wurde erfolgreich an ${booking.customerEmail} gesendet.`
|
||||||
|
};
|
||||||
|
}),
|
||||||
};
|
};
|
||||||
Reference in New Issue
Block a user