profilecard on profilepages, settings page init & more
This commit is contained in:
77
pages/ja.tsx
77
pages/ja.tsx
@@ -1,77 +0,0 @@
|
||||
import { useUser } from "@auth0/nextjs-auth0/client";
|
||||
import { ProfileCard } from "../components/ProfileCard/ProfileCard";
|
||||
|
||||
const PageMe = () => {
|
||||
const { user, error, isLoading } = useUser();
|
||||
|
||||
return (
|
||||
<>
|
||||
{isLoading && (
|
||||
<main>
|
||||
<h3>Ładujemy dane dla Ciebie...</h3>
|
||||
<p>Sit tight.</p>
|
||||
</main>
|
||||
)}
|
||||
{error && (
|
||||
<main>
|
||||
<h3>Wystąpił błąd.</h3>
|
||||
<p>Tyle wiemy:</p>
|
||||
<p>{error.name}</p>
|
||||
<p>{error.message}</p>
|
||||
</main>
|
||||
)}
|
||||
{!isLoading && !error && user && (
|
||||
<main>
|
||||
<ProfileCard
|
||||
username={user.name || "unknown user"}
|
||||
picture={user.picture}
|
||||
description={"To Ty! Niezaprzeczalnie. ヽ(*・ω・)ﾉ"}
|
||||
experience={{ level: 69, looseXP: 420, tilNextLevel: 270 }}
|
||||
badges={[
|
||||
{
|
||||
badgeName: "Odkrywca internetowy",
|
||||
badgeDesc: "Zalogowałeś się na stronę internetową gractwa.",
|
||||
},
|
||||
{
|
||||
badgeName: "Technik Informatyk",
|
||||
badgeDesc: "Łapanki na korytarzu to normalka.",
|
||||
},
|
||||
{
|
||||
badgeName: "Rozpad PGTF",
|
||||
badgeDesc: "Służba w oddziałach Super Pizzy - powód do dumy.",
|
||||
},
|
||||
{
|
||||
badgeName: "Mollin Stream",
|
||||
badgeDesc: "„Sorry, ja za bardzo nie pamietam.” ~ Mollin",
|
||||
},
|
||||
{
|
||||
badgeName: "Alkoholik",
|
||||
badgeDesc: "pracoholicy gdy skończy im się pracohol:",
|
||||
},
|
||||
{
|
||||
badgeName: "Studnia Oneshot",
|
||||
badgeDesc: "elf w studni - ciekawe jak stamtąd wyjdzie",
|
||||
},
|
||||
{
|
||||
badgeName: "RemCon 2022",
|
||||
badgeDesc: "pomorze konwent",
|
||||
},
|
||||
]}
|
||||
isAdmin
|
||||
isDeveloper
|
||||
/>
|
||||
</main>
|
||||
)}
|
||||
{!isLoading && !user && (
|
||||
<main>
|
||||
<h1>/ja</h1>
|
||||
<p>
|
||||
Musisz być zalogowany aby skorzystać z funkcjonalności tej strony.
|
||||
</p>
|
||||
</main>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default PageMe;
|
||||
92
pages/ja/index.tsx
Normal file
92
pages/ja/index.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
import { useUser } from "@auth0/nextjs-auth0/client";
|
||||
import Link from "next/link";
|
||||
import { ProfileCard } from "../../components/ProfileCard/ProfileCard";
|
||||
import { SEO } from "../../components/SEO";
|
||||
|
||||
const PageMe = () => {
|
||||
const { user, error, isLoading } = useUser();
|
||||
|
||||
return (
|
||||
<>
|
||||
{isLoading && (
|
||||
<main>
|
||||
<h3>Ładujemy dane dla Ciebie...</h3>
|
||||
<p>Sit tight.</p>
|
||||
</main>
|
||||
)}
|
||||
{error && (
|
||||
<main>
|
||||
<h3>Wystąpił błąd.</h3>
|
||||
<p>Tyle wiemy:</p>
|
||||
<p>{error.name}</p>
|
||||
<p>{error.message}</p>
|
||||
</main>
|
||||
)}
|
||||
{!isLoading && !error && user && (
|
||||
<main>
|
||||
<SEO title="twój profil" />
|
||||
<ProfileCard
|
||||
data={{
|
||||
username: user.name || "unknown user",
|
||||
picture: user.picture,
|
||||
description: "Twój opis. ヽ(*・ω・)ﾉ",
|
||||
isAdmin: true,
|
||||
isDeveloper: true,
|
||||
experience: {
|
||||
level: 69,
|
||||
looseXP: 420,
|
||||
tilNextLevel: 69,
|
||||
},
|
||||
badges: [
|
||||
{
|
||||
badgeName: "Odkrywca internetowy",
|
||||
badgeDesc:
|
||||
"Logowanie się na gractwo.pl nie jest takie straszne.",
|
||||
},
|
||||
{
|
||||
badgeName: "Technik Informatyk",
|
||||
badgeDesc: "Łapanki na korytarzu to normalka.",
|
||||
},
|
||||
{
|
||||
badgeName: "Rozpad PGTF",
|
||||
badgeDesc: "Służba w oddziałach Super Pizzy - powód do dumy.",
|
||||
},
|
||||
{
|
||||
badgeName: "Mollin Stream",
|
||||
badgeDesc: "„Sorry, ja za bardzo nie pamietam.” ~ Mollin",
|
||||
},
|
||||
{
|
||||
badgeName: "Alkoholik",
|
||||
badgeDesc: "pracoholicy gdy skończy im się pracohol:",
|
||||
},
|
||||
{
|
||||
badgeName: "Studnia Oneshot",
|
||||
badgeDesc: "elf w studni - ciekawe jak stamtąd wyjdzie",
|
||||
},
|
||||
{
|
||||
badgeName: "RemCon 2022",
|
||||
badgeDesc: "pomorze konwent",
|
||||
},
|
||||
],
|
||||
}}
|
||||
/>
|
||||
<Link href="/ja/ustawienia">
|
||||
<button style={{ width: "100%", margin: 0 }}>
|
||||
Ustawienia Konta
|
||||
</button>
|
||||
</Link>
|
||||
</main>
|
||||
)}
|
||||
{!isLoading && !user && (
|
||||
<main>
|
||||
<h1>/ja</h1>
|
||||
<p>
|
||||
Musisz być zalogowany aby skorzystać z funkcjonalności tej strony.
|
||||
</p>
|
||||
</main>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default PageMe;
|
||||
42
pages/ja/ustawienia.tsx
Normal file
42
pages/ja/ustawienia.tsx
Normal file
@@ -0,0 +1,42 @@
|
||||
import { useUser } from "@auth0/nextjs-auth0/client";
|
||||
import { SEO } from "../../components/SEO";
|
||||
import styles from "../../styles/ustawienia.module.scss";
|
||||
|
||||
const PageMeSettings = () => {
|
||||
const { user, error, isLoading } = useUser();
|
||||
|
||||
return (
|
||||
<>
|
||||
{isLoading && (
|
||||
<>
|
||||
<main>
|
||||
<h3>Ładowanie danych...</h3>
|
||||
</main>
|
||||
</>
|
||||
)}
|
||||
{error && (
|
||||
<main>
|
||||
<h3>Wystąpił błąd.</h3>
|
||||
<p>Tyle wiemy.</p>
|
||||
</main>
|
||||
)}
|
||||
{!isLoading && !error && user && (
|
||||
<>
|
||||
<main>
|
||||
<SEO title="ustawienia konta" />
|
||||
<h1>ustawienia konta</h1>
|
||||
<p>
|
||||
Kolor akcentowy <input type="color" name="" id="" />
|
||||
</p>
|
||||
</main>
|
||||
<main>
|
||||
<h3>uwaga: strona w trakcie budowy. funkcjonalność niegotowa.</h3>
|
||||
<button>Zapisz zmiany</button>
|
||||
</main>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default PageMeSettings;
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useRouter } from "next/router";
|
||||
import { useEffect, useState } from "react";
|
||||
import { ProfileCard } from "../../../components/ProfileCard/ProfileCard";
|
||||
import { SEO } from "../../../components/SEO";
|
||||
|
||||
const ProfilePage = () => {
|
||||
@@ -43,37 +44,64 @@ const ProfilePage = () => {
|
||||
return wpis.Name.replaceAll(" ", "-").toLocaleLowerCase() === profname;
|
||||
})[0];
|
||||
return (
|
||||
<main>
|
||||
<>
|
||||
<SEO title={person.Name} />
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
gap: "1rem",
|
||||
marginBottom: "1rem",
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src={person.Img}
|
||||
alt={`${person.Name} profile image`}
|
||||
<main>
|
||||
<div
|
||||
style={{
|
||||
width: "128px",
|
||||
aspectRatio: "1/1",
|
||||
objectFit: "cover",
|
||||
borderRadius: "50%",
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
gap: "1rem",
|
||||
margin: "2rem 0 0 0",
|
||||
}}
|
||||
/>
|
||||
<div>
|
||||
<h1>{person.Name}</h1>
|
||||
<p>{person.Desc}</p>
|
||||
>
|
||||
<img
|
||||
src={person.Img}
|
||||
alt={`${person.Name} profile image`}
|
||||
style={{
|
||||
width: "128px",
|
||||
aspectRatio: "1/1",
|
||||
objectFit: "cover",
|
||||
borderRadius: "50%",
|
||||
}}
|
||||
/>
|
||||
<div>
|
||||
<h1>{person.Name}</h1>
|
||||
<p>{person.Desc}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* FOR LATER BIGDESC DATASET */}
|
||||
{/* {person.profile?.bigdesc.map((el, index) => {
|
||||
{/* FOR LATER BIGDESC DATASET */}
|
||||
{/* {person.profile?.bigdesc.map((el, index) => {
|
||||
return <p key={index}>{el || <br />}</p>;
|
||||
})} */}
|
||||
</main>
|
||||
</main>
|
||||
<main>
|
||||
<ProfileCard
|
||||
data={{
|
||||
username: person.Name,
|
||||
picture: person.Img,
|
||||
description: "Twój opis. ヽ(*・ω・)ﾉ",
|
||||
// accentColor: "violet",
|
||||
isAdmin: person.IsAdmin,
|
||||
isDeveloper: person.DevBadge,
|
||||
experience: {
|
||||
level: 69,
|
||||
looseXP: 420,
|
||||
tilNextLevel: 69,
|
||||
},
|
||||
badges: [
|
||||
{
|
||||
badgeName: "Odkrywca internetowy",
|
||||
badgeDesc:
|
||||
"Logowanie się na gractwo.pl nie jest takie straszne.",
|
||||
},
|
||||
],
|
||||
}}
|
||||
/>
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user