joaonloureiro/portfolio-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update social media links in Footer component to use environment variables and refactor Contact component to utilize backend URL from environment variable

Browse Source
This commit is contained in:
João Loureiro
2025-06-09 12:21:20 -03:00
parent 6316a59170
commit d57afe93a3
2 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/app/components/Footer.tsx
View File

@@ -5,18 +5,22 @@ import { FaGithub, FaLinkedin, FaTwitter } from 'react-icons/fa';
export default function Footer() { export default function Footer() {
const t = useTranslations('footer'); const t = useTranslations('footer');
const githubUrl = process.env.NEXT_PUBLIC_GITHUB_URL || '#';
const linkedinUrl = process.env.NEXT_PUBLIC_LINKEDIN_URL || '#';
const twitterUrl = process.env.NEXT_PUBLIC_TWITTER_URL || '#';
return ( return (
<footer className="border-t border-[var(--color-border)] py-8 text-[var(--color-text-secondary)]"> <footer className="border-t border-[var(--color-border)] py-8 text-[var(--color-text-secondary)]">
<div className="container mx-auto flex flex-col md:flex-row justify-between items-center gap-4 px-4 sm:px-6 lg:px-8"> <div className="container mx-auto flex flex-col md:flex-row justify-between items-center gap-4 px-4 sm:px-6 lg:px-8">
<p className="text-sm">&copy; {new Date().getFullYear()} João Loureiro. {t('copyright')}</p> <p className="text-sm">&copy; {new Date().getFullYear()} João Loureiro. {t('copyright')}</p>
<div className="flex items-center space-x-4"> <div className="flex items-center space-x-4">
<Link href="#" aria-label="GitHub" target="_blank" className="hover:text-[var(--color-primary)] transition-colors"> <Link href={githubUrl} aria-label="GitHub" target="_blank" className="hover:text-[var(--color-primary)] transition-colors">
<FaGithub size={20} /> <FaGithub size={20} />
</Link> </Link>
<Link href="#" aria-label="LinkedIn" target="_blank" className="hover:text-[var(--color-primary)] transition-colors"> <Link href={linkedinUrl} aria-label="LinkedIn" target="_blank" className="hover:text-[var(--color-primary)] transition-colors">
<FaLinkedin size={20} /> <FaLinkedin size={20} />
</Link> </Link>
<Link href="#" aria-label="Twitter" target="_blank" className="hover:text-[var(--color-primary)] transition-colors"> <Link href={twitterUrl} aria-label="Twitter" target="_blank" className="hover:text-[var(--color-primary)] transition-colors">
<FaTwitter size={20} /> <FaTwitter size={20} />
</Link> </Link>
</div> </div>

4
frontend/src/app/components/sections/Contact.tsx
View File

@@ -8,6 +8,7 @@ export default function Contact() {
const t = useTranslations('contact'); const t = useTranslations('contact');
const [formData, setFormData] = useState<{ name: string; email: string; message: string }>({ name: '', email: '', message: '' }); const [formData, setFormData] = useState<{ name: string; email: string; message: string }>({ name: '', email: '', message: '' });
const [isSubmitting, setIsSubmitting] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false);
const backendUrl = process.env.NEXT_PUBLIC_BACKEND_URL || 'http://localhost:3001';
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => { const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
setFormData({...formData, [e.target.name]: e.target.value }); setFormData({...formData, [e.target.name]: e.target.value });
@@ -29,9 +30,8 @@ export default function Contact() {
} }
const submissionPromise = async () => { const submissionPromise = async () => {
//const backendUrl = process.env.NEXT_PUBLIC_BACKEND_URL;
try { try {
const response = await fetch(`http://localhost:3001/api/email/send`, { const response = await fetch(`${backendUrl}/api/email/send`, {
method: 'POST', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(formData), body: JSON.stringify(formData),