Merge pull request #52 from meceware/dev

meceware · web-flow · commit c4c8bc540353 · 2025-02-20T21:38:28.000+02:00
v1.2.1
diff --git a/.github/workflows/docker-build.yml b/.github/workflows/docker-build.yml
@@ -57,4 +57,5 @@ jobs:
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=gha
-          cache-to: type=gha,mode=max
+          cache-to: type=gha,mode=max
+          network: host
diff --git a/public/apple-icon.png b/public/apple-icon.png
diff --git a/public/images/og.png b/public/images/og.png
diff --git a/public/images/x.png b/public/images/x.png
diff --git a/src/app/contact/actions.js b/src/app/contact/actions.js
@@ -2,6 +2,7 @@
 
 import { Resend } from 'resend';
 import { z } from 'zod';
+import { siteConfig } from '@/components/config';
 
 const resend = new Resend(process.env.RESEND_API_KEY);
 
@@ -41,11 +42,42 @@ export async function sendContactForm(formData) {
     await resend.emails.send({
       from: `Contact Form <${process.env.RESEND_FROM}>`,
       to: process.env.RESEND_CONTACT_EMAIL,
-      subject: `Contact Form Submission from ${name}`,
-      text: `
+      replyTo: `${name} <${email_address}>`,
+      subject: `Contact form submission from ${name}`,
+      text: `New Contact Form Submission
+
 Name: ${name}
 Email: ${email_address}
-Message: ${message}
+
+Message:
+${message}
+
+This is an automated message from ${siteConfig.name}.`,
+      html: `
+          <body style="margin: 0; padding: 0; background-color: #efefef;">
+            <table role="presentation" style="width: 100%; border-collapse: collapse; border: 0;">
+              <tr>
+                <td align="center" style="padding: 1rem 2rem;">
+                  <div style="max-width: 400px; background-color: #ffffff; padding: 1rem; text-align: left;">
+                    <h2 style="margin: 1rem 0; color: #000000;">Contact Form Submission</h2>
+                    <p>This is an automated message from ${siteConfig.name}.</p>
+                    <div style="margin: 1rem 0;">
+                      <strong>Name:</strong> ${name}<br>
+                      <strong>Email:</strong> ${email_address}<br><br>
+                      <strong>Message:</strong><br>
+                      ${message}
+                    </div>
+                  </div>
+                  <div style="max-width: 400px; color: #999999; text-align: center;">
+                    <p style="padding-bottom: 0.5rem;">Made with ♥ by <a href="${siteConfig.url}" target="_blank">${siteConfig.name}</a></p>
+                    <div style="text-align: center;">
+                      <img src="${siteConfig.url}/icon.png" alt="${siteConfig.from}" style="width: 96px;">
+                    </div>
+                  </div>
+                </td>
+              </tr>
+            </table>
+          </body>
       `,
     });
 
diff --git a/src/app/layout.js b/src/app/layout.js
@@ -21,28 +21,31 @@ const inter = Inter({ subsets: ['latin'] });
 
 // Metadata
 export const metadata = {
-  metadataBase: new URL( siteConfig.url ),
+  metadataBase: new URL(siteConfig.url),
   alternates: {
-    canonical: '/',
+    canonical: './',
   },
   title: {
     default: siteConfig.title,
-    template: `%s | ${ siteConfig.name }`,
+    template: `%s | ${siteConfig.name}`,
   },
   description: siteConfig.description,
   keywords: siteConfig.keywords,
-  authors: [ siteConfig.author ],
+  authors: [siteConfig.author],
   creator: siteConfig.author.name,
   publisher: siteConfig.author.name,
   referrer: 'origin-when-cross-origin',
   robots: {
     index: true,
     follow: true,
-    nocache: true,
+    nocache: false,
+    noimageindex: false,
+    'max-video-preview': -1,
+    'max-image-preview': 'large',
+    'max-snippet': -1,
     googleBot: {
       index: true,
       follow: true,
-      noimageindex: true,
       'max-video-preview': -1,
       'max-image-preview': 'large',
       'max-snippet': -1,
@@ -55,35 +58,36 @@ export const metadata = {
     title: siteConfig.title,
     description: siteConfig.description,
     siteName: siteConfig.name,
-    images: [ `/og.png` ],
+    images: ['/images/og.png'],
   },
   twitter: {
     card: 'summary_large_image',
     title: siteConfig.title,
     description: siteConfig.description,
-    images: [ `/og.png` ],
+    images: ['/images/x.png'],
   },
   icons: {
     icon: [
+      { url: '/icons/icon-32.png', sizes: '32x32', type: 'image/png' },
       { url: '/icons/icon-96.png', sizes: '96x96', type: 'image/png' },
-      { url: '/favicon.svg', type: 'image/svg+xml' },
+      { url: '/icons/icon-192.png', sizes: '192x192', type: 'image/png' },
+      { url: '/icons/icon-256.png', sizes: '256x256', type: 'image/png' },
+      { url: '/icons/icon-512.png', sizes: '512x512', type: 'image/png' },
     ],
     shortcut: '/favicon.ico',
     apple: '/apple-touch-icon.png',
   },
   manifest: '/manifest.webmanifest',
-  category: 'technology',
 };
 
 // Viewport
 export const viewport = {
   themeColor: [
-    { media: '(prefers-color-scheme: light)', color: '#FFFFFF' }, // TODO: does this work?
+    { media: '(prefers-color-scheme: light)', color: '#FFFFFF' },
     { media: '(prefers-color-scheme: dark)', color: '#09090B' },
   ],
   width: 'device-width',
   initialScale: 1,
-  maximumScale: 1,
 };
 
 // Root Layout
@@ -93,7 +97,7 @@ export default async function RootLayout({ children }) {
   return (
     <html lang='en' suppressHydrationWarning>
       <body className={`${inter.className} antialiased`}>
-        <SessionProvider session={ session }>
+        <SessionProvider session={session}>
           <ThemeProvider attribute='class' defaultTheme='system' enableSystem disableTransitionOnChange>
             <PushNotificationProvider>
               <div className='flex min-h-screen flex-col'>
@@ -103,13 +107,13 @@ export default async function RootLayout({ children }) {
                 />
                 <main className='flex flex-col h-full grow items-center p-8 md:p-12'>
                   <div className='container flex flex-col items-center gap-6 text-center grow relative'>
-                    { children }
+                    {children}
                   </div>
                 </main>
-                <Footer author={ siteConfig.author } github={ siteConfig.links.github } />
+                <Footer author={siteConfig.author} github={siteConfig.links.github} />
               </div>
-              { session && <PushNotificationToggle vapidPublicKey={process.env.NEXT_PUBLIC_VAPID_PUBLIC_KEY || ''} /> }
-              { session && <AddToHomeScreen /> }
+              {session && <PushNotificationToggle vapidPublicKey={process.env.NEXT_PUBLIC_VAPID_PUBLIC_KEY || ''} />}
+              {session && <AddToHomeScreen />}
             </PushNotificationProvider>
             <Toaster richColors closeButton />
             <CookieConsent />
diff --git a/src/app/terms-of-service/terms-of-service.js b/src/app/terms-of-service/terms-of-service.js
@@ -2,6 +2,7 @@
 
 import Link from 'next/link';
 import { Card, CardContent } from '@/components/ui/card';
+import { siteConfig } from '@/components/config';
 
 export const TermsOfService = () => {
   return (
@@ -17,14 +18,14 @@ export const TermsOfService = () => {
 
           <section className='space-y-4'>
             <p>
-              Welcome to the Wapy.dev website (the "Site"). By accessing or using the Site, you agree to comply with and be bound by the following terms and conditions ("Terms of Service").
+              Welcome to the {siteConfig.name} website (the "Site"). By accessing or using the Site, you agree to comply with and be bound by the following terms and conditions ("Terms of Service").
             </p>
           </section>
 
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Overview</h2>
             <p>
-              Wapy.dev offers this Site, including all information, tools, and services available from this Site to you, the user, conditioned upon your acceptance of all terms, conditions, policies, and notices stated here.
+              {siteConfig.name} offers this Site, including all information, tools, and services available from this Site to you, the user, conditioned upon your acceptance of all terms, conditions, policies, and notices stated here.
             </p>
             <p>
               Please read these Terms of Service carefully before accessing or using the Site. By accessing or using any part of the Site, you agree to be bound by these Terms of Service. If you do not agree to all the terms and conditions of this agreement, then you may not access the Site or use any services. If these Terms of Service are considered an offer, acceptance is expressly limited to these Terms of Service.
@@ -89,7 +90,7 @@ export const TermsOfService = () => {
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Limitation of Liability</h2>
             <p>
-              Wapy.dev shall not be held responsible for any indirect, incidental, special, or consequential damages that may occur from your use of the Site, regardless of whether such damages arise from contract, tort, negligence, strict liability, or any other legal theory. The maximum amount Site may be liable for in any claim related to the Site is limited to the total subscription fees you have paid in the last 12 months.
+              {siteConfig.name} shall not be held responsible for any indirect, incidental, special, or consequential damages that may occur from your use of the Site, regardless of whether such damages arise from contract, tort, negligence, strict liability, or any other legal theory. The maximum amount Site may be liable for in any claim related to the Site is limited to the total subscription fees you have paid in the last 12 months.
             </p>
           </section>
 
@@ -103,7 +104,7 @@ export const TermsOfService = () => {
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Indemnification</h2>
             <p>
-              You agree to indemnify and hold harmless Wapy.dev, its affiliates, officers, directors, employees, agents, and licensors from and against any claims, liabilities, damages, losses, and expenses, including without limitation reasonable attorney&apos;s fees, arising out of or in connection with your use of the Site, your violation of these Terms of Service, or your violation of any rights of another party.
+              You agree to indemnify and hold harmless {siteConfig.name}, its affiliates, officers, directors, employees, agents, and licensors from and against any claims, liabilities, damages, losses, and expenses, including without limitation reasonable attorney&apos;s fees, arising out of or in connection with your use of the Site, your violation of these Terms of Service, or your violation of any rights of another party.
             </p>
           </section>
 
@@ -120,14 +121,14 @@ export const TermsOfService = () => {
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Governing Law and Jurisdiction</h2>
             <p>
-              These Terms of Service shall be governed by and construed in accordance with the laws of the jurisdiction where Wapy.dev is headquartered without giving effect to any principles of conflicts of law. You agree to submit to the exclusive jurisdiction of the courts in that jurisdiction for any disputes arising out of or in connection with these Terms of Service or your use of the Site.
+              These Terms of Service shall be governed by and construed in accordance with the laws of the jurisdiction where {siteConfig.name} is headquartered without giving effect to any principles of conflicts of law. You agree to submit to the exclusive jurisdiction of the courts in that jurisdiction for any disputes arising out of or in connection with these Terms of Service or your use of the Site.
             </p>
           </section>
 
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Entire Agreement</h2>
             <p>
-              These Terms of Service constitute the entire agreement between you and Wapy.dev regarding your use of the Site and supersede all prior and contemporaneous agreements and understandings, whether oral or written, relating to the same subject matter.
+              These Terms of Service constitute the entire agreement between you and {siteConfig.name} regarding your use of the Site and supersede all prior and contemporaneous agreements and understandings, whether oral or written, relating to the same subject matter.
             </p>
           </section>
 
@@ -141,7 +142,7 @@ export const TermsOfService = () => {
           <section className='space-y-4'>
             <h2 className='text-2xl font-semibold'>Waiver</h2>
             <p>
-              The failure of Wapy.dev to enforce any right or provision of these Terms of Service shall not constitute a waiver of that right or provision.
+              The failure of {siteConfig.name} to enforce any right or provision of these Terms of Service shall not constitute a waiver of that right or provision.
             </p>
           </section>
 
diff --git a/src/components/config.js b/src/components/config.js
@@ -1,8 +1,8 @@
 export const siteConfig = {
   name: 'Wapy.dev',
   title: 'Wapy.dev - Subscription Manager',
-  description: 'Track, manage, and optimize your subscriptions and recurring expenses in one powerful and human readable dashboard. Get notified and never miss a payment again.',
-  keywords: 'subscription, expense, tracker, wapy, meceware',
+  description: 'Effortlessly track and manage all your subscriptions and recurring expenses in a powerful, easy-to-read dashboard. Know exactly what you\'re spending and get timely notifications to ensure you never miss a payment.',
+  keywords: 'subscription tracker, subscription management, recurring payments, expense tracker, manage subscriptions, budgeting tools, personal finance tracker, track my subscriptions, expense management, subscription monitoring, money-saving tools, wapy, meceware',
   url: process.env.SITE_URL || 'http://localhost:3000',
   links: {
     github: 'https://github.com/meceware/wapy.dev',
diff --git a/src/components/footer.js b/src/components/footer.js
@@ -9,7 +9,6 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
-import { Button } from '@/components/ui/button';
 
 export default function Footer( { author, github } ) {
   return (
@@ -39,7 +38,7 @@ export default function Footer( { author, github } ) {
             <Separator orientation='vertical' className='h-4' />
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
-                <button className='inline-flex items-center gap-1 text-sm text-center font-medium focus:outline-hidden'>
+                <button className='inline-flex items-center gap-1 text-sm text-center font-medium focus:outline-hidden cursor-pointer'>
                   <Icons.menu className='size-4' />
                   Menu
                 </button>
diff --git a/src/components/header-member.js b/src/components/header-member.js
@@ -41,7 +41,7 @@ export const HeaderMemberIconNavigation = (
         <Icons.settings className='size-5' />
       </Link>
     </Button>
-    <Button variant='ghost' size='icon' title='Sign out' onClick={() => signOut({ callbackUrl: '/' })} className='hidden md:flex'>
+    <Button variant='ghost' size='icon' title='Sign out' onClick={() => signOut({ callbackUrl: '/' })} className='hidden md:flex cursor-pointer'>
       <Icons.signOut className='size-5' />
     </Button>
 
@@ -75,7 +75,7 @@ export const HeaderMemberIconNavigation = (
         <DropdownMenuItem asChild>
           <Link href='/' className='flex items-center gap-2 cursor-pointer focus:outline-hidden'>
             <Icons.send className='size-5' />
-            Contact
+            Contact Us
           </Link>
         </DropdownMenuItem>
         <DropdownMenuItem onClick={() => signOut({ callbackUrl: '/' })} className='flex items-center gap-2 cursor-pointer'>
diff --git a/src/components/header-visitor.js b/src/components/header-visitor.js
@@ -63,7 +63,7 @@ export const HeaderVisitorIconNavigation = (
         <DropdownMenuItem asChild>
           <Link href='/' className='flex items-center gap-2 cursor-pointer focus:outline-hidden'>
             <Icons.send className='size-5' />
-            Contact
+            Contact Us
           </Link>
         </DropdownMenuItem>
       </DropdownMenuContent>
diff --git a/src/components/notifications/notification-bell.js b/src/components/notifications/notification-bell.js
@@ -57,7 +57,7 @@ export function NotificationBell() {
   return (
     <Popover open={open} onOpenChange={setOpen}>
       <PopoverTrigger asChild>
-        <Button variant='ghost' size='icon' className='relative'>
+        <Button variant='ghost' size='icon' className='relative cursor-pointer'>
           <Bell className='h-5 w-5' />
           {unreadCount > 0 && (
             <span
diff --git a/src/components/#-table.js b/src/components/#-table.js
@@ -11,6 +11,7 @@ import {
   CardHeader,
   CardTitle,
 } from '@/components/ui/card';
+import { siteConfig } from '@/components/config';
 
 export const #Table = () => {
   return (
@@ -81,7 +82,7 @@ export const #Table = () => {
           </CardContent>
           <CardFooter className='flex justify-center items-end'>
             <Button variant='outline' size='lg' className='w-full' asChild>
-              <Link href='https://github.com/meceware/wapy.dev' target='_blank' rel='noopener noreferrer'>
+              <Link href={siteConfig.links.github} target='_blank' rel='noopener noreferrer'>
                 <Icons.github className='mr-2 h-4 w-4' />
                 View on GitHub
               </Link>
