Daniel/webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: remove all unicode emojis project-wide and sanitize pdf text

Browse Source
This commit is contained in:
DanielS
2026-09-08 00:03:27 +02:00
parent 40b63b3fa9
commit ec11ad8498
11 changed files with 68 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
shop/app/my-customers/[id]/page.tsx
View File

@@ -193,8 +193,9 @@ export default function CustomerDetailPage({ params }: { params: Promise<{ id: s
</Button> </Button>
) : ( ) : (
<div className="space-y-3 p-4 rounded-lg bg-red-500/10 border border-red-500/30"> <div className="space-y-3 p-4 rounded-lg bg-red-500/10 border border-red-500/30">
<p className="text-sm text-red-300 font-semibold"> <p className="text-sm text-red-300 font-semibold flex items-center gap-2">
⚠️ Diese Aktion ist unwiderruflich. Alle personenbezogenen Daten werden überschrieben. <AlertTriangle className="w-4 h-4 shrink-0 text-red-400" />
<span>Diese Aktion ist unwiderruflich. Alle personenbezogenen Daten werden überschrieben.</span>
</p> </p>
<div className="flex gap-3"> <div className="flex gap-3">
<Button <Button

7
shop/components/HeaderWrapper.tsx
View File

@@ -3,6 +3,8 @@
import { usePathname } from "next/navigation"; import { usePathname } from "next/navigation";
import { DemoWrapper } from "./DemoWrapper"; import { DemoWrapper } from "./DemoWrapper";
import { AlertTriangle } from "lucide-react";
interface HeaderWrapperProps { interface HeaderWrapperProps {
navbar: React.ReactNode; navbar: React.ReactNode;
children: React.ReactNode; children: React.ReactNode;
@@ -25,9 +27,10 @@ export function HeaderWrapper({ navbar, children }: HeaderWrapperProps) {
<DemoWrapper> <DemoWrapper>
<div <div
id="demo-banner" id="demo-banner"
className="bg-amber-500/10 border-b border-amber-500/20 py-2 px-4 text-center text-xs text-amber-600 dark:text-amber-400 font-medium tracking-wide z-50" className="bg-amber-500/10 border-b border-amber-500/20 py-2 px-4 text-center text-xs text-amber-600 dark:text-amber-400 font-medium tracking-wide z-50 flex items-center justify-center gap-1.5"
> >
⚠️ Dies ist eine **Demo-Webseite (Dummy-Shop)**. Es werden keine echten Bestellungen verarbeitet oder Zahlungen abgewickelt. <AlertTriangle className="w-3.5 h-3.5 shrink-0" />
<span>Dies ist eine **Demo-Webseite (Dummy-Shop)**. Es werden keine echten Bestellungen verarbeitet oder Zahlungen abgewickelt.</span>
</div> </div>
</DemoWrapper> </DemoWrapper>

39
shop/components/admin/create-product-dialog.tsx
View File

@@ -26,7 +26,7 @@ import {
import { Input } from '@/components/ui/input' import { Input } from '@/components/ui/input'
import { Button } from '@/components/ui/button' import { Button } from '@/components/ui/button'
import { Checkbox } from '@/components/ui/checkbox' import { Checkbox } from '@/components/ui/checkbox'
import { Plus, Trash2, X, PlusCircle } from 'lucide-react' import { Plus, Trash2, X, PlusCircle, CreditCard, RefreshCw } from 'lucide-react'
import { createProduct, updateProduct } from '@/lib/actions/products' import { createProduct, updateProduct } from '@/lib/actions/products'
import { ScrollArea } from '@/components/ui/scroll-area' import { ScrollArea } from '@/components/ui/scroll-area'
import { Separator } from '@/components/ui/separator' import { Separator } from '@/components/ui/separator'
@@ -288,23 +288,26 @@ export function CreateProductDialog({
<FormLabel className="text-slate-900 dark:text-white">Abrechnungsmodell</FormLabel> <FormLabel className="text-slate-900 dark:text-white">Abrechnungsmodell</FormLabel>
<div className="grid grid-cols-2 gap-2 pt-1"> <div className="grid grid-cols-2 gap-2 pt-1">
{[ {[
{ value: 'one_time', label: 'Einmalig', icon: '💳' }, { value: 'one_time', label: 'Einmalig', icon: CreditCard },
{ value: 'monthly', label: 'Monatlich', icon: '🔄' }, { value: 'monthly', label: 'Monatlich', icon: RefreshCw },
].map(opt => ( ].map(opt => {
<button const IconComponent = opt.icon;
key={opt.value} return (
type="button" <button
onClick={() => field.onChange(opt.value)} key={opt.value}
className={`flex flex-col items-center gap-1 p-3 rounded-xl border-2 text-sm font-medium transition-all ${ type="button"
field.value === opt.value onClick={() => field.onChange(opt.value)}
? 'border-primary bg-primary/10 text-primary dark:text-white' className={`flex flex-col items-center gap-1 p-3 rounded-xl border-2 text-sm font-medium transition-all ${
: 'border-slate-200 dark:border-white/10 bg-slate-50 dark:bg-white/5 text-slate-500 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/10' field.value === opt.value
}`} ? 'border-primary bg-primary/10 text-primary dark:text-white'
> : 'border-slate-200 dark:border-white/10 bg-slate-50 dark:bg-white/5 text-slate-500 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/10'
<span className="text-lg">{opt.icon}</span> }`}
{opt.label} >
</button> <IconComponent className="w-5 h-5 mb-1" />
))} {opt.label}
</button>
);
})}
</div> </div>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>

34
shop/components/invoice-pdf.tsx
View File

@@ -94,6 +94,14 @@ const styles = StyleSheet.create({
} }
}); });
export const stripEmojis = (text?: string | null): string => {
if (!text) return '';
return text
.replace(/[\p{Emoji_Presentation}\p{Extended_Pictographic}\uFE0F\u200D]/gu, '')
.replace(/\s{2,}/g, ' ')
.trim();
};
export const InvoicePDF = ({ export const InvoicePDF = ({
order, order,
orderSnapshot, orderSnapshot,
@@ -105,7 +113,7 @@ export const InvoicePDF = ({
const items = orderSnapshot?.items ?? []; const items = orderSnapshot?.items ?? [];
const taxRate = orderSnapshot?.tax_rate ?? 19; const taxRate = orderSnapshot?.tax_rate ?? 19;
const isSubscription = order?.type === 'subscription' || orderSnapshot?.billing_cycle === 'monthly'; const isSubscription = order?.type === 'subscription' || orderSnapshot?.billing_cycle === 'monthly';
const formattedOrderNumber = (order.order_number || order.id || '').replace(/^BE-/, 'AE-'); const formattedOrderNumber = stripEmojis((order.order_number || order.id || '').replace(/^BE-/, 'AE-'));
const isUpgrade = !!orderSnapshot?.last_license_date; const isUpgrade = !!orderSnapshot?.last_license_date;
let oneTimeNet = 0; let oneTimeNet = 0;
@@ -136,16 +144,16 @@ export const InvoicePDF = ({
const groupedItems: { [key: string]: any[] } = {}; const groupedItems: { [key: string]: any[] } = {};
items.forEach((item: any) => { items.forEach((item: any) => {
const devName = item.device_name || 'Kasse 1'; const devName = stripEmojis(item.device_name || 'Kasse 1');
if (!groupedItems[devName]) { if (!groupedItems[devName]) {
groupedItems[devName] = []; groupedItems[devName] = [];
} }
groupedItems[devName].push(item); groupedItems[devName].push(item);
}); });
const displayPartnerName = partnerCompanyName || order?.partner_company_name; const displayPartnerName = stripEmojis(partnerCompanyName || order?.partner_company_name);
const displayUserName = partnerUserName || order?.partner_user_name; const displayUserName = stripEmojis(partnerUserName || order?.partner_user_name);
const displayUserEmail = partnerUserEmail || order?.partner_user_email; const displayUserEmail = stripEmojis(partnerUserEmail || order?.partner_user_email);
return ( return (
<Document> <Document>
@@ -170,11 +178,11 @@ export const InvoicePDF = ({
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 15 }}> <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 15 }}>
<View style={{ width: '48%' }}> <View style={{ width: '48%' }}>
<Text style={styles.label}>Endkunde</Text> <Text style={styles.label}>Endkunde</Text>
<Text style={{ fontWeight: 'bold' }}>{customer.company_name}</Text> <Text style={{ fontWeight: 'bold' }}>{stripEmojis(customer?.company_name)}</Text>
{customer.first_name || customer.last_name ? <Text>{customer.first_name} {customer.last_name}</Text> : null} {(customer?.first_name || customer?.last_name) ? <Text>{stripEmojis(`${customer?.first_name || ''} ${customer?.last_name || ''}`)}</Text> : null}
{customer.address ? <Text>{customer.address}</Text> : null} {customer?.address ? <Text>{stripEmojis(customer.address)}</Text> : null}
{customer.zip_code || customer.city ? <Text>{customer.zip_code} {customer.city}</Text> : null} {(customer?.zip_code || customer?.city) ? <Text>{stripEmojis(`${customer?.zip_code || ''} ${customer?.city || ''}`)}</Text> : null}
{customer.vat_id ? <Text>USt-IdNr: {customer.vat_id}</Text> : null} {customer?.vat_id ? <Text>USt-IdNr: {stripEmojis(customer.vat_id)}</Text> : null}
</View> </View>
<View style={{ width: '48%' }}> <View style={{ width: '48%' }}>
@@ -205,8 +213,8 @@ export const InvoicePDF = ({
{devItems.map((item: any, idx: number) => ( {devItems.map((item: any, idx: number) => (
<View key={idx} style={{ marginBottom: 6 }}> <View key={idx} style={{ marginBottom: 6 }}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 2 }}> <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 2 }}>
<Text style={{ fontSize: 9, fontWeight: 'bold', color: '#334155' }}> <Text style={{ fontSize: 9, fontWeight: 'bold', color: '#344155' }}>
{item.product_name} ({item.category_name}) {stripEmojis(item.product_name)} ({stripEmojis(item.category_name)})
</Text> </Text>
<Text style={{ fontSize: 9, fontWeight: 'bold', color: '#0f172a' }}> <Text style={{ fontSize: 9, fontWeight: 'bold', color: '#0f172a' }}>
{formattedPrice(item.base_price)} {item.billing_interval === 'one_time' ? 'einmalig' : 'mtl.'} {formattedPrice(item.base_price)} {item.billing_interval === 'one_time' ? 'einmalig' : 'mtl.'}
@@ -218,7 +226,7 @@ export const InvoicePDF = ({
return ( return (
<View key={mIdx} style={{ flexDirection: 'row', justifyContent: 'space-between', paddingLeft: 12, marginBottom: 1 }}> <View key={mIdx} style={{ flexDirection: 'row', justifyContent: 'space-between', paddingLeft: 12, marginBottom: 1 }}>
<Text style={{ fontSize: 8, color: '#64748b' }}> <Text style={{ fontSize: 8, color: '#64748b' }}>
+ {mod.module_name} {qty > 1 ? `(x${qty})` : ''} + {stripEmojis(mod.module_name)} {qty > 1 ? `(x${qty})` : ''}
</Text> </Text>
<Text style={{ fontSize: 8, color: '#64748b' }}> <Text style={{ fontSize: 8, color: '#64748b' }}>
+{formattedPrice(price)} mtl. +{formattedPrice(price)} mtl.

6
shop/components/login-form.tsx
View File

@@ -16,6 +16,7 @@ import Link from "next/link";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState, useEffect, useRef, useCallback } from "react"; import { useState, useEffect, useRef, useCallback } from "react";
import { motion, AnimatePresence } from "framer-motion"; import { motion, AnimatePresence } from "framer-motion";
import { Ban } from "lucide-react";
function getDeviceHash(): string { function getDeviceHash(): string {
const key = "caspos-device-id"; const key = "caspos-device-id";
@@ -227,8 +228,9 @@ export function LoginForm({
/> />
</div> </div>
{errorParam === "gesperrt" && ( {errorParam === "gesperrt" && (
<p className="text-sm text-red-500 bg-red-500/10 border border-red-500/20 p-3 rounded-lg text-center font-medium"> <p className="text-sm text-red-500 bg-red-500/10 border border-red-500/20 p-3 rounded-lg text-center font-medium flex items-center justify-center gap-2">
🚫 Ihr Konto wurde gesperrt. Bitte wenden Sie sich an den Administrator. <Ban className="w-4 h-4 shrink-0" />
<span>Ihr Konto wurde gesperrt. Bitte wenden Sie sich an den Administrator.</span>
</p> </p>
)} )}
{messageParam === "concurrent" && ( {messageParam === "concurrent" && (

8
shop/components/order-wizard.tsx
View File

@@ -8,7 +8,7 @@ import { submitOrder, updateOrder } from '@/lib/actions/orders'
import { createEndCustomer } from '@/lib/actions/end-customers' import { createEndCustomer } from '@/lib/actions/end-customers'
import { isLicenseNumberTaken } from '@/lib/actions/queries' import { isLicenseNumberTaken } from '@/lib/actions/queries'
import { Category } from '@/lib/types' import { Category } from '@/lib/types'
import { Check } from 'lucide-react' import { Check, Zap } from 'lucide-react'
// Modular Step Components // Modular Step Components
import { ProgressStepper } from './wizard/progress-stepper' import { ProgressStepper } from './wizard/progress-stepper'
@@ -991,8 +991,8 @@ export function OrderWizard({
</div> </div>
{hasSelection ? ( {hasSelection ? (
<span className="text-[9px] px-1.5 py-0.2 rounded-full font-semibold shrink-0 border border-emerald-500/30 text-emerald-400 bg-emerald-500/10"> <span className="text-[9px] px-1.5 py-0.5 rounded-full font-semibold shrink-0 border border-emerald-500/30 text-emerald-400 bg-emerald-500/10 flex items-center justify-center">
✓ <Check className="w-2.5 h-2.5" />
</span> </span>
) : isRequired ? ( ) : isRequired ? (
<span className="text-[9px] px-1.5 py-0.2 rounded-full font-extrabold shrink-0 border border-red-500 text-red-400 bg-red-500/20 animate-pulse tracking-wider"> <span className="text-[9px] px-1.5 py-0.2 rounded-full font-extrabold shrink-0 border border-red-500 text-red-400 bg-red-500/20 animate-pulse tracking-wider">
@@ -1079,7 +1079,7 @@ export function OrderWizard({
{/* Upgrade-Modus Hinweis-Banner */} {/* Upgrade-Modus Hinweis-Banner */}
{upgradeMode && lockedDeviceId && ( {upgradeMode && lockedDeviceId && (
<div className="mb-4 p-3 rounded-xl bg-primary/10 border border-primary/20 text-xs text-primary/90 flex items-start gap-2"> <div className="mb-4 p-3 rounded-xl bg-primary/10 border border-primary/20 text-xs text-primary/90 flex items-start gap-2">
<span className="text-primary mt-0.5">⚡</span> <Zap className="w-4 h-4 text-primary shrink-0 mt-0.5" />
<div> <div>
<p className="font-semibold">Upgrade-Modus: {lockedDeviceId}</p> <p className="font-semibold">Upgrade-Modus: {lockedDeviceId}</p>
<p className="text-primary/70 mt-0.5">Bereits lizenzierte Module sind ausgegraut und können nicht doppelt gebucht werden.</p> <p className="text-primary/70 mt-0.5">Bereits lizenzierte Module sind ausgegraut und können nicht doppelt gebucht werden.</p>

2
shop/components/tutorial/fetch-data-steps.tsx
View File

@@ -156,7 +156,7 @@ export function FetchDataSteps() {
</TutorialStep> </TutorialStep>
<TutorialStep title="Build in a weekend and scale to millions!"> <TutorialStep title="Build in a weekend and scale to millions!">
<p>You&apos;re ready to launch your product to the world! 🚀</p> <p>You&apos;re ready to launch your product to the world!</p>
</TutorialStep> </TutorialStep>
</ol> </ol>
); );

4
shop/components/wizard/step-software.tsx
View File

@@ -93,8 +93,8 @@ export function StepSoftware({
{editingDeviceName && ( {editingDeviceName && (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Badge className="bg-amber-500/20 text-amber-400 border border-amber-500/30 text-xs font-bold gap-1.5 px-2.5 py-0.5 rounded-lg animate-pulse shrink-0"> <Badge className="bg-amber-500/20 text-amber-400 border border-amber-500/30 text-xs font-bold gap-1.5 px-2.5 py-0.5 rounded-lg animate-pulse shrink-0 flex items-center">
✏️ Kasse: &quot;{editingDeviceName}&quot; <Icons.Pencil className="w-3 h-3 text-amber-400 mr-1" /> Kasse: &quot;{editingDeviceName}&quot;
</Badge> </Badge>
{onCancelEdit && ( {onCancelEdit && (
<Button <Button

4
shop/components/wizard/toast-notification.tsx
View File

@@ -1,7 +1,7 @@
'use client' 'use client'
import { motion, AnimatePresence } from 'framer-motion' import { motion, AnimatePresence } from 'framer-motion'
import { AlertCircle } from 'lucide-react' import { AlertCircle, X } from 'lucide-react'
import { Button } from '@/components/ui/button' import { Button } from '@/components/ui/button'
interface ToastProps { interface ToastProps {
@@ -31,7 +31,7 @@ export function ToastNotification({ toast, onClose }: ToastProps) {
className="w-5 h-5 ml-auto text-slate-400 hover:text-white" className="w-5 h-5 ml-auto text-slate-400 hover:text-white"
onClick={onClose} onClick={onClose}
> >
✕ <X className="w-3.5 h-3.5" />
</Button> </Button>
</motion.div> </motion.div>
)} )}

8
shop/lib/actions/auth.ts
View File

@@ -158,17 +158,17 @@ function get2FAEmailHtml(code: string) {
<div style="background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border-radius: 12px; padding: 16px 20px; margin: 24px 0; border-left: 4px solid #f59e0b;"> <div style="background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border-radius: 12px; padding: 16px 20px; margin: 24px 0; border-left: 4px solid #f59e0b;">
<p style="color: #92400e; font-size: 14px; margin: 0; line-height: 1.5;"> <p style="color: #92400e; font-size: 14px; margin: 0; line-height: 1.5;">
⏱️ <strong>Dieser Code ist 15 Minuten gültig.</strong><br> <strong>Dieser Code ist 15 Minuten gültig.</strong><br>
Falls Sie diese Anmeldung nicht durchgeführt haben, ändern Sie bitte umgehend Ihr Passwort. Falls Sie diese Anmeldung nicht durchgeführt haben, ändern Sie bitte umgehend Ihr Passwort.
</p> </p>
</div> </div>
<p style="color: #64748b; font-size: 13px; line-height: 1.6; margin-top: 24px;"> <p style="color: #64748b; font-size: 13px; line-height: 1.6; margin-top: 24px;">
🔒 Dieser Code dient der Sicherheit Ihres Kontos. Geben Sie ihn niemals an andere Personen weiter. Dieser Code dient der Sicherheit Ihres Kontos. Geben Sie ihn niemals an andere Personen weiter.
</p> </p>
` `
return getBeautifulEmailHtml('🔐 Sicherheitscode', messageHtml) return getBeautifulEmailHtml('Sicherheitscode', messageHtml)
} }
/** Internal: generates code + sends email (no auth check needed) */ /** Internal: generates code + sends email (no auth check needed) */
@@ -199,7 +199,7 @@ async function send2FACodeInternal(userId: string, deviceHash: string, email: st
// Mail senden // Mail senden
await sendMail({ await sendMail({
to: email, to: email,
subject: '🔐 Ihr Sicherheitscode – CASPOS Shop', subject: 'Ihr Sicherheitscode – CASPOS Shop',
text: `Ihr Sicherheitscode lautet: ${code}\n\nDieser Code ist 15 Minuten gültig.\n\nFalls Sie diese Anmeldung nicht durchgeführt haben, ändern Sie bitte umgehend Ihr Passwort.`, text: `Ihr Sicherheitscode lautet: ${code}\n\nDieser Code ist 15 Minuten gültig.\n\nFalls Sie diese Anmeldung nicht durchgeführt haben, ändern Sie bitte umgehend Ihr Passwort.`,
html: get2FAEmailHtml(code), html: get2FAEmailHtml(code),
}) })

2
shop/lib/actions/email-templates.ts
View File

@@ -144,7 +144,7 @@ export function getStatusEmailTemplate(
? ` ? `
<p style="text-align: center; margin: 32px 0 0 0;"> <p style="text-align: center; margin: 32px 0 0 0;">
<span style="display: inline-block; background-color: #1e293b; border: 1px solid #334155; border-radius: 6px; padding: 10px 20px; color: #3b82f6; font-size: 13px; font-weight: bold; letter-spacing: 0.025em;"> <span style="display: inline-block; background-color: #1e293b; border: 1px solid #334155; border-radius: 6px; padding: 10px 20px; color: #3b82f6; font-size: 13px; font-weight: bold; letter-spacing: 0.025em;">
📎 PDF im Anhang verfügbar PDF im Anhang verfügbar
</span> </span>
</p> </p>
` `