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

escape html prolly added

Browse source
This commit is contained in:
Cypro Freelance 2024-07-06 00:50:59 +05:30
parent 6dd363fa4a
commit d5ea4d06f4
3 changed files with 64 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -19,9 +19,10 @@ 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] || escapeHtml(key)}: \n${escapeHtml( `${CONTACT_MESSAGE_FIELDS[key] || key}: ${val.replace(
val /\n/g,
)} \n\n`, "<br/>"
)} <br/><br/>`,
"" ""
); );

5
components/shared/Statistics.tsx
View file

@ -1,5 +1,5 @@
import { stats } from "@/constants"; import { stats } from "@/constants";
import NumTicker from "../widgets/num-tick"; import NumberTicker from "../widgets/num-tick";
const Statistics = () => { const Statistics = () => {
return ( return (
@ -8,8 +8,7 @@ const Statistics = () => {
{stats.map(({ title, count }) => ( {stats.map(({ title, count }) => (
<div key={title} className="space-y-2 text-center"> <div key={title} className="space-y-2 text-center">
<h2 className="text-3xl sm:text-4xl font-bold"> <h2 className="text-3xl sm:text-4xl font-bold">
{count} <NumberTicker value={count} />
{/* <NumTicker value={count} /> */}
</h2> </h2>
<p className="text-xl text-muted-foreground">{title}</p> <p className="text-xl text-muted-foreground">{title}</p>
</div> </div>

16
components/widgets/num-tick.tsx
View file

@ -1,9 +1,11 @@
"use client"; "use client";
import { useInView, useMotionValue, useSpring } from "framer-motion";
import { useEffect, useRef } from "react"; import { useEffect, useRef } from "react";
import { useInView, useMotionValue, useSpring } from "framer-motion";
export default function NumTicker({ import { cn } from "@/lib/utils";
export default function NumberTicker({
value, value,
direction = "up", direction = "up",
delay = 0, delay = 0,
@ -12,7 +14,7 @@ export default function NumTicker({
value: number; value: number;
direction?: "up" | "down"; direction?: "up" | "down";
className?: string; className?: string;
delay?: number; delay?: number; // delay in s
}) { }) {
const ref = useRef<HTMLSpanElement>(null); const ref = useRef<HTMLSpanElement>(null);
const motionValue = useMotionValue(direction === "down" ? value : 0); const motionValue = useMotionValue(direction === "down" ? value : 0);
@ -20,13 +22,12 @@ export default function NumTicker({
damping: 60, damping: 60,
stiffness: 100, stiffness: 100,
}); });
const isInView = useInView(ref, { once: true, margin: "0px" }); const isInView = useInView(ref, { once: true, margin: "0px" });
useEffect(() => { useEffect(() => {
isInView && isInView &&
setTimeout(() => { setTimeout(() => {
motionValue.set(direction === "down" ? value : 0); motionValue.set(direction === "down" ? 0 : value);
}, delay * 1000); }, delay * 1000);
}, [motionValue, isInView, delay, value, direction]); }, [motionValue, isInView, delay, value, direction]);
@ -44,7 +45,10 @@ export default function NumTicker({
return ( return (
<span <span
className={`inline-block tabular-nums text-black dark:text-white ${className}`} className={cn(
"inline-block tabular-nums text-black dark:text-white tracking-wider",
className
)}
ref={ref} ref={ref}
/> />
); );