130 lines
4.3 KiB
TypeScript
130 lines
4.3 KiB
TypeScript
"use client";
|
|
|
|
import Image from "next/image";
|
|
import { FaBriefcase, FaUserGraduate, FaTools } from "react-icons/fa";
|
|
import { useState } from "react";
|
|
|
|
export default function Home() {
|
|
const [file, setFile] = useState<File | null>(null);
|
|
|
|
const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
|
if (event.target.files) {
|
|
setFile(event.target.files[0]);
|
|
}
|
|
};
|
|
|
|
const handleSubmit = async (event: React.FormEvent) => {
|
|
event.preventDefault();
|
|
if (!file) return;
|
|
|
|
const formData = new FormData();
|
|
formData.append("cv", file);
|
|
|
|
try {
|
|
const response = await fetch("/api/upload", {
|
|
method: "POST",
|
|
body: formData,
|
|
});
|
|
|
|
if (response.ok) {
|
|
alert("File uploaded successfully!");
|
|
setFile(null); // Reset the file input
|
|
} else {
|
|
alert("File upload failed.");
|
|
}
|
|
} catch (error) {
|
|
console.error("Error uploading file:", error);
|
|
alert("An error occurred while uploading the file.");
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
|
|
<main className="flex flex-col gap-8 row-start-2 items-center sm:items-start">
|
|
<h1 className="text-3xl font-bold">Welcome to Your CV Upgrade</h1>
|
|
<p className="text-lg text-center">
|
|
This platform is designed to help you enhance your CV and showcase your skills effectively.
|
|
</p>
|
|
<div className="flex flex-col gap-4">
|
|
<div className="flex items-center">
|
|
<FaBriefcase className="text-2xl mr-2" />
|
|
<p>Highlight your professional experience and achievements.</p>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<FaUserGraduate className="text-2xl mr-2" />
|
|
<p>Showcase your educational background and certifications.</p>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<FaTools className="text-2xl mr-2" />
|
|
<p>Utilize our tools to create a standout CV that gets noticed.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col items-center mt-8">
|
|
<label className="mb-2 text-lg">Upload Your CV:</label>
|
|
<input
|
|
type="file"
|
|
accept=".pdf,.doc,.docx"
|
|
onChange={handleFileChange}
|
|
className="border border-gray-300 rounded p-2"
|
|
/>
|
|
{file && <p className="mt-2">Selected file: {file.name}</p>}
|
|
<button
|
|
onClick={handleSubmit}
|
|
className="mt-4 bg-blue-500 text-white rounded p-2"
|
|
>
|
|
Submit
|
|
</button>
|
|
</div>
|
|
</main>
|
|
<footer className="row-start-3 flex gap-6 flex-wrap items-center justify-center">
|
|
<a
|
|
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
|
|
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Image
|
|
aria-hidden
|
|
src="/file.svg"
|
|
alt="File icon"
|
|
width={16}
|
|
height={16}
|
|
/>
|
|
Learn
|
|
</a>
|
|
<a
|
|
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
|
|
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Image
|
|
aria-hidden
|
|
src="/window.svg"
|
|
alt="Window icon"
|
|
width={16}
|
|
height={16}
|
|
/>
|
|
Examples
|
|
</a>
|
|
<a
|
|
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
|
|
href="https://nextjs.org?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Image
|
|
aria-hidden
|
|
src="/globe.svg"
|
|
alt="Globe icon"
|
|
width={16}
|
|
height={16}
|
|
/>
|
|
Go to nextjs.org →
|
|
</a>
|
|
</footer>
|
|
</div>
|
|
);
|
|
}
|