aboutsummaryrefslogtreecommitdiff
path: root/components
diff options
context:
space:
mode:
authorAndrew Lee <alee14498@protonmail.com>2023-07-19 00:48:11 -0400
committerAndrew Lee <alee14498@protonmail.com>2023-07-19 00:48:11 -0400
commitd57226e5a802ecd6607faf67f32621e2da725a35 (patch)
treed2073bbc14409095c61255ea83b2ca3815df309d /components
parent3c80755e70aa85daa59edc5dbe200400894254c7 (diff)
downloadalure-website-d57226e5a802ecd6607faf67f32621e2da725a35.tar.gz
alure-website-d57226e5a802ecd6607faf67f32621e2da725a35.tar.bz2
alure-website-d57226e5a802ecd6607faf67f32621e2da725a35.zip
Moved all components to app folder
Diffstat (limited to 'components')
-rw-r--r--components/Header.js12
-rw-r--r--components/Navbar.js46
-rw-r--r--components/PSA.js47
-rw-r--r--components/psa.json5
-rw-r--r--components/travel-advisory/HistoryModal.js40
-rw-r--r--components/travel-advisory/ListCountries.js66
-rw-r--r--components/updates/DateFormatter.js9
-rw-r--r--components/updates/PostPreview.js15
-rw-r--r--components/updates/getPostMetadata.js24
9 files changed, 0 insertions, 264 deletions
diff --git a/components/Header.js b/components/Header.js
deleted file mode 100644
index bd70dd0..0000000
--- a/components/Header.js
+++ /dev/null
@@ -1,12 +0,0 @@
-const Header = ({title, description}) => {
- return (
- <div className="bg-center bg-no-repeat bg-[url('/jumbotron.webp')] bg-gray-700 bg-blend-multiply">
- <div className="md:px-40 px-10 max-w-screen-xl text-left py-24 lg:py-10 space-y-3">
- <h1 className="font-medium text-4xl">{title}</h1>
- <h2 className="font-light text-lg">{description}</h2>
- </div>
- </div>
- )
-}
-
-export default Header;
diff --git a/components/Navbar.js b/components/Navbar.js
deleted file mode 100644
index 1555eb9..0000000
--- a/components/Navbar.js
+++ /dev/null
@@ -1,46 +0,0 @@
-"use client";
-import Image from "next/image";
-import Link from "next/link";
-import { useState } from "react";
-
-const Navbar = () => {
- const [navbar, setNavbar] = useState(false);
- return (
- <nav className="border-gray-200 bg-neutral-900">
- <div className="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
- <div className="flex items-center">
- <Image src="/alure_flag.svg" className="mr-5" alt="Alure Flag" width={70} height={70}/>
- <span className="self-center text-2xl font-medium whitespace-nowrap dark:text-white"><p>Government</p><p>of Alure Regions</p></span>
- </div>
- <button data-collapse-toggle="navbar-default" type="button"
- className="transition duration-150 ease-out hover:ease-in inline-flex items-center p-2 w-10 h-10 justify-center text-sm text-gray-500 rounded-lg md:hidden hover:bg-zinc-600 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600"
- aria-controls="navbar-default" aria-expanded="false" onClick={() => setNavbar(!navbar)}>
- <span className="sr-only">Open main menu</span>
- <svg className="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
- viewBox="0 0 17 14">
- <path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"
- d="M1 1h15M1 7h15M1 13h15"/>
- </svg>
- </button>
- <div className={`w-full md:block md:w-auto ${navbar ? 'block' : 'hidden' }`}>
- <ul className="font-medium text-lg flex flex-col p-4 md:p-0 mt-4 rounded-lg md:flex-row md:space-x-8 md:mt-0">
- {[
- ['Home', '/'],
- ['Updates', '/updates'],
- ['Services', '/services'],
- ['Travel Advisory', '/travel-advisory'],
- ].map(([title, url]) => (
- <li key="links">
- <Link href={url} className="transition duration-150 ease-out hover:ease-in block py-2 pl-3 pr-4 rounded md:border-0 md:p-0 text-white md:hover:text-blue-500 hover:bg-gray-700 hover:text-white md:hover:bg-transparent" onClick={() => setNavbar(!navbar)}>
- {title}
- </Link>
- </li>
- ))}
- </ul>
- </div>
- </div>
- </nav>
- )
-}
-
-export default Navbar;
diff --git a/components/PSA.js b/components/PSA.js
deleted file mode 100644
index 06bf9ba..0000000
--- a/components/PSA.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import psaMessage from './psa.json' assert { type: 'json' };
-import Link from "next/link";
-
-const PSA = () => {
- let defaultStyle = "flex flex-row md:px-40 px-30 py-0.5 space-x-2";
- let styleImportant;
- let important;
- switch (psaMessage.important) {
- case 0:
- styleImportant = "hidden"
- defaultStyle += ' ' + styleImportant
- break;
- case 1:
- important = "Latest News:"
- styleImportant = "bg-zinc-700"
- defaultStyle += ' ' + styleImportant
- break;
- case 2:
- important = "WARNING!"
- styleImportant = "bg-yellow-700"
- defaultStyle += ' ' + styleImportant
- break;
- case 3:
- important = "EMERGENCY!"
- styleImportant = "bg-red-800"
- defaultStyle += ' ' + styleImportant
- break;
-
- }
-
- return (
- <div className={defaultStyle}>
- <p className="text-lg font-medium">{important}</p>
- <div className="flex flex-row space-x-3">
- <p>{psaMessage.announcement}</p>
- <p className="text-blue-200 hover:text-blue-500 active:text-blue-700">
- {psaMessage.link && (
- <Link href={psaMessage.link}>
- Learn more ↗
- </Link>
- )}</p>
- </div>
- </div>
- )
-}
-
-export default PSA;
diff --git a/components/psa.json b/components/psa.json
deleted file mode 100644
index df9869f..0000000
--- a/components/psa.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "important": 0,
- "announcement": "No important announcements",
- "link": "https://google.ca"
-}
diff --git a/components/travel-advisory/HistoryModal.js b/components/travel-advisory/HistoryModal.js
deleted file mode 100644
index 3ef2ea8..0000000
--- a/components/travel-advisory/HistoryModal.js
+++ /dev/null
@@ -1,40 +0,0 @@
-const HistoryModal = ({ isVisible, onClose, countries, dangerLevel, history }) => {
- if (!isVisible) return null;
- const handleClose = (e) => {
- if(e.target.id === 'wrapper') onClose();
- }
-
- let historyList;
- if (history && history.length > 0) {
- historyList = history.map((event, index) => {
- return (
- <li key={index}>{event}</li>
- )
- })
- } else {
- historyList = <li>Currently no diplomatic tensions in this country.</li>;
- }
-
- return (
- <div id="wrapper" className="fixed inset-0 bg bg-opacity-25 backdrop-blur-sm flex justify-center items-center" onClick={handleClose}>
- <div className="w-[700px]">
- <div className="flex flex-col">
- <div className="bg-zinc-800 p-5 rounded-lg border border-gray-700">
- <div className="divide-y space-y-3">
- <div>
- <h1 className="font-medium text-3xl">{countries}</h1>
- <h2 className="font-medium text-xl">{dangerLevel}</h2>
- </div>
- <div>
- <h1 className="font-medium text-2xl pt-3">History</h1>
- <ul>{historyList}</ul>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- )
-}
-
-export default HistoryModal;
diff --git a/components/travel-advisory/ListCountries.js b/components/travel-advisory/ListCountries.js
deleted file mode 100644
index 078af5c..0000000
--- a/components/travel-advisory/ListCountries.js
+++ /dev/null
@@ -1,66 +0,0 @@
-"use client"
-import countriesData from '@/app/travel-advisory/countries.json' assert { type: 'json' };
-import HistoryModal from "@/components/travel-advisory/HistoryModal";
-import { useState } from "react";
-
-export function getDangerLevel(danger) {
- let dangerLevel;
- switch (danger) {
- case 0:
- dangerLevel = "Take normal security precautions"
- break;
- case 1:
- dangerLevel = "Exercise a high degree of caution"
- break;
- case 2:
- dangerLevel = "Avoid non-essential travel"
- break;
- case 3:
- dangerLevel = "Avoid all travel"
- break;
- default:
- dangerLevel = "Seems like the danger level is broken!"
- break;
- }
-
- return dangerLevel;
-}
-
-export function Countries(){
- // eslint-disable-next-line react-hooks/rules-of-hooks
- const [showModal, setShowModal] = useState(false);
- const [selectedCountry, setSelectedCountry] = useState(null);
- const [selectedDangerLevel, setSelectedDangerLevel] = useState(null);
- const [selectedCountryHistory, setSelectedCountryHistory] = useState(null);
- const countries = countriesData.countries;
-
- return countries.map((country) => {
- let dangerLevel = getDangerLevel(country.danger);
-
- const settlementsList = country.settlements.map((settlement) => {
- return (
- <div key={settlement.name}>
- <h2 className="font-medium md:text-3xl text-xl">{settlement.name}</h2>
- <h2 className="text-base">{getDangerLevel(settlement.danger)}</h2>
- </div>
- )
- })
-
- return (
- <div key="countries" className="bg-center bg-no-repeat bg-[image:var(--image-url)] bg-gray-500 bg-blend-multiply" style={{'--image-url': `url(${country.image})`}} >
- <div className="sm:px-40 px-10 py-10 space-y-3">
- <h1 className="font-medium md:text-5xl text-3xl">{country.name}</h1>
- <h2 className="text-lg">{dangerLevel}</h2>
- <div className="space-y-3">{settlementsList}</div>
- <button className="transition duration-200 ease-in-out px-4 py-2 font-medium rounded-full bg-blue-600 hover:bg-blue-700 active:bg-blue-800" onClick={()=> {
- setSelectedCountry(country.name);
- setSelectedDangerLevel(dangerLevel)
- setSelectedCountryHistory(country.history)
- setShowModal(true)
- }}>Information</button>
- </div>
- <HistoryModal isVisible={showModal} onClose={() => setShowModal(false)} countries={selectedCountry} dangerLevel={selectedDangerLevel} history={selectedCountryHistory} />
- </div>
- )
- })
-}
diff --git a/components/updates/DateFormatter.js b/components/updates/DateFormatter.js
deleted file mode 100644
index 9e236d0..0000000
--- a/components/updates/DateFormatter.js
+++ /dev/null
@@ -1,9 +0,0 @@
-
-import { parseISO, format } from 'date-fns'
-
-const DateFormatter = (dateString) => {
- const date = parseISO(dateString)
- return <time dateTime={dateString}>{format(date, 'LLLL d, yyyy')}</time>
-}
-
-export default DateFormatter
diff --git a/components/updates/PostPreview.js b/components/updates/PostPreview.js
deleted file mode 100644
index ec9183d..0000000
--- a/components/updates/PostPreview.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import Link from "next/link";
-import DateFormatter from '@/components/updates/DateFormatter'
-
-export default function PostPreview(props) {
- return (
- <div key="post" className="bg-zinc-800 py-3 px-5 border border-gray-600 rounded-lg space-y-3">
- <Link href={`/updates/${props.slug}`}>
- <h2 className="font-medium text-2xl hover:underline">{props.title}</h2>
- </Link>
- <span className="text-sm">{props.author}</span>
- <p>{props.description}</p>
- <p className="font-medium text-sm">Posted on {DateFormatter(props.date)}</p>
- </div>
- )
-}
diff --git a/components/updates/getPostMetadata.js b/components/updates/getPostMetadata.js
deleted file mode 100644
index 515cc79..0000000
--- a/components/updates/getPostMetadata.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import {readdirSync, readFileSync} from "fs";
-import matter from "gray-matter";
-
-export default function getPostMetadata() {
- const folder = "posts/";
- const files = readdirSync(folder);
- const markdownPosts = files.filter((file) => file.endsWith(".md"));
-
- const posts = markdownPosts.map((fileName) => {
- const fileContent = readFileSync(`posts/${fileName}`, "utf-8");
- const matterResult = matter(fileContent);
- return {
- title: matterResult.data.title,
- author: matterResult.data.author,
- date: matterResult.data.date,
- description: matterResult.data.description,
- slug: fileName.replace(".md", "")
- }
- })
-
- // Sort the posts by date in descending order
- posts.sort((a, b) => new Date(b.date) - new Date(a.date));
- return posts
-}