diff --git a/.env b/.env index 66ef515..0a580b0 100644 --- a/.env +++ b/.env @@ -4,6 +4,7 @@ # Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB. # See the documentation for all the connection string options: https://pris.ly/d/connection-strings +NEXT_BASE_URL="http://localhost:3000" # DATABASE_URL="postgresql://postgres:postgres@localhost:5432/mydb?schema=prisma" # #!! fill this diff --git a/next.config.mjs b/next.config.mjs index 2bfb11f..fec8efe 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,5 +1,6 @@ /** @type {import('next').NextConfig} */ const nextConfig = { + reactStrictMode: true, images: { remotePatterns: [ { @@ -8,7 +9,9 @@ const nextConfig = { }, ], }, - reactStrictMode: true, + env: { + BASE_URL: process.env.BASE_URL, + }, }; export default nextConfig; diff --git a/package-lock.json b/package-lock.json index 45e5734..4c5ac6c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4773,6 +4773,126 @@ "funding": { "url": "https://github.com/sponsors/sindresorhus" } + }, + "node_modules/@next/swc-darwin-arm64": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.1.0.tgz", + "integrity": "sha512-nUDn7TOGcIeyQni6lZHfzNoo9S0euXnu0jhsbMOmMJUBfgsnESdjN97kM7cBqQxZa8L/bM9om/S5/1dzCrW6wQ==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-darwin-x64": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.1.0.tgz", + "integrity": "sha512-1jgudN5haWxiAl3O1ljUS2GfupPmcftu2RYJqZiMJmmbBT5M1XDffjUtRUzP4W3cBHsrvkfOFdQ71hAreNQP6g==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-gnu": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.1.0.tgz", + "integrity": "sha512-RHo7Tcj+jllXUbK7xk2NyIDod3YcCPDZxj1WLIYxd709BQ7WuRYl3OWUNG+WUfqeQBds6kvZYlc42NJJTNi4tQ==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-musl": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.1.0.tgz", + "integrity": "sha512-v6kP8sHYxjO8RwHmWMJSq7VZP2nYCkRVQ0qolh2l6xroe9QjbgV8siTbduED4u0hlk0+tjS6/Tuy4n5XCp+l6g==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-gnu": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.1.0.tgz", + "integrity": "sha512-zJ2pnoFYB1F4vmEVlb/eSe+VH679zT1VdXlZKX+pE66grOgjmKJHKacf82g/sWE4MQ4Rk2FMBCRnX+l6/TVYzQ==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-musl": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.1.0.tgz", + "integrity": "sha512-rbaIYFt2X9YZBSbH/CwGAjbBG2/MrACCVu2X0+kSykHzHnYH5FjHxwXLkcoJ10cX0aWCEynpu+rP76x0914atg==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-arm64-msvc": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.1.0.tgz", + "integrity": "sha512-o1N5TsYc8f/HpGt39OUQpQ9AKIGApd3QLueu7hXk//2xq5Z9OxmV6sQfNp8C7qYmiOlHYODOGqNNa0e9jvchGQ==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-ia32-msvc": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.1.0.tgz", + "integrity": "sha512-XXIuB1DBRCFwNO6EEzCTMHT5pauwaSj4SWs7CYnME57eaReAKBXCnkUE80p/pAZcewm7hs+vGvNqDPacEXHVkw==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } } } } diff --git a/src/assets/data/bpaList.tsx b/src/assets/data/bpaList.tsx new file mode 100644 index 0000000..c869d8a --- /dev/null +++ b/src/assets/data/bpaList.tsx @@ -0,0 +1,214 @@ +import { bpaType } from "@/components/BPAinfo"; + +export const bpaListGeneral: bpaType[] = [ + { + name: "Ketua Angkatan", + jobDesc: + "Memiliki tugas utama memimpin organisasi dan bertanggung jawab atas keputusan di dalamnya. Menjadi perwakilan STEI-K 2023 di ranah antarfakultas TPB dan kegiatan lain di ITB. Mengkoordinasikan seluruh bidang dan divisi dalam BPA STEI-K 2023. Mengawasi kinerja BPA dan memonitoring keberjalanan program kerja yang dilaksanakan. Mengkoordinasikan program kerja serta timeline-nya.", + members: [ + { + name: "Surya Suharna", + imgUrl: "", + }, + ], + }, + { + name: "Wakil Ketua Angkatan", + jobDesc: + "Membantu memimpin organisasi dan berdiskusi dengan Ketua Angkatan mengenai keputusan-keputusan yang akan di ambil dalam BPA. Menggantikkan Ketua Angkatan dalam mewakili fakultas jika Ketua Angkatan berhalangan hadir. Mengkoordinasikan seluruh bidang dan divisi dalam BPA STEI-K 2023. Mengawasi kinerja BPA dan memonitoring keberjalanan program kerja yang dilaksanakan Mengkoordinasikan program kerja serta timeline-nya.", + members: [ + { + name: "Persada Ramiiza Abyudaya", + imgUrl: "", + }, + ], + }, + { + name: "Sekretaris", + jobDesc: + "Membuat arsip rapat setiap bidang atau divisi yang dikelola. Membuat template dokumen seperti template proposal, laporan, dan lain-lain. Sekretaris 1 akan mengelola arsip dokumen Bidang Internal divisi Public Relation, Publication, Design, Creative Event, dan Project. Sekretaris 2 akan mengelola arsip dokumen Bidang External divisi Akademic, IT, Punakawan, HRD, dan Finance", + members: [ + { name: "Bevinda Vivian", imgUrl: "" }, + { name: "Zheannetta Apple", imgUrl: "" }, + ], + }, + { + name: "Bendahara", + jobDesc: + " Merekap pemasukkan dan pengeluaran BPA STEI-K 2023. Memiliki wewenang dalam persetujuan pengeluaran keuangan. Melakukan koordinasi pembukaan rekening STEI-K 2023. Menerima laporan pemasukkan dari Finance. Melakukan pembukuan di akhir periode.", + members: [ + { name: "Nayla Zahira", imgUrl: "" }, + { name: "Wardatul Khoiroh", imgUrl: "" }, + ], + }, + { + name: "TPB Committee", + jobDesc: + "Menghadiri setiap kegiatan di kongres ITB sebagai perwakilan STEI-K 2023. Membuat rekap informasi pada setiap pertemuan kongres ITB. Membuat wadah aspriasi massa STEI-K 2023 dan menyampaikannya di rapat kongres ITB. Melaporkan dan mengkomunikasikan hasil kegiatan di kongres ITB pada massa STEI-K 2023.", + members: [{ name: "Naufarrel Zhafif Abhista", imgUrl: "" }], + }, + { + name: "General Manager", + jobDesc: + "Mengkoordinasikan setiap divisi yang kelola. Bertanggung jawab atas keputusan setiap bidang dan divisi. Mengkoordinasikan arahan kerja bersama Ketua dan Wakil Angkatan. Melaporkan rekap progress program kerja pada Ring 1 BPA STEI-K 2023. Mengarahkan, melaksanakan, dan mengawasi setiap divisi untuk setiap arahan kerja yang dijalankan ", + members: [ + { + name: "Wisa Ahmaduta Dinutama", + position: "GM External", + imgUrl: "", + }, + { + name: "Najwa Kahani Fatima", + position: "GM External", + imgUrl: "", + }, + { + name: "Qodri Azkarayan", + position: "GM Internal", + imgUrl: "", + }, + { + name: "Farrel Athalla Putra", + position: "GM Internal", + imgUrl: "", + }, + { + name: "Muhammad Azizdzaki Khrisnanurmuflih", + position: "GM of Finance", + imgUrl: "", + }, + { + name: "Muhamad Hasbullah", + position: "GM of HRD", + imgUrl: "", + }, + ], + }, +]; + +export const bpaListExternal: bpaType[] = [ + { + name: "Akademik", + jobDesc: + "Melakukan dan membuat survey jurusan, info jurusan, info mata kuliah, dan informasi tambahan yang berkaitan dengan akademik. Tutor sebaya UTS Semester 2. Tutor sebaya UAS Semester 2. Tutor sebaya UP Semester 2. Membuat Try-Out Matematika, Fisika, Daspro, dan Kimia setelah setiap kali dilaksanakan Tutor Sebaya. Tutor sebaya KBF dan Praktikkum Daspro. Membuat video pembelajaran Kimia. Membuat drive terpusat akademik STEI-K 2023. Membuat rangkuman materi 1 semester atau materi UTS dan UAS.", + members: [ + { name: "Zulfaqqar Nayaka Athadiansyah", imgUrl: "" }, + { name: "Mochammad Fariz Rifqi Rizqulloh", imgUrl: "" }, + { name: "Muhammad Fathur Rizky", imgUrl: "" }, + { name: "Darrel Adinarya Sunanda", imgUrl: "" }, + { name: "Azfa Radhiyya Hakim", imgUrl: "" }, + { name: "Razi Rachman Widyadhana", imgUrl: "" }, + ], + }, + { + name: "IT", + jobDesc: + "Merencanakan dan membuat website yang mengintegrasi informasi penting terkait akademik, kemahasiswaan, kegiatan STEI-K 2023, program kerja, dan lain-lain.Merevisi setiap bug yang terjadi. Mengembangkan website menjadi lebih interaktif dengan fitur-fitur yang bermanfaat bagi massa STEI-K 2023. Mengembangkan fitur kritik dan saran di Website.", + members: [ + { name: "Yonatan Edward Njoto", imgUrl: "" }, + { name: "Michael Ballard Isaiah Silaen", imgUrl: "" }, + { name: "Dave Daniell Yanni", imgUrl: "" }, + { name: "Alvin Christopher Santausa", imgUrl: "" }, + ], + }, + { + name: "Punakawan", + jobDesc: + "Melakukan pencarian informasi terkait penerimaan mahasiswa baru STEI-K 2024. Melakukan pencarian informasi terkait kehidupan di Jatinangor, seperti informasi tempat makan, tempat healing, tempat belajar, kost ataupun transportasi. Berkoordinasi dengan divisi akademik mengenai data survei STEI-K 2023. Membuat persiapan materi dari pencarian informasi dan data survei yang dituangkan ke dalam PPT. Melakukan persiapan welpar (games, rundown, dan lain-lain). Melakukan kegiatan pengenalan awal mengenai dunia perkuliahan dan lingkungan di STEI-K terhadap Massa STEIK-24 (Welpar). Melaksanakan gathering dengan Massa STEI-K 24 dan STEI-K 23. Menerapkan mentoring berkelompok antar STEI-K 24 dan STEI-K 23 sebagai mentor.", + members: [ + { name: "Ahsan Malik Al Farisi", imgUrl: "" }, + { name: "Naura Ayurachmani", imgUrl: "" }, + { name: "Mayla Yaffa Ludmilla", imgUrl: "" }, + { name: "Gabriela Jennifer Sandy", imgUrl: "" }, + { name: "Raka Daffa Iftikhaar", imgUrl: "" }, + { name: "Muhammad Adha Ridwan", imgUrl: "" }, + { name: "Jessica Allen", imgUrl: "" }, + ], + }, +]; +export const bpaListInternal: bpaType[] = [ + { + name: "Publikasi", + jobDesc: "", + members: [ + { name: "Princessfa Azzahra Alvin", imgUrl: "" }, + { name: "Nazwan Siddqi Muttaqin", imgUrl: "" }, + { name: "Haegen Quinston Sutomo", imgUrl: "" }, + { name: "Stanislaus Ardy Bramantyo", imgUrl: "" }, + ], + }, + { + name: "Creative Event", + jobDesc: "", + members: [ + { name: "Desati Dinda Saraswati", imgUrl: "" }, + { name: "Muhammad Timur Kanigara", imgUrl: "" }, + { name: "Adam Joaquin Girsang", imgUrl: "" }, + { name: "Alma Felicia Vielrizki", imgUrl: "" }, + { name: "Hasri Fayadh Muqaffa", imgUrl: "" }, + ], + }, + { + name: "Desain", + jobDesc: "", + members: [ + { name: "Leticia Aldina Trulykinanti", imgUrl: "" }, + { name: "Aulia Azka Azzahra", imgUrl: "" }, + { name: "Naila Selvira Budiana", imgUrl: "" }, + { name: "Frederiko Eldad Mugiyono", imgUrl: "" }, + ], + }, + { + name: "Public Relation", + jobDesc: + " Membuat broadcast yang dikirimkan pada massa STEI-K 2023 sesuai program kerja bidang divisi terkait. Membuat contact person untuk teman-teman STEI-K yang sakit dan menindaklanjuti dengan memberikan bantuan makan dan obat-obatan. Membuat contact person untuk teman-teman STEI-K yang mengalami pelecehan seksual dan bullying untuk ditinjau dan ditindaklanjuti. Mendata massa STEI-K yang mendapatkan prestasi untuk diberikan appreciation post. Mendata massa STEI-K untuk pengajuan keringanan UKT dari IOM.", + members: [ + { name: "Kevin Azra", imgUrl: "" }, + { name: "Muhammad Faiz Alfikrona", imgUrl: "" }, + { name: "Muhammad Aymar Barkhaya", imgUrl: "" }, + { name: "Kefas Kurnia Jonathan", imgUrl: "" }, + { name: "Aliya Harta Ary Utama", imgUrl: "" }, + { name: "Adinda Putri", imgUrl: "" }, + { name: "Henrycus Hugatama Risaldy", imgUrl: "" }, + ], + }, + { + name: "Project", + jobDesc: + "Melakukan pemilihan dan penyusunan panitia Jaket Angkatan STEI-K 2023. Melakukan pemilihan dan penyusunan panitia Makrab STEI-K 2023. Melakukan pemilihan dan penyusunan panitia IMPACT 2024. Dalam pelaksanaan setiap projectnya, pembentukkan panitia pelaksana kegiatan akan dibentuk melalui recruitment terbuka kepada massa STEI-K 2023. Pada recruitment terbuka tersebut, anggota BPA diperkenankan untuk mengajukan diri sebagai panitia project. Pada akhirnya penyeleksian panitia akan dilakukan oleh Divisi Project dan mengumumkannya ke massa STEI-K 2023. ", + members: [ + { name: "Allodya Qonnita Arofa", imgUrl: "" }, + { name: "Wijaksara Aptaluhung", imgUrl: "" }, + { name: "Brian Albar Hadian", imgUrl: "" }, + ], + }, + { + name: "HRD", + jobDesc: + "Melakukan penilaian pada kinerja setiap anggota BPA STEI-K 2023. Penilaian tersebut dituangkan di dalam data tabel yang direkap berkala. Menentukkan best staff BPA STEI-K 2023 setiap bulan atau dalam skala waktu yang ditentukkan. Best staff tersebut akan dipublikasikan di sosial media instagram STEI-K 2023. Menyusun SOP yang diperlukan untuk landasan aturan yang dipatuhi oleh seluruh BPA STEI-K 2023. Mengadakan kegiatan bonding BPA STEI-K 2023 dengan tujuan mendekatkan dan menguatkan kedekatan antar BPA STEI-K 2023. Melakukan rapat evaluasi jika terdapat divisi yang dinilai memiliki kendala atau kinerja tim yang tidak sesuai dengan target.", + members: [ + { name: "Barru Adi Utomo", imgUrl: "" }, + { name: "Arqila Surya Putra", imgUrl: "" }, + { name: "Naomi Risaka Sitorus", imgUrl: "" }, + { name: "Lidya Marthadilla", imgUrl: "" }, + { name: "Dita Maheswari", imgUrl: "" }, + { name: "Sendi Putra Alicia", imgUrl: "" }, + { name: "Aldoy Fauzan Avanza", imgUrl: "" }, + { name: "Ni Made Sekar Jelita Parameswari", imgUrl: "" }, + { name: "Anella Utari Gunadi", imgUrl: "" }, + { name: "Rayhan Hidayatul Fikri", imgUrl: "" }, + { name: "Muhammad Fithra Rizki", imgUrl: "" }, + ], + }, + { + name: "Finance", + jobDesc: "", + members: [ + { name: "Nawaf Amjad Rizqi Aldaha Ismail", imgUrl: "" }, + { name: "Nurul Na'im Natifah", imgUrl: "" }, + { name: "Sabilul Huda", imgUrl: "" }, + { name: "Muhammad Raihaan Perdana", imgUrl: "" }, + { name: "Nakeisha Valya Shakila", imgUrl: "" }, + ], + }, +]; diff --git a/src/components/BPACard.tsx b/src/components/BPACard.tsx index 141d19c..cd20899 100644 --- a/src/components/BPACard.tsx +++ b/src/components/BPACard.tsx @@ -8,7 +8,7 @@ export type memberBPA = { }; const BPACard = ({ imgUrl, name, position }: { imgUrl: string; name: string; position?: string }) => { return ( -
+
{name} -

