Removed API's in favor of statically linked files
This commit is contained in:
parent
d484ffc0db
commit
17f86b4be4
7 changed files with 30 additions and 96 deletions
|
@ -1,13 +1,7 @@
|
|||
import { usePathname } from 'next/navigation'
|
||||
import { NavBar, NavLink, NavWrap } from './styles/navbar';
|
||||
import { StyleSelector, StyleSelectorPlaceholder } from './themeselector';
|
||||
|
||||
const navLinks = [
|
||||
{ name: "Home", href: "/" },
|
||||
{ name: "About", href: "/about" },
|
||||
{ name: "Games", href: "/games" },
|
||||
{ name: "Services", href: "/services" }
|
||||
]
|
||||
import Links from '../public/data/navbar.json';
|
||||
|
||||
const PageNavbar = () => {
|
||||
const path = usePathname();
|
||||
|
@ -16,8 +10,8 @@ const PageNavbar = () => {
|
|||
<NavWrap>
|
||||
<StyleSelector></StyleSelector>
|
||||
<NavBar>
|
||||
{navLinks.map((item) => (
|
||||
<NavLink active={path == item.href ? true : false} key={item.name} href={item.href}>
|
||||
{Links.links.map((item) => (
|
||||
<NavLink active={path === item.href ? +true : +false} key={item.name} href={item.href}>
|
||||
{item.name}
|
||||
</NavLink>
|
||||
))}
|
||||
|
|
|
@ -7,6 +7,7 @@ import { DefaultTheme, ThemeProvider } from 'styled-components';
|
|||
import { createContext, useContext, useEffect, useState } from 'react'
|
||||
import { darkTheme, GlobalStyle } from '../components/themes';
|
||||
import { getTheme } from '../components/themeselector';
|
||||
import Themes from '../public/data/themes.json';
|
||||
|
||||
export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
|
||||
getLayout?: (page: ReactElement) => ReactNode
|
||||
|
@ -16,8 +17,7 @@ export type AppPropsWithLayout = AppProps & {
|
|||
Component: NextPageWithLayout
|
||||
}
|
||||
|
||||
|
||||
const ThemeUpdateContext = createContext(
|
||||
export const ThemeUpdateContext = createContext(
|
||||
(theme: DefaultTheme) => console.error("attempted to set theme outside of a ThemeUpdateContext.Provider")
|
||||
)
|
||||
|
||||
|
@ -25,7 +25,9 @@ export const useUpdateTheme = () => useContext(ThemeUpdateContext);
|
|||
|
||||
|
||||
export default function Website({ Component, pageProps }: AppPropsWithLayout) {
|
||||
const loadedThemes = Themes.themes;
|
||||
const [selectedTheme, setselectedTheme] = useState(darkTheme);
|
||||
const [themes, setThemes] = useState(loadedThemes);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -34,10 +36,9 @@ export default function Website({ Component, pageProps }: AppPropsWithLayout) {
|
|||
// if theme data differs set it
|
||||
// if not just exit
|
||||
if (storedThemeIdTemp && parseInt(storedThemeIdTemp) !== selectedTheme.themeId) {
|
||||
setselectedTheme(getTheme(parseInt(storedThemeIdTemp)))
|
||||
setselectedTheme(getTheme(parseInt(storedThemeIdTemp), themes))
|
||||
}
|
||||
}, [selectedTheme])
|
||||
|
||||
}, [selectedTheme, themes])
|
||||
|
||||
// Use the layout defined at the page level, if available
|
||||
const getLayout = Component.getLayout ?? ((page) => (
|
||||
|
@ -46,11 +47,11 @@ export default function Website({ Component, pageProps }: AppPropsWithLayout) {
|
|||
return (
|
||||
<Fragment>
|
||||
<GlobalStyle />
|
||||
<ThemeProvider theme={selectedTheme}>
|
||||
<ThemeUpdateContext.Provider value={setselectedTheme}>
|
||||
{getLayout(<Component {...pageProps} />)}
|
||||
</ThemeUpdateContext.Provider>
|
||||
</ThemeProvider>
|
||||
<ThemeProvider theme={selectedTheme}>
|
||||
<ThemeUpdateContext.Provider value={setselectedTheme}>
|
||||
{getLayout(<Component {...pageProps} />)}
|
||||
</ThemeUpdateContext.Provider>
|
||||
</ThemeProvider>
|
||||
</Fragment>
|
||||
|
||||
)
|
||||
|
|
|
@ -1,21 +0,0 @@
|
|||
import fsPromises from 'fs/promises'
|
||||
import path from 'path'
|
||||
import { Service, Status } from '../../interfaces/CardTypes';
|
||||
|
||||
export default async function ServicesAPI(req: any, res: any) {
|
||||
try {
|
||||
const filePath = path.join(process.cwd(), '/public/pages.json')
|
||||
const data = await fsPromises.readFile(filePath)
|
||||
.then((file) => JSON.parse(file.toString()));
|
||||
data.services.forEach((service: Service) => {
|
||||
service.status = Status.loading;
|
||||
});
|
||||
|
||||
res.status(200).json(data.services);
|
||||
}
|
||||
catch (error) {
|
||||
console.log(error);
|
||||
res.status(500).json({ error: 'Error reading data' });
|
||||
}
|
||||
}
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import fsPromises from 'fs/promises'
|
||||
import path from 'path'
|
||||
|
||||
export default async function Navbar(req: any, res: any) {
|
||||
try {
|
||||
const filePath = path.join(process.cwd(), '/public/data/navbar.json')
|
||||
const jsonData = await fsPromises.readFile(filePath)
|
||||
const data = JSON.parse(jsonData.toString())
|
||||
res.status(200).json(data)
|
||||
}
|
||||
catch (error) {
|
||||
console.log(error)
|
||||
res.status(500).json({error: 'Error reading data'})
|
||||
}
|
||||
}
|
|
@ -1,15 +0,0 @@
|
|||
import fsPromises from 'fs/promises'
|
||||
import path from 'path'
|
||||
|
||||
export default async function Navbar(req: any, res: any) {
|
||||
try {
|
||||
const filePath = path.join(process.cwd(), '/public/data/themes.json')
|
||||
const jsonData = await fsPromises.readFile(filePath)
|
||||
const data = JSON.parse(jsonData.toString())
|
||||
res.status(200).json(data)
|
||||
}
|
||||
catch (error) {
|
||||
console.log(error)
|
||||
res.status(500).json({error: 'Error reading data'})
|
||||
}
|
||||
}
|
|
@ -1,12 +1,11 @@
|
|||
import Head from 'next/head'
|
||||
import fsPromises from 'fs/promises'
|
||||
import path from 'path'
|
||||
import { EntryList, Game } from '../interfaces/CardTypes';
|
||||
import { Game } from '../interfaces/CardTypes';
|
||||
import { PageContentBox, PageDescription, PageTitle, CardContentGame } from '../components/styles/content'
|
||||
import Link from 'next/link'
|
||||
import GameList from '../public/pages.json';
|
||||
|
||||
function Servers(props: EntryList) {
|
||||
const serverList = props.games
|
||||
function Servers() {
|
||||
// TODO: unuggly this shit
|
||||
const serverList: Game[] = JSON.parse(JSON.stringify(GameList.games));
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
|
@ -32,12 +31,4 @@ function Servers(props: EntryList) {
|
|||
)
|
||||
}
|
||||
|
||||
export async function getServerSideProps() {
|
||||
const filePath = path.join(process.cwd(), '/public/pages.json')
|
||||
const jsonData = await fsPromises.readFile(filePath)
|
||||
const list = JSON.parse(jsonData.toString())
|
||||
|
||||
return { props: list }
|
||||
}
|
||||
|
||||
export default Servers
|
|
@ -1,20 +1,19 @@
|
|||
import Head from 'next/head'
|
||||
import Link from 'next/link'
|
||||
import { Service, Status, ServiceType, ServiceLocation } from '../interfaces/CardTypes';
|
||||
import Dockerode from 'dockerode';
|
||||
import { ReactElement } from 'react'
|
||||
import useSWR from 'swr';
|
||||
import { PageCard, CardContentService, PageContentBox, PageDescription, PageTitle } from '../components/styles/content';
|
||||
import { CardContentService, PageContentBox, PageDescription, PageTitle } from '../components/styles/content';
|
||||
import ServiceList from '../public/pages.json';
|
||||
|
||||
const fetcher = (url: string) => fetch(url).then((res) => res.json())
|
||||
|
||||
function Services() {
|
||||
const { initialData, fullData, loadingInitial, loadingFull, error } = useServices();
|
||||
const { initialData, fullData, loadingFull, error } = useServices();
|
||||
|
||||
let content: ReactElement = <></>;
|
||||
|
||||
if (error) { content = <div>Error loading data</div> }
|
||||
else if (loadingInitial) { content = <div>Loading</div> }
|
||||
else if (loadingFull) {
|
||||
content =
|
||||
<PageContentBox>
|
||||
|
@ -22,7 +21,6 @@ function Services() {
|
|||
<CardContentService key={item.name} content={item} />
|
||||
))}
|
||||
</PageContentBox>
|
||||
|
||||
}
|
||||
else if (fullData) {
|
||||
content =
|
||||
|
@ -171,17 +169,18 @@ const fetchFullDataArray = (containerData: Dockerode.ContainerInfo[], dataSet: S
|
|||
|
||||
function useServices() {
|
||||
const { data: containerData, error: containerError } = useSWR('/api/containers', fetcher);
|
||||
const { data: initialData, error: initialError } = useSWR('/api/services', fetcher);
|
||||
const loadingInitial = !initialData && !initialError
|
||||
const { data: fullData, error: fullError } = useSWR((initialData && containerData) ? [containerData, initialData] : null, fetchFullDataArray)
|
||||
// TODO: unfuck this
|
||||
const initialData: Service[] = JSON.parse(JSON.stringify(ServiceList.services));
|
||||
initialData.forEach((service) => {
|
||||
if (service.status === undefined) service.status = Status.loading;
|
||||
})
|
||||
const { data: fullData, error: fullError } = useSWR((containerData) ? [containerData, initialData] : null, fetchFullDataArray)
|
||||
const loadingFull = !fullData && !fullError
|
||||
|
||||
return {
|
||||
initialData,
|
||||
fullData,
|
||||
loadingInitial,
|
||||
loadingFull,
|
||||
error: initialError || fullError || containerError,
|
||||
error: fullError || containerError,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue