MeexReay/racinfo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(protocol): wrap articles into array

Browse Source
This commit is contained in:
Konstantin Zhigaylo 2025-07-21 09:17:11 +03:00
parent 0905e11185
commit 70deede914
No known key found for this signature in database
GPG Key ID: DD1C2780F0E05B5C
1 changed files with 45 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
src/app/protocol/page.tsx
View File

@ -3,7 +3,35 @@ import Text from "@/components/blocks/Text";
import PageTitle from "@/components/blocks/PageTitle";
import Title from "@/components/blocks/Title";
type Article = {
name: string;
desc: string;
curator: string;
href: string;
};
export default function Protocol() {
const articles: Article[] = [
{
name: "Real Address Chat Protocol",
desc: "This article explains the Real Address Chat protocol and how the client and server interact with each other using it.",
curator: "@kostya-zero",
href: "/protocol/rac",
},
{
name: "WebSocket Real Address Chat Protocol",
desc: "A WebSocket-based implementation of the RAC protocol, made by the community. It works the same as RAC but includes some additions.",
curator: "@kostya-zero",
href: "/protocol/wrac",
},
{
name: "User Agents",
desc: "A community-made solution to identify clients by a unique symbol in front of their username.",
curator: "@kostya-zero",
href: "/protocol/user-agents",
},
];
return (
<main className={"flex flex-col gap-4 w-full"}>
<PageTitle id={"protocol"}>Protocol</PageTitle>
@ -21,52 +49,23 @@ export default function Protocol() {
<Title id={"articles"}>Articles</Title>
<Text>Click on article down below that you want to read.</Text>
<div className={"flex flex-col gap-2"}>
<Link
href={"/protocol/rac"}
className={
"flex flex-col bg-stone-900 border border-stone-800 p-4 transition-all duration-200 hover:border-neutral-600 hover:bg-stone-800 rounded-lg"
}
>
<h1 className={"text-stone-300 font-rokkitt text-2xl font-bold"}>
Real Address Chat Protocol
</h1>
<p className={"text-stone-500"}>
This article explains the Real Address Chat protocol and how the
client and server interact with each other using it.
</p>
<small className={"text-stone-600"}>Curated by @kostya-zero</small>
</Link>
<Link
href={"/protocol/wrac"}
className={
"flex flex-col bg-stone-900 border border-stone-800 p-4 transition-all duration-200 hover:border-neutral-600 hover:bg-stone-800 rounded-lg"
}
>
<h1 className={"text-stone-300 font-rokkitt text-2xl font-bold"}>
WebSocket Real Address Chat Protocol
</h1>
<p className={"text-stone-500"}>
WRAC is a WebSocket-based implementation of the RAC protocol, made
by the community. It works the same as RAC but includes some
additions.
</p>
<small className={"text-stone-600"}>Curated by @kostya-zero</small>
</Link>
<Link
href={"/protocol/user-agents"}
className={
"flex flex-col bg-stone-900 border border-stone-800 p-4 transition-all duration-200 hover:border-neutral-600 hover:bg-stone-800 rounded-lg"
}
>
<h1 className={"text-stone-300 font-rokkitt text-2xl font-bold"}>
User Agents
</h1>
<p className={"text-stone-500"}>
A community-made solution to identify clients by a unique symbol in
front of their username.
</p>
<small className={"text-stone-600"}>Curated by @kostya-zero</small>
</Link>
{articles.map((article, index) => (
<Link
key={index}
href={article.href}
className={
"flex flex-col bg-stone-900 border border-stone-800 p-4 transition-all duration-200 hover:border-neutral-600 hover:bg-stone-800 rounded-lg"
}
>
<h1 className={"text-stone-300 font-rokkitt text-2xl font-bold"}>
{article.name}
</h1>
<p className={"text-stone-500"}>{article.desc}</p>
<small className={"text-stone-600"}>
Curated by {article.curator}
</small>
</Link>
))}
</div>
</main>
);