geneza gractwa & api persons of note preparation

pages/o-gractwie.tsx

@@ -8,14 +8,15 @@ import links from "../data/links.json";
 import { useEffect, useState } from "react";
 
 const PageInfo = () => {
-	const [adminList, setAdminList] = useState([]);
+	const [personsList, setPersonsList] = useState([]);
 	type apiResType = {
 		Id: string;
 		Name: string;
-		Desc: string;
-		Img: string;
-		DevBadge: string;
-		AssignedUser: string;
+		Desc?: string;
+		Img?: string;
+		IsAdmin?: boolean;
+		DevBadge?: boolean;
+		AssignedUser?: string;
 	};
 	useEffect(() => {
 		fetch("https://gractwo.pl/api/v1/admincards")
@@ -23,7 +24,7 @@ const PageInfo = () => {
 				return res.json();
 			})
 			.then((data) => {
-				setAdminList(data);
+				setPersonsList(data);
 			})
 			.catch((err) => {
 				console.log(err);
@@ -66,35 +67,86 @@ const PageInfo = () => {
 					</Link>
 				</div>
 			</main>
+			<main id="geneza-gractwa">
+				<h2>geneza gractwa</h2>
+				<p style={{ textAlign: "justify" }}>
+					Gractwo zostało założone w 2020 roku w odpowiedzi na{" "}
+					<Link href="/pgtf-theme">rozłam / przewrót władzy w PGTF</Link>
+					{". "}Serwer discordowy PGTF, pozostający nadal pod kontrolą naszej
+					administracji został przeniesiony w stan przejściowy do czasu podjęcia
+					decyzji o powstaniu Gractwa. W pierwszych dniach została utworzona
+					grupa facebookowa i strona internetowa. Aktywność na grupie
+					facebookowej nigdy nie rozwinęła się wystarczająco by przekształcić
+					się w pełnoprawną społeczność, ale serwer discord cały czas
+					funkcjonuje jako nasze małe, ciasne ale własne miejsce spotkań.
+				</p>
+			</main>
 			<main id="sklad-administracji">
 				<h2>skład administracji</h2>
 				<div className={styles.persons}>
-					{adminList.map((el: apiResType) => {
-						return (
-							<Link
-								key={el.Id}
-								href={`/profil/${el.Name.replaceAll(
-									" ",
-									"-"
-								).toLocaleLowerCase()}`}
-							>
-								<article>
-									<img src={el.Img} alt={`zdjęcie profilowe ${el.Name}`} />
-									<div>
-										<h3>{el.Name}</h3>
-										<p>{el.Desc || "brak opisu."}</p>
-										{el.DevBadge ? (
-											<span className={styles.devBadge}>DEV</span>
-										) : (
-											""
-										)}
-									</div>
-								</article>
-							</Link>
-						);
-					})}
+					{personsList
+						.filter((el: apiResType) => {
+							return !el.IsAdmin;
+						})
+						.map((el: apiResType) => {
+							return (
+								<Link
+									key={el.Id}
+									href={`/profil/${el.Name.replaceAll(
+										" ",
+										"-"
+									).toLocaleLowerCase()}`}
+								>
+									<article>
+										<img src={el.Img} alt={`zdjęcie profilowe ${el.Name}`} />
+										<div>
+											<h3>{el.Name}</h3>
+											<p>{el.Desc || "brak opisu."}</p>
+											{el.DevBadge ? (
+												<span className={styles.devBadge}>DEV</span>
+											) : (
+												""
+											)}
+										</div>
+									</article>
+								</Link>
+							);
+						})}
 				</div>
 			</main>
+			{/* <main id="osoby-godne-uwagi">
+				<h2>osoby godne uwagi</h2>
+				<div className={styles.persons}>
+					{personsList
+						.filter((el: apiResType) => {
+							return !el.IsAdmin;
+						})
+						.map((el: apiResType) => {
+							return (
+								<Link
+									key={el.Id}
+									href={`/profil/${el.Name.replaceAll(
+										" ",
+										"-"
+									).toLocaleLowerCase()}`}
+								>
+									<article>
+										<img src={el.Img} alt={`zdjęcia profilowe ${el.Name}`} />
+										<div>
+											<h3>{el.Name}</h3>
+											<p>{el.Desc || "brak opisu."}</p>
+											{el.DevBadge ? (
+												<span className={styles.devBadge}>DEV</span>
+											) : (
+												""
+											)}
+										</div>
+									</article>
+								</Link>
+							);
+						})}
+				</div>
+			</main> */}
 			<main id="linki">
 				<h2>linki i przekierowania</h2>
 				<div className="chips">