Skip to content

Commit 0fadd93

Browse files
worldwidepixelworldwidepixel
committed
feat: SEO
1 parent 03acee4 commit 0fadd93

File tree

5 files changed

+115
-94
lines changed

5 files changed

+115
-94
lines changed

‎routes/[event].tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,11 @@ export default async function Event(_req: Request, ctx: RouteContext) {
3535
return (
3636
<>
3737
<Head>
38-
<meta property="og:title" content={event.name} key="ogtitle" />
38+
<title>{event.name} - ModFest</title>
39+
<meta property="og:title" content={`${event.name} - ModFest`} />
3940
<meta property="og:description" content={event.subtitle} />
41+
<meta property="og:image" content={event.images.background} />
42+
<meta name="twitter:card" content="summary_large_image" />
4043
</Head>
4144
<div
4245
class="flex flex-col gap-4 mb-16"

‎routes/_app.tsx‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,16 @@ export default function App({ Component }: PageProps) {
1313

1414
<Head>
1515
<meta property="og:title" content="Welcome to ModFest!" key="ogtitle" />
16-
<meta property="og:type" content="website" key="ogtype"/>
16+
<meta property="og:type" content="website" key="ogtype" />
1717
<meta property="og:image" content="/assets/favicon.png" key="ogimage" />
1818
<meta property="og:image:type" content="image/png" key="ogimagetype" />
19-
<meta property="og:description" content="ModFest hosts collaborative Minecraft modding virtual events, including development jams and in-game conventions!" key="ogdesc"/>
19+
<meta
20+
property="og:description"
21+
content="ModFest hosts collaborative Minecraft modding virtual events, including development jams and in-game conventions!"
22+
key="ogdesc"
23+
/>
2024
<meta property="og:site_name" content="ModFest" />
25+
<meta property="og:url" content="https://modfest.net" />
2126
</Head>
2227

2328
<body>

‎routes/dev/index.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import { RouteContext } from "$fresh/server.ts";
21
import { DevtoolsButton } from "../../islands/CopyButton.tsx";
32
import { getDevtools } from "../../lib/helpers.tsx";
43

5-
export default async function DeveloperTools(_req: Request, ctx: RouteContext) {
4+
export default function DeveloperTools(_req: Request) {
65
const devtoolsEnabled = getDevtools(_req);
76

87
return (

‎routes/index.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import { Event } from "../lib/types.d.tsx";
66
export default async function Index(req: Request, ctx: RouteContext) {
77
const allEvents = await fetchEvents(fetch);
88
// ISO-8086 dates can be compared lexicographically
9-
const events = allEvents.filter(e => e.phase != "planning").sort((a: Event, b: Event) => getDate(a) > getDate(b) ? 1 : -1)
9+
const events = allEvents.filter((e) => e.phase != "planning").sort((
10+
a: Event,
11+
b: Event,
12+
) => getDate(a) > getDate(b) ? 1 : -1)
1013
.reverse();
1114
return (
1215
<div class="flex flex-col gap-4 mb-16">

‎routes/user/[user].tsx‎

Lines changed: 99 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
Submission as SubmissionComponent,
1212
} from "../../components/Submission.tsx";
1313
import CopyButton from "../../islands/CopyButton.tsx";
14+
import { Head } from "$fresh/runtime.ts";
1415

1516
export default async function User(_req: Request, ctx: RouteContext) {
1617
let user = await fetchUser(fetch, ctx.params.user);
@@ -27,96 +28,106 @@ export default async function User(_req: Request, ctx: RouteContext) {
2728
const devtoolsEnabled = getDevtools(_req);
2829

2930
return (
30-
<div class="flex flex-col gap-4 mb-16">
31-
{user && (
32-
<div class="card flex flex-row gap-4">
33-
<div>
34-
<img
35-
alt={`Icon for user ${user.name}`}
36-
class="h-20 bg-mf-unknown w-20 rounded-full min-w-20 object-cover"
37-
src={user.icon}
38-
/>
39-
</div>
40-
<div class="flex-grow flex-col flex self-center">
41-
<span class="flex flex-row items-end gap-2">
42-
<h1 class="m-0">{user.name}</h1>
43-
{user.pronouns && <p class="m-0 text-sm">({user.pronouns})</p>}
44-
</span>
45-
{user.bio && <span>{user.bio}</span>}
46-
{submissions
47-
? (
48-
<span>
49-
{user.name} has submitted{" "}
50-
{formatPlural("project", submissions.length)}{" "}
51-
to ModFest events.
52-
</span>
53-
)
54-
: (
55-
<span>
56-
{user.name} has not participated in a ModFest event yet.
57-
</span>
58-
)}
59-
{devtoolsEnabled && (
60-
<>
61-
<hr class="mt-2" />
62-
<div class="flex flex-row gap-2 items-center flex-wrap">
63-
<CopyButton content={user.id}>Copy ModFest ID</CopyButton>
64-
<CopyButton content={user.discord_id}>
65-
Copy Discord ID
66-
</CopyButton>
67-
<CopyButton content={`<@${user.discord_id}>`}>
68-
Copy Ping
69-
</CopyButton>
70-
{user.modrinth_id && (
71-
<CopyButton content={user.modrinth_id}>
72-
Copy Modrinth ID
31+
<>
32+
<Head>
33+
<title>{user.name}'s Profile' - ModFest</title>
34+
<meta
35+
property="og:title"
36+
content={`${user.name}'s Profile - ModFest`}
37+
/>
38+
<meta property="og:description" content={user.bio} />
39+
</Head>
40+
<div class="flex flex-col gap-4 mb-16">
41+
{user && (
42+
<div class="card flex flex-row gap-4">
43+
<div>
44+
<img
45+
alt={`Icon for user ${user.name}`}
46+
class="h-20 bg-mf-unknown w-20 rounded-full min-w-20 object-cover"
47+
src={user.icon}
48+
/>
49+
</div>
50+
<div class="flex-grow flex-col flex self-center">
51+
<span class="flex flex-row items-end gap-2">
52+
<h1 class="m-0">{user.name}</h1>
53+
{user.pronouns && <p class="m-0 text-sm">({user.pronouns})</p>}
54+
</span>
55+
{user.bio && <span>{user.bio}</span>}
56+
{submissions
57+
? (
58+
<span>
59+
{user.name} has submitted{" "}
60+
{formatPlural("project", submissions.length)}{" "}
61+
to ModFest events.
62+
</span>
63+
)
64+
: (
65+
<span>
66+
{user.name} has not participated in a ModFest event yet.
67+
</span>
68+
)}
69+
{devtoolsEnabled && (
70+
<>
71+
<hr class="mt-2" />
72+
<div class="flex flex-row gap-2 items-center flex-wrap">
73+
<CopyButton content={user.id}>Copy ModFest ID</CopyButton>
74+
<CopyButton content={user.discord_id}>
75+
Copy Discord ID
7376
</CopyButton>
74-
)}
75-
</div>
76-
</>
77-
)}
78-
</div>
79-
</div>
80-
)}
81-
{user && submissions && (
82-
<>
83-
<div class="flex flex-col items-center gap-4">
84-
<h1 class="">Event Submissions</h1>
85-
{events.sort((a: Event, b: Event) =>
86-
getDate(a) > getDate(b) ? 1 : -1
87-
).reverse()
88-
.filter((event: Event) => {
89-
return submissions.filter((submission: Submission) =>
90-
submission.event === event.id
91-
).length > 0;
92-
}).map((event: Event, eventIndex) => (
93-
<div
94-
class="card flex flex-col gap-2 w-full"
95-
style={`--event-${
96-
event.id.replace(".", "-")
97-
}-coloured: #${event.colors.secondary}`}
98-
key={eventIndex}
99-
>
100-
<h2>{event.name}</h2>
101-
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
102-
{submissions.filter((submission: Submission) => {
103-
return submission.event === event.id;
104-
}).sort((a: Submission, b: Submission) =>
105-
a.name.localeCompare(b.name)
106-
).map((submission: Submission, submissionIndex) => (
107-
<SubmissionComponent
108-
className="!bg-mf-bg"
109-
submission={submission}
110-
key={submissionIndex}
111-
devtools={devtoolsEnabled}
112-
/>
113-
))}
77+
<CopyButton content={`<@${user.discord_id}>`}>
78+
Copy Ping
79+
</CopyButton>
80+
{user.modrinth_id && (
81+
<CopyButton content={user.modrinth_id}>
82+
Copy Modrinth ID
83+
</CopyButton>
84+
)}
11485
</div>
115-
</div>
116-
))}
86+
</>
87+
)}
88+
</div>
11789
</div>
118-
</>
119-
)}
120-
</div>
90+
)}
91+
{user && submissions && (
92+
<>
93+
<div class="flex flex-col items-center gap-4">
94+
<h1 class="">Event Submissions</h1>
95+
{events.sort((a: Event, b: Event) =>
96+
getDate(a) > getDate(b) ? 1 : -1
97+
).reverse()
98+
.filter((event: Event) => {
99+
return submissions.filter((submission: Submission) =>
100+
submission.event === event.id
101+
).length > 0;
102+
}).map((event: Event, eventIndex) => (
103+
<div
104+
class="card flex flex-col gap-2 w-full"
105+
style={`--event-${
106+
event.id.replace(".", "-")
107+
}-coloured: #${event.colors.secondary}`}
108+
key={eventIndex}
109+
>
110+
<h2>{event.name}</h2>
111+
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
112+
{submissions.filter((submission: Submission) => {
113+
return submission.event === event.id;
114+
}).sort((a: Submission, b: Submission) =>
115+
a.name.localeCompare(b.name)
116+
).map((submission: Submission, submissionIndex) => (
117+
<SubmissionComponent
118+
className="!bg-mf-bg"
119+
submission={submission}
120+
key={submissionIndex}
121+
devtools={devtoolsEnabled}
122+
/>
123+
))}
124+
</div>
125+
</div>
126+
))}
127+
</div>
128+
</>
129+
)}
130+
</div>
131+
</>
121132
);
122133
}

0 commit comments

Comments
 (0)