Skip to content

Dev #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
gabrielmatsan merged 2 commits into from
Jun 1, 2025
Merged

Dev #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a268217
:lipstick: Adicionadas páginas PostLoginLanding e Dashboard
joaomiguel-sb May 28, 2025
a8d9a81
Merge pull request #1 from amazon-hacking/feat/new-pages
gabrielmatsan May 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 11 additions & 13 deletions apps/website/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,21 @@ import { Routes, Route } from "react-router-dom";
import Login from "./Login";
import Register from "./Register";
import Home from "./Home";
import LandingPage from "./LandingPage";
import LandingPage from "./LandingPage";
import PostLoginLanding from "./PostLoginLanding";
import Dashboard from "./Dashboard";

export default function App(): JSX.Element {
return (
<div > {/* Container do Bootstrap para centralizar */}

{/*<nav className="nav justify-content-center mb-4 navbar-climate">
<Link to="/login" className="nav-link">Login</Link>
<Link to="/register" className="nav-link">Registrar</Link>
<Link to="/home" className="nav-link">Dados</Link> {/* Adicione um link para a Home *
</nav>*/}
<div>
<Routes>
<Route path="/" element={<LandingPage />} />
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
<Route path="/home" element={<Home />} />
<Route path="*" element={<p className="text-danger p-4">Página não encontrada</p>} />
<Route path="/" element={<LandingPage />} />
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
<Route path="/home" element={<Home />} />
<Route path="/welcome" element={<PostLoginLanding />} />
<Route path="/dashboard" element={<Dashboard />} />
<Route path="*" element={<p className="text-danger p-4">Página não encontrada</p>} />
</Routes>
</div>
);
Expand Down
145 changes: 145 additions & 0 deletions apps/website/src/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,145 @@
import React from "react";
import { useNavigate } from "react-router-dom";
import logoWeatherSync from "./assets/logo-weather-sync.png";

export default function Dashboard(): JSX.Element {
const navigate = useNavigate();

const handleLogout = () => {
localStorage.removeItem("token");
localStorage.removeItem("userName");
navigate("/login");
};

return (
<div className="min-vh-100" style={{ backgroundColor: '#e6f7ff' }}>
{/* Header Section */}
<div className="container-fluid text-white py-5" style={{ backgroundColor: '#1890ff' }}>
<div className="container">
<div className="row justify-content-center text-center">
<div className="col-lg-8">
<div className="mb-4">
<img
src={logoWeatherSync}
alt="Weather Sync Logo"
className="img-fluid mb-3"
style={{ maxHeight: '100px', width: 'auto' }}
/>
</div>
<h1 className="display-4 fw-bold mb-4 text-white">Dashboard Meteorológico</h1>
<p className="lead fs-5 mb-0">
Visualize dados e estatísticas do clima das suas regiões favoritas
</p>
</div>
</div>
</div>
</div>

{/* Coming Soon Section */}
<div className="container py-5">
<div className="row justify-content-center">
<div className="col-lg-8">
<div className="card border-0 shadow-lg">
<div className="card-body text-center p-5">
<div className="mb-4">
<span className="display-1">🚧</span>
</div>
<h3 className="fw-bold mb-3" style={{ color: '#1890ff' }}>
Dashboard em Desenvolvimento
</h3>
<p className="text-muted fs-5 mb-4">
Estamos trabalhando para trazer recursos incríveis para você acompanhar
o clima de forma ainda mais detalhada e intuitiva.
</p>

<div className="row g-3 mb-4">
<div className="col-md-4">
<div className="card border-0" style={{ backgroundColor: '#f8f9fa' }}>
<div className="card-body p-3">
<h6 className="fw-semibold" style={{ color: '#1890ff' }}>
📊 Gráficos Interativos
</h6>
<small className="text-muted">
Visualize tendências climáticas
</small>
</div>
</div>
</div>

<div className="col-md-4">
<div className="card border-0" style={{ backgroundColor: '#f8f9fa' }}>
<div className="card-body p-3">
<h6 className="fw-semibold" style={{ color: '#1890ff' }}>
🌡️ Análises Detalhadas
</h6>
<small className="text-muted">
Dados meteorológicos completos
</small>
</div>
</div>
</div>

<div className="col-md-4">
<div className="card border-0" style={{ backgroundColor: '#f8f9fa' }}>
<div className="card-body p-3">
<h6 className="fw-semibold" style={{ color: '#1890ff' }}>
📈 Previsões Avançadas
</h6>
<small className="text-muted">
Alertas personalizados
</small>
</div>
</div>
</div>
</div>

<div className="d-flex flex-column flex-sm-row justify-content-center gap-3">
<button
className="btn btn-lg fw-semibold"
style={{ backgroundColor: '#1890ff', borderColor: '#1890ff', color: 'white' }}
onClick={() => navigate("/welcome")}
>
🏠 Voltar ao Início
</button>

<button
className="btn btn-outline-secondary btn-lg fw-semibold"
style={{ borderColor: '#1890ff', color: '#1890ff' }}
onClick={() => navigate("/home")}
>
⚙️ Configurar Bairros
</button>

<button
className="btn btn-outline-danger btn-lg fw-semibold"
onClick={handleLogout}
>
🚪 Sair da Conta
</button>
</div>
</div>
</div>
</div>
</div>
</div>

{/* Footer */}
<footer className="py-4" style={{ backgroundColor: '#262626', color: '#fff' }}>
<div className="container">
<div className="row align-items-center">
<div className="col-md-6">
<p className="mb-0">
<strong>Weather Sync</strong> - Seu companheiro meteorológico
</p>
</div>
<div className="col-md-6 text-md-end">
<small className="text-muted">
© 2025 Weather Sync. Todos os direitos reservados.
</small>
</div>
</div>
</div>
</footer>
</div>
);
}
9 changes: 9 additions & 0 deletions apps/website/src/Home.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -277,6 +277,15 @@ export default function Home(): JSX.Element {
</div>
</div>
</div>
<div className="d-flex justify-content-end mb-3">
<button
className="btn btn-sm btn-outline-primary"
onClick={() => navigate("/welcome")}
>
⬅️ Voltar para início
</button>
</div>


{/* Footer */}
<footer className="py-4" style={{ backgroundColor: '#262626', color: '#fff' }}>
Expand Down
2 changes: 1 addition & 1 deletion apps/website/src/LandingPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ export default function LandingPage(): JSX.Element {
<div className="mb-3">
<span className="fs-1">📊</span>
</div>
<h5 className="card-title fw-semibold">Previsões Precisas</h5>
<h5 className="card-title fw-semibold">Dados Precisos</h5>
<p className="card-text text-muted small">
Interface simples com dados meteorológicos atualizados
</p>
Expand Down
27 changes: 14 additions & 13 deletions apps/website/src/Login.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,21 @@ export default function Login(): JSX.Element {
const navigate = useNavigate();

const handleLogin = async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
setLoading(true);
setErro("");
e.preventDefault();
setLoading(true);
setErro("");

try {
const res = await api.post("/v1/auth/login", { email, password });
localStorage.setItem("token", res.data.token);
navigate("/welcome"); // ✅ redireciona para a nova landing page
} catch (err: any) {
setErro(err.response?.data?.message || "Erro ao fazer login.");
} finally {
setLoading(false);
}
};

try {
const res = await api.post("/v1/auth/login", { email, password });
localStorage.setItem("token", res.data.token);
navigate("/home");
} catch (err: any) {
setErro(err.response?.data?.message || "Erro ao fazer login.");
} finally {
setLoading(false);
}
};

return (
<div className="min-vh-100" style={{ backgroundColor: '#e6f7ff' }}>
Expand Down
Loading
Loading