69 lines
2.0 KiB
TypeScript
69 lines
2.0 KiB
TypeScript
import { Flex, HStack, Icon, IconButton, Link, Spacer, Text } from '@chakra-ui/react';
|
|
import React, { Suspense, useState } from 'react';
|
|
import { SkipNavContent, SkipNavLink } from '@chakra-ui/skip-nav';
|
|
|
|
import { Book } from './scripts/searcher';
|
|
import BooksView from './components/BooksView';
|
|
import ColorModeSwitch from './components/ColorModeSwitch';
|
|
import ExternalLink from './components/ExternalLink';
|
|
import { FaGit } from 'react-icons/fa';
|
|
import Footer from './components/Footer';
|
|
import Header from './components/Header';
|
|
import LanguageSwitch from './components/LanguageSwitch';
|
|
import Search from './components/Search';
|
|
import { repository } from '../package.json';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
const Main: React.FC = () => {
|
|
const [books, setBooks] = useState<Book[]>([]);
|
|
return (
|
|
<>
|
|
<SkipNavContent />
|
|
<Search setBooks={setBooks} />
|
|
<BooksView books={books} />
|
|
</>
|
|
);
|
|
};
|
|
|
|
const Settings =
|
|
import.meta.env.VITE_TAURI === '1'
|
|
? React.lazy(() => import('./components/Settings-tauri'))
|
|
: React.lazy(() => import('./components/Settings'));
|
|
|
|
const App: React.FC = () => {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Flex direction="column" minH="100vh">
|
|
<SkipNavLink>Skip to content</SkipNavLink>
|
|
<Header title="Millelibri">
|
|
<HStack spacing={{ base: 1, md: 2 }}>
|
|
<IconButton
|
|
as={ExternalLink}
|
|
aria-label={t('nav.repository')}
|
|
title={t('nav.repository') ?? ''}
|
|
href={repository}
|
|
variant="ghost"
|
|
icon={<Icon as={FaGit} boxSize={5} />}
|
|
/>
|
|
<LanguageSwitch />
|
|
<ColorModeSwitch />
|
|
{/* <Suspense>
|
|
<Settings />
|
|
</Suspense> */}
|
|
</HStack>
|
|
</Header>
|
|
|
|
<Main />
|
|
|
|
<Spacer />
|
|
<Footer>
|
|
<Link href='https://www.lamacchinadesiderante.org' isExternal>lamacchinadesiderante.org</Link>
|
|
<Text fontSize='xs'>powered by Book Searcher</Text>
|
|
</Footer>
|
|
</Flex>
|
|
);
|
|
};
|
|
|
|
export default App;
|