svrjs/svrjs-nextjs-website
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

<br/> fixing #1

Browse source
This commit is contained in:
Cypro Freelance 2024-07-06 00:59:16 +05:30
parent d5ea4d06f4
commit e64de3f4b9
2 changed files with 39 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
app/(root)/contact/page.tsx
View file

@ -1,6 +1,6 @@
"use client"; "use client";
import Iconss from "@/components/ui/icons"; import Iconss from "@/components/ui/icons";
import { MapPin, Phone, Mail, Send } from "lucide-react"; import { Mail, Send, WebhookIcon, Bug, Shield } from "lucide-react";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { z } from "zod"; import { z } from "zod";
@ -79,7 +79,7 @@ const ContactUs = () => {
</div> </div>
<section id="contact" className="w-full"> <section id="contact" className="w-full">
<div className="flex max-md:flex-center flex-col md:flex-row justify-between mx-auto p-5 max-w-3xl"> <div className="flex max-md:flex-center flex-col md:flex-row justify-between mx-auto p-5 max-w-4xl">
{/* Left contact page */} {/* Left contact page */}
<Form {...form}> <Form {...form}>
<form <form
@ -143,28 +143,48 @@ const ContactUs = () => {
<div className="max-w-xl mt-3 md:ml-5"> <div className="max-w-xl mt-3 md:ml-5">
<ul className="ml-2 max-md:flex-center flex-col pr-5"> <ul className="ml-2 max-md:flex-center flex-col pr-5">
<li className="mb-2 text-[#aaa] flex items-center"> <li className="mb-2 text-[#aaa] flex items-center">
<MapPin className="mr-2" size={24} /> <WebhookIcon className="mr-2" size={24} />
<span>webmaster@svrjs.org</span>
</li>
<li className="mb-2 text-[#aaa] flex items-center">
<Phone className="mr-2" size={24} />
<span> <span>
<a <a
href="tel:1-212-555-5555" href="mailto:#"
title="Give me a call" title="Send me an email"
className="text-[#bbb] hover:text-white transition duration-200" className="opacity-70 hover:opacity-100 transition duration-200"
>
webmaster@svrjs.org
</a>
</span>
</li>
<li className="mb-2 text-[#aaa] flex items-center">
<Bug className="mr-2" size={24} />
<span>
<a
href="mailto:#"
title="Send me an email"
className="opacity-70 hover:opacity-100 transition duration-200"
> >
bugreports@svrjs.org bugreports@svrjs.org
</a> </a>
</span> </span>
</li> </li>
<li className="mb-2 text-[#aaa] flex items-center">
<Shield className="mr-2" size={24} />
<span>
<a
href="mailto:#"
title="Send me an email"
className="opacity-70 hover:opacity-100 transition duration-200"
>
vulnerability-reports@svrjs.org
</a>
</span>
</li>
<li className="mb-2 text-[#aaa] flex items-center"> <li className="mb-2 text-[#aaa] flex items-center">
<Mail className="mr-2" size={24} /> <Mail className="mr-2" size={24} />
<span> <span>
<a <a
href="mailto:#" href="mailto:#"
title="Send me an email" title="Send me an email"
className="text-[#bbb] hover:text-white transition duration-200" className="opacity-70 hover:opacity-100 transition duration-200"
> >
support@svrjs.org support@svrjs.org
</a> </a>
@ -177,7 +197,7 @@ const ContactUs = () => {
</ul> </ul>
<hr className="border-t border-white opacity-60 my-4" /> <hr className="border-t border-white opacity-60 my-4" />
<div className="text-center text-[#555] text-sm font-light"> <div className="text-center text-[#555] text-sm font-light">
© ALL RIGHTS RESERVED © ALL RIGHTS RESERVED SVRJS
</div> </div>
</div> </div>
</div> </div>

13
app/api/contact/route.ts
View file

@ -12,17 +12,15 @@ const escapeHtml = (text: string) => {
.replace(/&/g, "&amp;") .replace(/&/g, "&amp;")
.replace(/</g, "&lt;") .replace(/</g, "&lt;")
.replace(/>/g, "&gt;") .replace(/>/g, "&gt;")
.replace(/\n/g, "<br/>"); .replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
}; };
const generateEmailContent = (data: Record<string, string>) => { const generateEmailContent = (data: Record<string, string>) => {
const stringData = Object.entries(data).reduce( const stringData = Object.entries(data).reduce(
(str, [key, val]) => (str, [key, val]) =>
str + str +
`${CONTACT_MESSAGE_FIELDS[key] || key}: ${val.replace( `${CONTACT_MESSAGE_FIELDS[key] || key}: ${val.replace(/\n/g, "\n")} \n\n`,
/\n/g,
"<br/>"
)} <br/><br/>`,
"" ""
); );
@ -31,7 +29,10 @@ const generateEmailContent = (data: Record<string, string>) => {
str + str +
`<h3 class="form-heading">${escapeHtml( `<h3 class="form-heading">${escapeHtml(
CONTACT_MESSAGE_FIELDS[key] || key CONTACT_MESSAGE_FIELDS[key] || key
)}</h3><p class="form-answer">${escapeHtml(val)}</p>`, )}</h3><p class="form-answer">${escapeHtml(val).replace(
/\n/g,
"<br/>"
)}</p>`,
"" ""
); );