From ce2cdfd4091a4ee03f4bd0ede81354fc12bc89c5 Mon Sep 17 00:00:00 2001 From: Nikolai R Kristiansen Date: Sun, 17 Apr 2022 16:59:00 +0200 Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=20Code=20split=20routes?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 4 +- frontend/src/App.tsx | 1 - frontend/src/Routes.tsx | 46 ++++++++++---------- frontend/src/components/Splash.tsx | 3 +- frontend/src/features/auth/UserCreate.tsx | 3 +- frontend/src/features/deposit/Deposit.tsx | 3 +- frontend/src/features/log/Log.tsx | 3 +- frontend/src/features/register/Register.tsx | 3 +- frontend/src/features/stats/OrderStats.tsx | 3 +- frontend/src/features/stats/ProductStats.tsx | 3 +- frontend/src/features/stats/Stats.tsx | 3 +- frontend/src/features/users/UserDetail.tsx | 3 +- frontend/src/features/users/UserList.tsx | 3 +- 13 files changed, 46 insertions(+), 35 deletions(-) diff --git a/.gitignore b/.gitignore index c9f4466..e52fd27 100644 --- a/.gitignore +++ b/.gitignore @@ -11,6 +11,6 @@ CACHE/ media/ tmp/ frontend/dist -static/modern +static/ .python-version -.env \ No newline at end of file +.env diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index faa680a..001b9d4 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -7,7 +7,6 @@ import { Routes } from "./Routes"; import client from "./client"; import { Footer } from "./components/Footer"; import { Header } from "./components/Header"; -import { Splash as Splash } from "./components/Splash"; import { Toast } from "./components/Toast"; import { ToastProvider } from "./components/ToastProvider"; import { Wireframe } from "./components/Wireframe"; diff --git a/frontend/src/Routes.tsx b/frontend/src/Routes.tsx index 919fd78..fdcc504 100644 --- a/frontend/src/Routes.tsx +++ b/frontend/src/Routes.tsx @@ -1,28 +1,30 @@ import React from "react"; import { Route, Routes as ReactRouterRoutes } from "react-router-dom"; -import { Splash } from "./components/Splash"; -import { UserCreate } from "./features/auth/UserCreate"; -import { Deposit } from "./features/deposit/Deposit"; -import { Log } from "./features/log/Log"; -import { Register } from "./features/register/Register"; -import { OrderStats } from "./features/stats/OrderStats"; -import { ProductStats } from "./features/stats/ProductStats"; -import { Stats } from "./features/stats/Stats"; -import { UserDetail } from "./features/users/UserDetail"; -import { UserList } from "./features/users/UserList"; +const Splash = React.lazy(() => import("./components/Splash")); +const UserCreate = React.lazy(() => import("./features/auth/UserCreate")); +const Deposit = React.lazy(() => import("./features/deposit/Deposit")); +const Log = React.lazy(() => import("./features/log/Log")); +const Register = React.lazy(() => import("./features/register/Register")); +const OrderStats = React.lazy(() => import("./features/stats/OrderStats")); +const ProductStats = React.lazy(() => import("./features/stats/ProductStats")); +const Stats = React.lazy(() => import("./features/stats/Stats")); +const UserDetail = React.lazy(() => import("./features/users/UserDetail")); +const UserList = React.lazy(() => import("./features/users/UserList")); export const Routes = (): JSX.Element => ( - - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - + Loading...}> + + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + + ); diff --git a/frontend/src/components/Splash.tsx b/frontend/src/components/Splash.tsx index 7b63825..ca56203 100644 --- a/frontend/src/components/Splash.tsx +++ b/frontend/src/components/Splash.tsx @@ -8,7 +8,7 @@ interface SplashProps { noOverlay?: boolean; } -export const Splash = ({ brandText = "BBS", noOverlay = false }: SplashProps): JSX.Element => ( +const Splash = ({ brandText = "BBS", noOverlay = false }: SplashProps): JSX.Element => (
@@ -17,3 +17,4 @@ export const Splash = ({ brandText = "BBS", noOverlay = false }: SplashProps): J
); +export default Splash; diff --git a/frontend/src/features/auth/UserCreate.tsx b/frontend/src/features/auth/UserCreate.tsx index e0fddda..16848aa 100644 --- a/frontend/src/features/auth/UserCreate.tsx +++ b/frontend/src/features/auth/UserCreate.tsx @@ -11,7 +11,7 @@ type FormValues = { email: string; }; -export const UserCreate = () => { +const UserCreate = () => { const { register, handleSubmit, @@ -48,3 +48,4 @@ export const UserCreate = () => { ); }; +export default UserCreate; diff --git a/frontend/src/features/deposit/Deposit.tsx b/frontend/src/features/deposit/Deposit.tsx index 8bd05b5..1503383 100644 --- a/frontend/src/features/deposit/Deposit.tsx +++ b/frontend/src/features/deposit/Deposit.tsx @@ -4,7 +4,7 @@ import { UserCard } from "../users/UserCard"; import styles from "./Deposit.module.css"; import { useDeposit } from "./useDeposit"; -export const Deposit = (): JSX.Element => { +const Deposit = (): JSX.Element => { const { loading, selectedUser, @@ -65,3 +65,4 @@ export const Deposit = (): JSX.Element => { ); }; +export default Deposit; diff --git a/frontend/src/features/log/Log.tsx b/frontend/src/features/log/Log.tsx index 22611cc..24f8bef 100644 --- a/frontend/src/features/log/Log.tsx +++ b/frontend/src/features/log/Log.tsx @@ -9,7 +9,7 @@ import styles from "./Log.module.css"; const PAGE_SIZE = 10; -export const Log = () => { +const Log = () => { const types = { orderOffset: Number, transactionOffset: Number, @@ -139,3 +139,4 @@ export const Log = () => { ); }; +export default Log; diff --git a/frontend/src/features/register/Register.tsx b/frontend/src/features/register/Register.tsx index 0de885c..2103077 100644 --- a/frontend/src/features/register/Register.tsx +++ b/frontend/src/features/register/Register.tsx @@ -8,7 +8,7 @@ import { useRegister } from "./useRegister"; const USER_EXTERNAL = "external"; -export const Register = (): JSX.Element => { +const Register = (): JSX.Element => { const { users, products, @@ -80,3 +80,4 @@ export const Register = (): JSX.Element => { ); }; +export default Register; diff --git a/frontend/src/features/stats/OrderStats.tsx b/frontend/src/features/stats/OrderStats.tsx index 3368edd..41fa2d6 100644 --- a/frontend/src/features/stats/OrderStats.tsx +++ b/frontend/src/features/stats/OrderStats.tsx @@ -35,7 +35,7 @@ const OrderBar = ({ data }: { data: BarDatum[] }) => ( /> ); -export const OrderStats = () => { +const OrderStats = () => { const { data, loading } = useQuery(OrderStatsDocument); return ( @@ -77,3 +77,4 @@ export const OrderStats = () => { ); }; +export default OrderStats; diff --git a/frontend/src/features/stats/ProductStats.tsx b/frontend/src/features/stats/ProductStats.tsx index 9bb7f6a..55a2b9b 100644 --- a/frontend/src/features/stats/ProductStats.tsx +++ b/frontend/src/features/stats/ProductStats.tsx @@ -11,7 +11,7 @@ type UserCount = { count: number; }; -export const ProductStats = () => { +const ProductStats = () => { const { data, loading } = useQuery(AllProductStatsDocument, { variables: { active: true }, }); @@ -38,3 +38,4 @@ export const ProductStats = () => { ); }; +export default ProductStats; diff --git a/frontend/src/features/stats/Stats.tsx b/frontend/src/features/stats/Stats.tsx index 371d75a..9163eb8 100644 --- a/frontend/src/features/stats/Stats.tsx +++ b/frontend/src/features/stats/Stats.tsx @@ -5,7 +5,7 @@ import React from "react"; import { ProductStatsDocument } from "../../types"; import { StatsView } from "./StatsView"; -export const Stats = () => { +const Stats = () => { const { data, loading } = useQuery(ProductStatsDocument); const series: any[] = []; @@ -68,3 +68,4 @@ export const Stats = () => { ); }; +export default Stats; diff --git a/frontend/src/features/users/UserDetail.tsx b/frontend/src/features/users/UserDetail.tsx index c300eeb..6769fcc 100644 --- a/frontend/src/features/users/UserDetail.tsx +++ b/frontend/src/features/users/UserDetail.tsx @@ -7,7 +7,7 @@ import { User, UserDetailDocument, UserProfile } from "../../types"; import { formatMonth, formatTime } from "../../utils/time"; import styles from "./UserDetail.module.css"; -export const UserDetail = () => { +const UserDetail = () => { const { userId } = useParams(); const { data, loading } = useQuery(UserDetailDocument, { variables: { userId: userId || "" }, skip: !userId }); @@ -108,3 +108,4 @@ export const UserDetail = () => { ); }; +export default UserDetail; diff --git a/frontend/src/features/users/UserList.tsx b/frontend/src/features/users/UserList.tsx index d68e9f1..c2175b3 100644 --- a/frontend/src/features/users/UserList.tsx +++ b/frontend/src/features/users/UserList.tsx @@ -5,7 +5,7 @@ import { Link } from "react-router-dom"; import { AllUsersDocument } from "../../types"; import { activeUserFilter } from "../../utils/users"; -export const UserList = () => { +const UserList = () => { const { data, loading } = useQuery(AllUsersDocument); const [showAll, setShowAll] = useState(false); @@ -35,3 +35,4 @@ export const UserList = () => { ); }; +export default UserList;