diff --git a/src/Loader.tsx b/src/Loader.tsx deleted file mode 100644 index a728531..0000000 --- a/src/Loader.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React, { useEffect } from 'react'; -import App from './App'; - -import { ChakraProvider } from '@chakra-ui/react'; -import { Provider } from 'react-redux'; -import { theme } from './theme'; -import { persistSettings } from './features/settings/persistSettings'; -import type { AppStore } from './store'; - -export function Loader({ store }: { store: AppStore }) { - useEffect(() => { - return persistSettings(store); - }, [store]); - - return ( - - - - - - - - ); -} diff --git a/src/App.tsx b/src/components/App.tsx similarity index 87% rename from src/App.tsx rename to src/components/App.tsx index cf4640d..5abf092 100644 --- a/src/App.tsx +++ b/src/components/App.tsx @@ -1,7 +1,7 @@ import { Box, Center, Container } from '@chakra-ui/react'; import { SelectFile } from './SelectFile'; -import { FileListing } from './features/file-listing/FileListing'; +import { FileListing } from '~/features/file-listing/FileListing'; import { Footer } from './Footer'; function App() { diff --git a/src/components/AppRoot.tsx b/src/components/AppRoot.tsx new file mode 100644 index 0000000..70d1115 --- /dev/null +++ b/src/components/AppRoot.tsx @@ -0,0 +1,23 @@ +import { useEffect } from 'react'; +import App from './App'; + +import { ChakraProvider } from '@chakra-ui/react'; +import { Provider } from 'react-redux'; +import { theme } from '~/theme'; +import { persistSettings } from '~/features/settings/persistSettings'; +import { setupStore } from '~/store'; + +// Private to this file only. +const store = setupStore(); + +export function AppRoot() { + useEffect(() => persistSettings(store), []); + + return ( + + + + + + ); +} diff --git a/src/CurrentYear.tsx b/src/components/CurrentYear.tsx similarity index 100% rename from src/CurrentYear.tsx rename to src/components/CurrentYear.tsx diff --git a/src/Footer.tsx b/src/components/Footer.tsx similarity index 100% rename from src/Footer.tsx rename to src/components/Footer.tsx diff --git a/src/SDKVersion.tsx b/src/components/SDKVersion.tsx similarity index 100% rename from src/SDKVersion.tsx rename to src/components/SDKVersion.tsx diff --git a/src/SelectFile.tsx b/src/components/SelectFile.tsx similarity index 94% rename from src/SelectFile.tsx rename to src/components/SelectFile.tsx index 181c6fe..fc0fd78 100644 --- a/src/SelectFile.tsx +++ b/src/components/SelectFile.tsx @@ -2,8 +2,8 @@ import { useDropzone } from 'react-dropzone'; import { Box, Text } from '@chakra-ui/react'; import { UnlockIcon } from '@chakra-ui/icons'; -import { useAppDispatch } from './hooks'; -import { addNewFile, processFile } from './features/file-listing/fileListingSlice'; +import { useAppDispatch } from '~/hooks'; +import { addNewFile, processFile } from '~/features/file-listing/fileListingSlice'; import { nanoid } from 'nanoid'; export function SelectFile() { diff --git a/src/features/file-listing/FileListing.tsx b/src/features/file-listing/FileListing.tsx index 5211cbf..09bec14 100644 --- a/src/features/file-listing/FileListing.tsx +++ b/src/features/file-listing/FileListing.tsx @@ -1,7 +1,7 @@ import { VStack } from '@chakra-ui/react'; import { selectFiles } from './fileListingSlice'; -import { useAppSelector } from '../../hooks'; +import { useAppSelector } from '~/hooks'; import { FileRow } from './FileRow'; export function FileListing() { diff --git a/src/main.tsx b/src/main.tsx index 469e6dc..d72bd43 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,9 +1,10 @@ +import React from 'react'; import ReactDOM from 'react-dom/client'; -import { setupStore } from './store'; -import { Loader } from './Loader'; +import { AppRoot } from './components/AppRoot'; -// Private to this file only. -const store = setupStore(); - -ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(); +ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( + + + +);