Skip to content

Commit 5fcc0af

Browse files
committed
refactor: move the head information to a component
1 parent 5de11c7 commit 5fcc0af

File tree

3 files changed

+65
-54
lines changed

3 files changed

+65
-54
lines changed

src/app.rs

+8-54
Original file line numberDiff line numberDiff line change
@@ -1,71 +1,25 @@
1-
use leptos::{component, use_context, view, IntoView, SignalGet};
2-
use leptos_meta::{provide_meta_context, Body, Html, Link, Meta, Stylesheet, Title};
3-
use leptos_router::{
4-
use_location, Router, RouterIntegrationContext, Routes, StaticParamsMap, StaticRoute,
5-
};
1+
use leptos::{component, view, IntoView};
2+
use leptos_meta::{provide_meta_context, Body};
3+
use leptos_router::{Router, Routes, StaticParamsMap, StaticRoute};
64

75
use crate::{
8-
components::{Footer, Header},
6+
components::{Footer, HeadInformation, Header},
97
pages::{Aprende, Communidad, Contributors, Index},
108
};
119

1210
#[component]
1311
pub fn App() -> impl IntoView {
1412
// Provides context that manages stylesheets, titles, meta tags, etc.
1513
provide_meta_context();
16-
let (assets_folder, bg_in_dark_mode) = if cfg!(debug_assertions) {
17-
("./assets", "dark:bg-kaku-dev")
18-
} else {
19-
(".", "dark:bg-kaku")
20-
};
21-
22-
let preview = if use_context::<RouterIntegrationContext>()
23-
.is_some_and(|ctx| ctx.0.location().get().value.contains("/aprende"))
24-
{
25-
"aprende_preview.webp"
14+
let bg_in_dark_mode = if cfg!(debug_assertions) {
15+
"dark:bg-kaku-dev"
2616
} else {
27-
"rustlanges_preview.webp"
17+
"dark:bg-kaku"
2818
};
2919

3020
view! {
3121
<Router>
32-
<Html lang="es"/>
33-
<Meta charset="utf-8"/>
34-
<Meta name="viewport" content="width=device-width, initial-scale=1"/>
35-
<Stylesheet id="fonts" href=format!("{}/fonts.css", assets_folder)/>
36-
<Stylesheet id="leptos" href="/pkg/leptos_start.css"/>
37-
<Title text="Rust Lang en Español"/>
38-
<Meta
39-
name="description"
40-
content="Únete a nuestra comunidad de Rust en español. Promovemos el aprendizaje y la difusión de Rust, compartiendo conocimientos y proyectos emocionantes."
41-
/>
42-
43-
<Meta name="og:site_name" content="Rust Lang en Español"/>
44-
<Meta name="og:title" content="Bienvenidos a Rust Lang en Español"/>
45-
<Meta
46-
name="og:description"
47-
content="Únete a nuestra comunidad de Rust en español. Promovemos el aprendizaje y la difusión de Rust, compartiendo conocimientos y proyectos emocionantes."
48-
/>
49-
<Meta name="og:url" content="https://rustlang-es.org"/>
50-
<Meta name="og:image" content=format!("https://rustlang-es.org/{preview}")/>
51-
<Meta name="twitter:image" content=format!("https://rustlang-es.org/{preview}")/>
52-
<Meta name="twitter:card" content="summary_large_image"/>
53-
<Meta name="twitter:site" content="@rustlang"/>
54-
<Meta
55-
name="google-site-verification"
56-
content="OntIe2SKuQalaapGvxdded9tU4G2p57h0A6e0Rkoni0"
57-
/>
58-
59-
{
60-
let location = use_location().pathname;
61-
view! {
62-
<Link
63-
rel="canonical"
64-
href=format!("https://www.rustlang-es.org{}", location.get().as_str())
65-
/>
66-
}
67-
}
68-
22+
<HeadInformation/>
6923
<Body class=format!(
7024
"bg-orange-200 dark:bg-[#131313]/90 bg-center bg-fixed {} dark:bri dark:bg-cover dark:bg-blend-darken dark:backdrop-blur-xl overflow-x-hidden dark:text-[#e2cea9]",
7125
bg_in_dark_mode,

src/components/head_information.rs

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
use leptos::{component, view, IntoView, SignalGet};
2+
use leptos_meta::{Html, Link, Meta, Stylesheet, Title};
3+
use leptos_router::use_location;
4+
5+
#[component]
6+
pub fn HeadInformation() -> impl IntoView {
7+
let assets_folder = if cfg!(debug_assertions) {
8+
"./assets"
9+
} else {
10+
"."
11+
};
12+
13+
let location = use_location().pathname.get();
14+
let path = location.as_str();
15+
16+
let preview = if path == "aprende" {
17+
"aprende_preview.webp"
18+
} else {
19+
"rustlanges_preview.webp"
20+
};
21+
22+
view! {
23+
<>
24+
<Html lang="es"/>
25+
<Meta charset="utf-8"/>
26+
<Meta name="viewport" content="width=device-width, initial-scale=1"/>
27+
<Stylesheet id="fonts" href=format!("{}/fonts.css", assets_folder)/>
28+
<Stylesheet id="leptos" href="/pkg/leptos_start.css"/>
29+
<Title text="Rust Lang en Español"/>
30+
<Meta
31+
name="description"
32+
content="Únete a nuestra comunidad de Rust en español. Promovemos el aprendizaje y la difusión de Rust, compartiendo conocimientos y proyectos emocionantes."
33+
/>
34+
35+
<Meta name="og:site_name" content="Rust Lang en Español"/>
36+
<Meta name="og:title" content="Bienvenidos a Rust Lang en Español"/>
37+
<Meta
38+
name="og:description"
39+
content="Únete a nuestra comunidad de Rust en español. Promovemos el aprendizaje y la difusión de Rust, compartiendo conocimientos y proyectos emocionantes."
40+
/>
41+
<Meta name="og:url" content="https://rustlang-es.org"/>
42+
43+
<Meta name="twitter:card" content="summary_large_image"/>
44+
<Meta name="twitter:site" content="@rustlang"/>
45+
<Meta
46+
name="google-site-verification"
47+
content="OntIe2SKuQalaapGvxdded9tU4G2p57h0A6e0Rkoni0"
48+
/>
49+
50+
<Meta name="og:image" content=format!("https://rustlang-es.org/{preview}")/>
51+
<Meta name="twitter:image" content=format!("https://rustlang-es.org/{preview}")/>
52+
<Link rel="canonical" href=format!("https://www.rustlang-es.org{}", path)/>
53+
</>
54+
}
55+
}

src/components/mod.rs

+2
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ mod button_link;
33
mod cards;
44
mod community_projects;
55
mod footer;
6+
mod head_information;
67
mod header;
78
mod hero;
89
mod icons;
@@ -15,6 +16,7 @@ pub use button_link::ButtonLink;
1516
pub use cards::{CardTitle, CommunityCard, ContributorCard, ProjectCard};
1617
pub use community_projects::CommunityProjects;
1718
pub use footer::Footer;
19+
pub use head_information::HeadInformation;
1820
pub use header::Header;
1921
pub use hero::Hero;
2022
pub use icons::{

0 commit comments

Comments
 (0)