{name}

- {position &&

{position}

} +
+

{name}

+ {position &&

{position}

} +
); }; diff --git a/src/components/BPAbutton.tsx b/src/components/BPAbutton.tsx index 6095cf4..3b745e3 100644 --- a/src/components/BPAbutton.tsx +++ b/src/components/BPAbutton.tsx @@ -1,10 +1,11 @@ import React from "react"; import Link from "next/link"; import { bpaType } from "./BPAinfo"; +import { getSlug } from "@/lib/utils/stringManipulation"; const BPAbutton = ({ data }: { data: bpaType }) => { return ( - +

{data.name}{" "} {data.members.length > 1 && {data.members.length}} diff --git a/src/components/BPAinfo.tsx b/src/components/BPAinfo.tsx index bbfac73..5898dc3 100644 --- a/src/components/BPAinfo.tsx +++ b/src/components/BPAinfo.tsx @@ -1,5 +1,6 @@ -import React from "react"; +import React, { useState } from "react"; import BPACard, { memberBPA } from "./BPACard"; +import { getSlug } from "@/lib/utils/stringManipulation"; export type bpaType = { name: string; @@ -8,15 +9,50 @@ export type bpaType = { }; const BPAInfo = ({ data }: { data: bpaType }) => { + const [copySuccess, setCopySuccess] = useState(false); + + const handleCopyLink = () => { + const slug = getSlug(data.name); + const baseUrl = process.env.BASE_URL || ""; + + const linkToCopy = `${baseUrl}/tentang-bpa/#${slug}`; + + navigator.clipboard.writeText(linkToCopy).then(() => { + setCopySuccess(true); + setTimeout(() => { + setCopySuccess(false); + }, 2000); + }); + }; + return ( -

-

{data.name}

-

{data.jobDesc}

-
- {data.members.map((member, idx) => ( - - ))} +
+
+

{data.name}

+ + # + + {copySuccess && Copied!}
+ {data.members.length > 1 ? ( + <> +

{data.jobDesc}

+
+ {data.members.map((member, idx) => ( + + ))} +
+ + ) : ( +
+
+ {data.members.map((member, idx) => ( + + ))} +
+

{data.jobDesc}

+
+ )}
); }; diff --git a/src/components/LoginButton.tsx b/src/components/LoginButton.tsx index 92c8246..fdad356 100644 --- a/src/components/LoginButton.tsx +++ b/src/components/LoginButton.tsx @@ -8,9 +8,7 @@ import Link from "next/link"; import { MdPerson } from "react-icons/md"; const MenuList = ({ children }: { children: React.ReactNode }) => ( -
  • - {children} -
    • +
  • {children}
    • ); export default function LoginButton() { @@ -22,8 +20,7 @@ export default function LoginButton() {
    {/* Dropdown */}
    { setShowDropDown(false); - }} - > + }}>

    {session?.user?.name}

    @@ -88,10 +78,7 @@ export default function LoginButton() {
    -
    @@ -101,10 +88,7 @@ export default function LoginButton() { } return ( <> - diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx index 734ac8f..3243af5 100644 --- a/src/components/Navbar.tsx +++ b/src/components/Navbar.tsx @@ -8,23 +8,12 @@ import { GoHome, GoCopilot } from "react-icons/go"; import { IoMdBook } from "react-icons/io"; import { RiGroupLine } from "react-icons/ri"; -const NavListDesktop = ({ - href, - routerPathname, - lable, -}: { - href: string; - routerPathname: string; - lable: string; -}) => ( +const NavListDesktop = ({ href, routerPathname, lable }: { href: string; routerPathname: string; lable: string }) => (

    + routerPathname === href ? "border-b-2 border-gray-400" : "hover:brightness-110 hover:border-b-2 border-gray-400" + }> {lable}

    @@ -35,7 +24,7 @@ const Navbar = () => { const [scrollDirection, setScrollDirection] = useState(true); const [prevScrollPos, setPrevScrollPos] = useState(0); - const [shadow, setShadow] = useState(true); + const [shadow, setShadow] = useState(false); const [scrolledOneThirdvw, setScrolledOneThirdvw] = useState(false); const [navMobile, setNavMobile] = useState(false); @@ -54,10 +43,10 @@ const Navbar = () => { const currentScrollPos = window.scrollY; if (currentScrollPos === 0) { setScrollDirection(true); - setShadow(true); + setShadow(false); } else if (prevScrollPos > currentScrollPos) { setScrollDirection(true); - setShadow(false); + setShadow(true); if (currentScrollPos >= window.innerWidth / 2.8) { setScrolledOneThirdvw(true); } else { @@ -73,21 +62,16 @@ const Navbar = () => { window.addEventListener("scroll", changeShadow); return () => window.removeEventListener("scroll", changeShadow); - }, [prevScrollPos, scrollDirection]); + }, [prevScrollPos]); useEffect(() => { - const currentScrollPos = window.pageYOffset; + const currentScrollPos = window.scrollY; + setScrollDirection(true); if (currentScrollPos === 0) { - setScrollDirection(true); + setShadow(false); } else { - setScrollDirection(true); - if (currentScrollPos >= window.innerWidth / 2.8) { - setScrolledOneThirdvw(true); - } else { - setScrolledOneThirdvw(false); - } + setShadow(true); } - setPrevScrollPos(currentScrollPos); }, []); return ( @@ -95,22 +79,16 @@ const Navbar = () => {
    + } ${scrollDirection ? "translate-y-0" : "-translate-y-24"} ${shadow ? "border-0 shadow-lg" : "border-b-2"} ${ + router.pathname === "/" && !scrolledOneThirdvw ? "bg-[#181b1b] " : "bg-slate-100" + }`}>
    + router.pathname === "/" && !scrolledOneThirdvw ? "w-0 scale-0" : "scale-100 w-auto" + }`}> { priority />
    -

    - Syntax -

    +

    Syntax

    {/* Navigation list */}
    {/* Desktop navigation list */} -
    - - - - +
    + + + +
    {/* Mobile Nav Button */} - {/* Mobile Nav List */}
    handleNav(false)} - className={`text-slate-800 ${navMobile ? "md:hidden fixed left-0 top-0 w-full h-screen bg-black/70" : ""}`} - > + className={`text-slate-800 ${navMobile ? "md:hidden fixed left-0 top-0 w-full h-screen bg-black/70" : ""}`}>
    + }>

    SYNTAX

    STEI-K 23

    -

    - Code, Create, Connect! -

    +

    Code, Create, Connect!

    - + Home - + BPA - + Akademik + className="bg-slate-50 hover:brightness-95 pl-2 py-1 flex items-center gap-2"> Acara Kemahasiswaan
    diff --git a/src/lib/utils/stringManipulation.tsx b/src/lib/utils/stringManipulation.tsx new file mode 100644 index 0000000..2f29f96 --- /dev/null +++ b/src/lib/utils/stringManipulation.tsx @@ -0,0 +1,3 @@ +export const getSlug = (inputString: string) => { + return inputString.replace(/ /g, "-"); +}; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index c4ff217..e6dc145 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -13,10 +13,7 @@ const fontFam = Poppins({ subsets: ["latin"], }); -export default function App({ - Component, - pageProps: { session, ...pageProps }, -}: AppProps) { +export default function App({ Component, pageProps: { session, ...pageProps } }: AppProps) { const router = useRouter(); const [scrolledOneThirdvw, setScrolledOneThirdvw] = useState(false); const [prevScrollPos, setPrevScrollPos] = useState(0); @@ -65,11 +62,8 @@ export default function App({ router.pathname === "/" && !scrolledOneThirdvw ? "bg-gradient-to-t from-black to-[#242828] text-slate-100" : "bg-slate-100 text-slate-900" - }`} - > -
    + }`}> +
    diff --git a/src/pages/tentang-bpa/index.tsx b/src/pages/tentang-bpa/index.tsx index 9bc82f0..cd0162b 100644 --- a/src/pages/tentang-bpa/index.tsx +++ b/src/pages/tentang-bpa/index.tsx @@ -1,65 +1,83 @@ -import BPACard from "@/components/BPACard"; import BPAInfo from "@/components/BPAinfo"; import BPAbutton from "@/components/BPAbutton"; import Navbar from "@/components/Navbar"; import Head from "next/head"; import Link from "next/link"; -import React, { useEffect } from "react"; +import React from "react"; +import { bpaListExternal, bpaListGeneral, bpaListInternal } from "@/assets/data/bpaList"; +import { FaPersonMilitaryRifle } from "react-icons/fa6"; +import Image from "next/image"; +import { getSlug } from "@/lib/utils/stringManipulation"; -type member = { - name: string; - position?: string; - imgUrl: string; -}; -type bpaType = { - name: string; - jobDesc: string; - members: member[]; -}; - -const index = () => { +const TentangBpa = () => { return ( <> BPA | STEI-K 23 -
    +
    {/* nav */} -
    -
    -

    Syntax | STEI-K 23

    -
    -
    -
    - {bpaListGeneral.map((bpa) => ( - - ))} -
    -
    -

    External

    -
    - {bpaListExternal.map((bpa) => ( - - ))} +
    +
    +
    +
    + Logo STEI-K 23
    +

    Syntax

    +
    +
    +

    Syntax | STEI-K 23

    +

    BPA '23

    -
    -

    Internal

    -
    - {bpaListInternal.map((bpa) => ( - +
    +
    +

    Petinggi

    + {bpaListGeneral.map((bpa) => ( + + +

    {bpa.name}

    + ))}
    +
    +

    Petinggi

    +
    + {bpaListGeneral.map((bpa) => ( + + ))} +
    +
    +
    +

    External

    +
    + {bpaListExternal.map((bpa) => ( + + ))} +
    +
    +
    +

    Internal

    +
    + {bpaListInternal.map((bpa) => ( + + ))} +
    +
    {/* Info BPA */} -