1
0
Fork 1
mirror of https://github.com/thatmattlove/hyperglass.git synced 2026-04-18 22:08:27 +00:00
thatmattlove-hyperglass/hyperglass/ui/pages/index.tsx
2021-09-09 18:03:04 -07:00

55 lines
1.4 KiB
TypeScript

import Head from 'next/head';
import dynamic from 'next/dynamic';
import { Meta, Loading, If, LoadError } from '~/components';
import { HyperglassProvider } from '~/context';
import { useHyperglassConfig } from '~/hooks';
import { getFavicons } from '~/util';
import type { GetStaticProps } from 'next';
import type { FaviconComponent } from '~/types';
const Layout = dynamic<Dict>(() => import('~/components').then(i => i.Layout), {
loading: Loading,
});
interface TIndex {
favicons: FaviconComponent[];
}
const Index = (props: TIndex): JSX.Element => {
const { favicons } = props;
const { data, error, isLoading, ready, refetch, showError, isLoadingInitial } =
useHyperglassConfig();
return (
<>
<Head>
{favicons.map((icon, idx) => {
const { rel, href, type } = icon;
return <link rel={rel} href={href} type={type} key={idx} />;
})}
</Head>
<If c={isLoadingInitial}>
<Loading />
</If>
<If c={showError}>
<LoadError error={error!} retry={refetch} inProgress={isLoading} />
</If>
<If c={ready}>
<HyperglassProvider config={data!}>
<Meta />
<Layout />
</HyperglassProvider>
</If>
</>
);
};
export const getStaticProps: GetStaticProps<TIndex> = async () => {
const favicons = await getFavicons();
return {
props: { favicons },
};
};
export default Index;