EdiFarcas/Car-Fuel-Tracking-App
1
0
Fork 0
mirror of https://github.com/EdiFarcas/Car-Fuel-Tracking-App.git synced 2026-06-22 05:00:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

Latest update

Browse Source
This commit is contained in:
EdiFarcas
2025-07-11 11:15:45 +03:00
parent cf1f78280c
commit a44375298c
11 changed files with 371 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
prisma/migrations/20250710203250_add_submission_models/migration.sql
+32
View File
@@ -0,0 +1,32 @@
-- CreateTable
CREATE TABLE "BugReport" (
"id" TEXT NOT NULL,
"name" TEXT,
"email" TEXT,
"bug" TEXT NOT NULL,
"date" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
CONSTRAINT "BugReport_pkey" PRIMARY KEY ("id")
);
-- CreateTable
CREATE TABLE "ImprovementIdea" (
"id" TEXT NOT NULL,
"name" TEXT,
"email" TEXT,
"idea" TEXT NOT NULL,
"date" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
CONSTRAINT "ImprovementIdea_pkey" PRIMARY KEY ("id")
);
-- CreateTable
CREATE TABLE "ContactMessage" (
"id" TEXT NOT NULL,
"name" TEXT,
"email" TEXT,
"message" TEXT NOT NULL,
"date" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
CONSTRAINT "ContactMessage_pkey" PRIMARY KEY ("id")
);
prisma/schema.prisma
+24
View File
@@ -49,6 +49,30 @@ model MileageEntry {
date DateTime @default(now())
}
model BugReport {
id String @id @default(cuid())
name String?
email String?
bug String
date DateTime @default(now())
}
model ImprovementIdea {
id String @id @default(cuid())
name String?
email String?
idea String
date DateTime @default(now())
}
model ContactMessage {
id String @id @default(cuid())
name String?
email String?
message String
date DateTime @default(now())
}
enum FuelType {
GASOLINE
DIESEL
src/app/about/page.tsx
+15
View File
@@ -0,0 +1,15 @@
export default function AboutPage() {
return (
<main className="max-w-2xl mx-auto p-8 space-y-8 bg-[var(--muted)] rounded-xl shadow">
<h1 className="text-3xl font-bold text-[var(--primary)] mb-4">About Car Fuel Tracker</h1>
<p className="text-lg text-[var(--foreground)]/80 mb-4">Car Fuel Tracker is a modern web app designed to help you track your car’s fuel fill-ups, EV charging, mileage, and costs. Whether you drive a gasoline, diesel, LPG, hybrid, or electric vehicle, our app makes it easy to log, analyze, and optimize your driving habits.</p>
<ul className="list-disc pl-6 text-[var(--foreground)]/80">
<li>Multi-car and hybrid support</li>
<li>Unit-aware UI for all fuel types</li>
<li>Interactive stats and charts</li>
<li>Private and secure data</li>
</ul>
<p className="mt-6 text-sm text-gray-500">Built with Next.js, Prisma, and Tailwind CSS.</p>
</main>
);
}
src/app/api/bugs/route.ts
+11
View File
@@ -0,0 +1,11 @@
import { NextResponse } from 'next/server';
import { prisma } from '@/lib/prisma';
export async function POST(req: Request) {
const { name, email, bug } = await req.json();
if (!bug) return NextResponse.json({ error: 'Bug description required' }, { status: 400 });
const report = await prisma.bugReport.create({
data: { name, email, bug },
});
return NextResponse.json({ success: true, id: report.id });
}
src/app/api/contact/route.ts
+11
View File
@@ -0,0 +1,11 @@
import { NextResponse } from 'next/server';
import { prisma } from '@/lib/prisma';
export async function POST(req: Request) {
const { name, email, message } = await req.json();
if (!message) return NextResponse.json({ error: 'Message required' }, { status: 400 });
const contact = await prisma.contactMessage.create({
data: { name, email, message },
});
return NextResponse.json({ success: true, id: contact.id });
}
src/app/api/improvment_ideas/route.ts
+11
View File
@@ -0,0 +1,11 @@
import { NextResponse } from 'next/server';
import { prisma } from '@/lib/prisma';
export async function POST(req: Request) {
const { name, email, idea } = await req.json();
if (!idea) return NextResponse.json({ error: 'Idea description required' }, { status: 400 });
const improvement = await prisma.improvementIdea.create({
data: { name, email, idea },
});
return NextResponse.json({ success: true, id: improvement.id });
}
src/app/bugs/page.tsx
+52
View File
@@ -0,0 +1,52 @@
"use client";
import { useState } from "react";
export default function BugReportPage() {
const [submitted, setSubmitted] = useState(false);
const [form, setForm] = useState({ name: "", email: "", bug: "" });
const [error, setError] = useState("");
function handleChange(e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) {
setForm({ ...form, [e.target.name]: e.target.value });
}
async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
setError("");
try {
const res = await fetch("/api/bugs", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(form),
});
if (!res.ok) {
const data = await res.json();
setError(data.error || "Submission failed.");
return;
}
setSubmitted(true);
setForm({ name: "", email: "", bug: "" });
} catch (err) {
setError("Submission failed. Please try again.");
}
}
return (
<main className="max-w-xl mx-auto p-8 space-y-8 bg-[var(--muted)] rounded-xl shadow">
<h1 className="text-3xl font-bold text-[var(--primary)] mb-4">Report a Bug</h1>
<p className="text-lg text-[var(--foreground)]/80 mb-4">Found a bug or issue? Please let us know so we can fix it quickly!</p>
{submitted ? (
<div className="bg-green-100 text-green-800 p-4 rounded-lg font-semibold text-center">Thank you for your bug report! We appreciate your help in improving Car Fuel Tracker.</div>
) : (
<form className="space-y-4" onSubmit={handleSubmit}>
<input type="text" name="name" value={form.name} onChange={handleChange} placeholder="Your Name (optional)" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<input type="email" name="email" value={form.email} onChange={handleChange} placeholder="Your Email (optional)" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<textarea name="bug" value={form.bug} onChange={handleChange} placeholder="Describe the bug or issue..." className="w-full border border-[var(--border)] px-4 py-2 rounded-lg min-h-[120px]" />
<button type="submit" className="bg-[var(--primary)] text-white px-6 py-2 rounded-lg font-semibold shadow hover:bg-red-700 transition">Submit Bug</button>
{error && <div className="text-red-600 text-sm mt-2">{error}</div>}
</form>
)}
<p className="mt-6 text-sm text-gray-500">Thank you for helping us improve Car Fuel Tracker!</p>
</main>
);
}
src/app/contact/page.tsx
+52
View File
@@ -0,0 +1,52 @@
"use client";
import { useState } from "react";
export default function ContactPage() {
const [submitted, setSubmitted] = useState(false);
const [form, setForm] = useState({ name: "", email: "", message: "" });
const [error, setError] = useState("");
function handleChange(e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) {
setForm({ ...form, [e.target.name]: e.target.value });
}
async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
setError("");
try {
const res = await fetch("/api/contact", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(form),
});
if (!res.ok) {
const data = await res.json();
setError(data.error || "Submission failed.");
return;
}
setSubmitted(true);
setForm({ name: "", email: "", message: "" });
} catch (err) {
setError("Submission failed. Please try again.");
}
}
return (
<main className="max-w-xl mx-auto p-8 space-y-8 bg-[var(--muted)] rounded-xl shadow">
<h1 className="text-3xl font-bold text-[var(--primary)] mb-4">Contact Us</h1>
<p className="text-lg text-[var(--foreground)]/80 mb-4">Have questions, feedback, or need support? Reach out to us below:</p>
{submitted ? (
<div className="bg-green-100 text-green-800 p-4 rounded-lg font-semibold text-center">Thank you for contacting us! We aim to respond within 2 business days.</div>
) : (
<form className="space-y-4" onSubmit={handleSubmit}>
<input type="text" name="name" value={form.name} onChange={handleChange} placeholder="Your Name" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<input type="email" name="email" value={form.email} onChange={handleChange} placeholder="Your Email" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<textarea name="message" value={form.message} onChange={handleChange} placeholder="Your Message" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg min-h-[120px]" />
<button type="submit" className="bg-[var(--primary)] text-white px-6 py-2 rounded-lg font-semibold shadow hover:bg-blue-700 transition">Send Message</button>
{error && <div className="text-red-600 text-sm mt-2">{error}</div>}
</form>
)}
<p className="mt-6 text-sm text-gray-500">We aim to respond within 2 business days.</p>
</main>
);
}
src/app/improvment_ideas/page.tsx
+52
View File
@@ -0,0 +1,52 @@
"use client";
import { useState } from "react";
export default function ImprovmentIdeasPage() {
const [submitted, setSubmitted] = useState(false);
const [form, setForm] = useState({ name: "", email: "", idea: "" });
const [error, setError] = useState("");
function handleChange(e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) {
setForm({ ...form, [e.target.name]: e.target.value });
}
async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
setError("");
try {
const res = await fetch("/api/improvment_ideas", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(form),
});
if (!res.ok) {
const data = await res.json();
setError(data.error || "Submission failed.");
return;
}
setSubmitted(true);
setForm({ name: "", email: "", idea: "" });
} catch (err) {
setError("Submission failed. Please try again.");
}
}
return (
<main className="max-w-xl mx-auto p-8 space-y-8 bg-[var(--muted)] rounded-xl shadow">
<h1 className="text-3xl font-bold text-[var(--primary)] mb-4">Improvement Ideas</h1>
<p className="text-lg text-[var(--foreground)]/80 mb-4">Have a suggestion or idea to make Car Fuel Tracker better? Share it with us!</p>
{submitted ? (
<div className="bg-green-100 text-green-800 p-4 rounded-lg font-semibold text-center">Thank you for your suggestion! We value your feedback and ideas.</div>
) : (
<form className="space-y-4" onSubmit={handleSubmit}>
<input type="text" name="name" value={form.name} onChange={handleChange} placeholder="Your Name (optional)" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<input type="email" name="email" value={form.email} onChange={handleChange} placeholder="Your Email (optional)" className="w-full border border-[var(--border)] px-4 py-2 rounded-lg" />
<textarea name="idea" value={form.idea} onChange={handleChange} placeholder="Describe your idea or suggestion..." className="w-full border border-[var(--border)] px-4 py-2 rounded-lg min-h-[120px]" />
<button type="submit" className="bg-[var(--primary)] text-white px-6 py-2 rounded-lg font-semibold shadow hover:bg-green-700 transition">Submit Idea</button>
{error && <div className="text-red-600 text-sm mt-2">{error}</div>}
</form>
)}
<p className="mt-6 text-sm text-gray-500">We value your feedback and ideas!</p>
</main>
);
}
src/app/page.tsx
+91 -58
View File
@@ -20,83 +20,104 @@ export default async function Home() {
priority
/>
<h1 className="text-5xl font-extrabold tracking-tight text-[var(--primary)] mb-2 text-center">
{isLoggedIn ? "Welcome Back!" : "Track Your Car’s Fuel & Mileage"}
{isLoggedIn ? "Welcome Back!" : "Track Your Car’s Fuel & Mileage Effortlessly"}
</h1>
<p className="text-lg text-gray-600 max-w-2xl text-center">
{isLoggedIn
? "Jump right into your dashboard to log fill-ups, view stats, and manage your cars."
: "Effortlessly log fill-ups, monitor fuel costs, and analyze your driving habits—all in one beautiful dashboard."}
: "Effortlessly log fill-ups, monitor fuel costs, and analyze your driving habits—all in one beautiful dashboard. Save money, track efficiency, and manage all your vehicles including hybrids and EVs."}
</p>
{!isLoggedIn && (
<div className="flex gap-4 mt-4">
<Link href="/auth/register" className="rounded-lg bg-[var(--primary)] text-white px-8 py-4 text-lg font-bold shadow hover:bg-blue-700 transition">Get Started</Link>
<Link href="/auth/login" className="rounded-lg border border-[var(--primary)] bg-[var(--muted)] text-[var(--primary)] px-8 py-4 text-lg font-bold hover:bg-[var(--primary)] hover:text-white transition">Login</Link>
</div>
<div className="flex gap-4 flex-wrap justify-center">
{isLoggedIn ? (
<Link
href="/dashboard"
className="rounded-lg bg-[var(--primary)] text-white px-8 py-4 text-lg font-bold shadow hover:bg-blue-700 transition"
>
Go to Dashboard
</Link>
) : (
<>
<Link
href="/auth/login"
className="rounded-lg bg-[var(--primary)] text-white px-8 py-4 text-lg font-bold shadow hover:bg-blue-700 transition"
>
Login
</Link>
<Link
href="/auth/register"
className="rounded-lg border border-[var(--primary)] bg-[var(--muted)] text-[var(--primary)] px-8 py-4 text-lg font-bold hover:bg-[var(--primary)] hover:text-white transition"
>
Register
</Link>
</>
)}
{isLoggedIn && (
<Link href="/dashboard" className="rounded-lg bg-[var(--primary)] text-white px-8 py-4 text-lg font-bold shadow hover:bg-blue-700 transition">Go to Dashboard</Link>
)}
</div>
</section>
{/* Features Section */}
<section className="w-full max-w-4xl mx-auto grid grid-cols-1 sm:grid-cols-3 gap-8 py-12 px-4">
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--primary)]">⛽</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">
Log Fill-Ups
</h2>
<p className="text-[var(--foreground)] opacity-80">
Quickly add fuel entries and keep your records organized.
</p>
{/* How It Works Section */}
<section className="w-full max-w-4xl mx-auto py-12 px-4">
<h2 className="text-3xl font-bold text-center text-[var(--primary)] mb-8">How It Works</h2>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-8">
<div className="flex flex-col items-center gap-2">
<span className="text-4xl">➕</span>
<h3 className="font-semibold text-lg">Add Your Car</h3>
<p className="text-center text-[var(--foreground)]/80">Register your vehicle, including hybrids and EVs.</p>
</div>
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--secondary)]">📊</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">
Analyze Stats
</h2>
<p className="text-[var(--foreground)] opacity-80">
Visualize your fuel consumption, costs, and mileage trends.
</p>
<div className="flex flex-col items-center gap-2">
<span className="text-4xl">⛽</span>
<h3 className="font-semibold text-lg">Log Fill-Ups & Mileage</h3>
<p className="text-center text-[var(--foreground)]/80">Record fuel, charging, and odometer readings in seconds.</p>
</div>
<div className="flex flex-col items-center gap-2">
<span className="text-4xl">📊</span>
<h3 className="font-semibold text-lg">View Stats & Insights</h3>
<p className="text-center text-[var(--foreground)]/80">Analyze consumption, costs, and trends to save money.</p>
</div>
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--accent)]">🚗</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">
Manage Cars
</h2>
<p className="text-[var(--foreground)] opacity-80">
Track multiple vehicles and switch between them easily.
</p>
</div>
</section>
{/* Testimonial Section */}
<section className="w-full max-w-2xl mx-auto py-8 px-4">
{/* Benefits Section */}
<section className="w-full max-w-4xl mx-auto py-12 px-4">
<h2 className="text-3xl font-bold text-center text-[var(--primary)] mb-8">Why Use Car Fuel Tracker?</h2>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-8">
<div className="flex flex-col gap-2">
<span className="font-bold text-[var(--primary)]">💸 Save Money</span>
<p className="text-[var(--foreground)]/80">Spot trends, optimize driving habits, and reduce fuel costs.</p>
</div>
<div className="flex flex-col gap-2">
<span className="font-bold text-[var(--primary)]">🚗 Multi-Car & Hybrid Support</span>
<p className="text-[var(--foreground)]/80">Track any number of vehicles, including hybrids and EVs.</p>
</div>
<div className="flex flex-col gap-2">
<span className="font-bold text-[var(--primary)]">📈 Export & Analyze</span>
<p className="text-[var(--foreground)]/80">Download your data for deeper analysis or tax purposes.</p>
</div>
<div className="flex flex-col gap-2">
<span className="font-bold text-[var(--primary)]">🔒 Private & Secure</span>
<p className="text-[var(--foreground)]/80">Your data is protected and only accessible to you.</p>
</div>
</div>
</section>
{/* Reviews Section */}
<section className="w-full max-w-3xl mx-auto py-12 px-4">
<h2 className="text-3xl font-bold text-center text-[var(--primary)] mb-8">What Users Say</h2>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-8">
<div className="bg-[var(--muted)] rounded-xl shadow p-6 flex flex-col items-center gap-3 border border-[var(--border)]">
<span className="text-3xl text-[var(--secondary)]">“</span>
<p className="text-center text-lg text-[var(--foreground)] font-medium">
This app made it so easy to track my car’s fuel expenses and spot
trends. Highly recommended for anyone who wants to save money and
understand their driving habits!
</p>
<p className="text-center text-lg text-[var(--foreground)] font-medium">This app made it so easy to track my car’s fuel expenses and spot trends. Highly recommended for anyone who wants to save money and understand their driving habits!</p>
<span className="text-sm text-gray-500">— Happy Driver</span>
</div>
<div className="bg-[var(--muted)] rounded-xl shadow p-6 flex flex-col items-center gap-3 border border-[var(--border)]">
<span className="text-3xl text-[var(--secondary)]">“</span>
<p className="text-center text-lg text-[var(--foreground)] font-medium">I love the hybrid support! Now I can track both my EV charging and gasoline fill-ups in one place.</p>
<span className="text-sm text-gray-500">— Hybrid Owner</span>
</div>
</div>
</section>
{/* Features Section (condensed) */}
<section className="w-full max-w-4xl mx-auto grid grid-cols-1 sm:grid-cols-3 gap-8 py-12 px-4">
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--primary)]">⛽</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">Log Fill-Ups</h2>
<p className="text-[var(--foreground)] opacity-80">Quickly add fuel entries and keep your records organized.</p>
</div>
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--secondary)]">📊</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">Analyze Stats</h2>
<p className="text-[var(--foreground)] opacity-80">Visualize your fuel consumption, costs, and mileage trends.</p>
</div>
<div className="flex flex-col items-center text-center gap-2 bg-[var(--muted)] rounded-xl shadow p-6 border border-[var(--border)]">
<span className="text-4xl text-[var(--accent)]">🚗</span>
<h2 className="font-semibold text-lg text-[var(--foreground)]">Manage Cars</h2>
<p className="text-[var(--foreground)] opacity-80">Track multiple vehicles and switch between them easily.</p>
</div>
</section>
{/* Footer */}
@@ -114,6 +135,18 @@ export default async function Home() {
>
Contact
</Link>
<Link
href="/bugs"
className="hover:text-[var(--primary)] transition"
>
Bug Report
</Link>
<Link
href="/improvment_ideas"
className="hover:text-[var(--primary)] transition"
>
Improvment Ideas
</Link>
<Link
href="/privacy"
className="hover:text-[var(--primary)] transition"
src/app/privacy/page.tsx
+14
View File
@@ -0,0 +1,14 @@
export default function PrivacyPolicyPage() {
return (
<main className="max-w-2xl mx-auto p-8 space-y-8 bg-[var(--muted)] rounded-xl shadow">
<h1 className="text-3xl font-bold text-[var(--primary)] mb-4">Privacy Policy</h1>
<p className="text-lg text-[var(--foreground)]/80 mb-4">Your privacy is important to us. Car Fuel Tracker is committed to protecting your personal data and ensuring your information is secure.</p>
<ul className="list-disc pl-6 text-[var(--foreground)]/80">
<li>We do not share your data with third parties.</li>
<li>Your information is encrypted and stored securely.</li>
<li>You can request deletion of your account and data at any time.</li>
</ul>
<p className="mt-6 text-sm text-gray-500">For questions about privacy, contact us via the Contact page.</p>
</main>
);
}