remove most default exports

Author: spoeck

src/App.tsx

@@ -1,19 +1,18 @@
 // prettier-ignore
-import { AppBar, Badge, Divider, Drawer as DrawerMui, Hidden, IconButton, List, ListItem, ListItemIcon, ListItemText, Toolbar, Typography, withWidth, useMediaQuery } from "@material-ui/core";
+import { AppBar, Badge, Divider, Drawer as DrawerMui, Hidden, IconButton, List, ListItem, ListItemIcon, ListItemText, Toolbar, Typography, useMediaQuery } from "@material-ui/core";
 import { Theme } from "@material-ui/core/styles";
 import FormatListNumberedIcon from "@material-ui/icons/FormatListNumbered";
 import HomeIcon from "@material-ui/icons/Home";
 import MenuIcon from "@material-ui/icons/Menu";
-import { makeStyles, useTheme } from "@material-ui/styles";
+import { makeStyles } from "@material-ui/styles";
 import * as React from "react";
+import { useSelector } from "react-redux";
 import { Route, Router } from "react-router-dom";
 import { history } from "./configureStore";
 import { Todo } from "./model/model";
-import HomePage from "./pages/HomePage";
-import TodoPage from "./pages/TodoPage";
+import { HomePage, TodoPage } from "./pages";
 import { RootState } from "./reducers/index";
-import withRoot from "./withRoot";
-import { useSelector } from "react-redux";
+import { withRoot } from "./withRoot";
 
 function Routes() {
 	const classes = useStyles();

src/ReduxRoot.tsx

@@ -7,7 +7,7 @@ import configureStore from "./configureStore";
 
 const { persistor, store } = configureStore();
 
-function ReduxRoot() {
+export function ReduxRoot() {
 	return (
 		<Provider store={store}>
 			<PersistGate
@@ -19,5 +19,3 @@ function ReduxRoot() {
 		</Provider>
 	);
 }
-
-export default ReduxRoot;

src/components/HomeBox.tsx

@@ -6,9 +6,8 @@ interface Props {
 	color: "red" | "blue" | string;
 }
 
-function HomeBox(props: Props) {
+export function HomeBox(props: Props) {
 	const { size, ...other } = props;
-
 	const classes = useStyles(props);
 
 	return (
@@ -39,5 +38,3 @@ const useStyles = makeStyles((theme: Theme) => ({
 		color: "white",
 	},
 }));
-
-export default HomeBox;

src/components/TodoDialog.tsx

@@ -10,7 +10,7 @@ interface Props {
 	onClose: () => void;
 }
 
-function TodoDialog(props: Props) {
+export function TodoDialog(props: Props) {
 	const { open, onClose } = props;
 	const classes = useStyles();
 	const [newTodoText, setNewTodoText] = React.useState("");
@@ -57,5 +57,3 @@ const useStyles = makeStyles({
 		margin: 20,
 	},
 });
-
-export default TodoDialog;

src/components/TodoTable.tsx

@@ -9,7 +9,7 @@ import * as TodoActions from "../actions/todo";
 import { Todo } from "../model/model";
 import { RootState } from "../reducers";
 
-function TodoTable() {
+export function TodoTable() {
 	const classes = useStyles();
 	const todoList = useSelector((state: RootState) => state.todoList);
 	const todoActions = useActions(TodoActions);
@@ -74,5 +74,3 @@ const useStyles = makeStyles({
 		width: "100%",
 	},
 });
-
-export default TodoTable;

src/components/index.ts

@@ -1,5 +1,3 @@
-import TodoTable from "./TodoTable";
-
-export { TodoTable };
-
-export default TodoTable;
+export * from "./HomeBox";
+export * from "./TodoDialog";
+export * from "./TodoTable";

src/index.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import * as ReactDOM from "react-dom";
-import ReduxRoot from "./ReduxRoot";
+import { ReduxRoot } from "./ReduxRoot";
 
 const rootEl = document.getElementById("root");
 ReactDOM.render(<ReduxRoot />, rootEl);

src/pages/HomePage.tsx

@@ -2,11 +2,10 @@ import { Button, Typography } from "@material-ui/core";
 import { makeStyles } from "@material-ui/styles";
 import * as React from "react";
 import { useSelector } from "react-redux";
-import { RouteComponentProps } from "react-router-dom";
-import HomeBox from "../components/HomeBox";
+import { HomeBox } from "../components";
 import { RootState } from "../reducers";
 
-function HomePage() {
+export function HomePage() {
 	const classes = useStyles();
 	const [boxColor, setBoxColor] = React.useState("red");
 	const todoList = useSelector((state: RootState) => state.todoList);
@@ -56,5 +55,3 @@ const useStyles = makeStyles({
 		marginTop: 20,
 	},
 });
-
-export default HomePage;

src/pages/TodoPage.tsx

@@ -2,11 +2,9 @@ import { Button, Grid, Typography } from "@material-ui/core";
 import { Theme } from "@material-ui/core/styles";
 import { makeStyles } from "@material-ui/styles";
 import * as React from "react";
-import { RouteComponentProps } from "react-router-dom";
-import TodoTable from "../components";
-import TodoDialog from "../components/TodoDialog";
+import { TodoDialog, TodoTable } from "../components";
 
-function TodoPage() {
+export function TodoPage() {
 	const classes = useStyles();
 	const [open, setOpen] = React.useState(false);
 
@@ -65,5 +63,3 @@ const useStyles = makeStyles((theme: Theme) => ({
 		marginBottom: 15,
 	},
 }));
-
-export default TodoPage;

src/pages/index.ts

@@ -0,0 +1,2 @@
+export * from "./HomePage";
+export * from "./TodoPage";

src/withRoot.tsx

@@ -22,7 +22,7 @@ const theme = createMuiTheme({
 	},
 });
 
-function withRoot(Component: any) {
+export function withRoot(Component: any) {
 	function WithRoot(props: object) {
 		// MuiThemeProvider makes the theme available down the React tree
 		// thanks to React context.
@@ -37,5 +37,3 @@ function withRoot(Component: any) {
 
 	return WithRoot;
 }
-
-export default withRoot;