refactor: adjust base components export

src/components/base/base-empty.tsx

@@ -6,7 +6,7 @@ interface Props {
   extra?: React.ReactNode;
 }
 
-const BaseEmpty = (props: Props) => {
+export const BaseEmpty = (props: Props) => {
   const { text = "Empty", extra } = props;
 
   return (
@@ -27,5 +27,3 @@ const BaseEmpty = (props: Props) => {
     </Box>
   );
 };
-
-export default BaseEmpty;

src/components/base/base-error-boundary.tsx

@@ -9,12 +9,10 @@ function ErrorFallback({ error }: FallbackProps) {
   );
 }
 
-const BaseErrorBoundary: React.FC = (props) => {
+export const BaseErrorBoundary: React.FC = (props) => {
   return (
     <ErrorBoundary FallbackComponent={ErrorFallback}>
       {props.children}
     </ErrorBoundary>
   );
 };
-
-export default BaseErrorBoundary;

src/components/base/base-loading.tsx

@@ -37,7 +37,7 @@ const LoadingItem = styled("div")(({ theme }) => ({
   background: theme.palette.text.secondary,
 }));
 
-const BaseLoading = () => {
+export const BaseLoading = () => {
   return (
     <Loading>
       <LoadingItem />
@@ -46,5 +46,3 @@ const BaseLoading = () => {
     </Loading>
   );
 };
-
-export default BaseLoading;

src/components/base/base-notice.tsx

@@ -69,7 +69,7 @@ interface NoticeInstance {
 let parent: HTMLDivElement = null!;
 
 // @ts-ignore
-const Notice: NoticeInstance = (props) => {
+export const Notice: NoticeInstance = (props) => {
   if (!parent) {
     parent = document.createElement("div");
     document.body.appendChild(parent);
@@ -91,5 +91,3 @@ const Notice: NoticeInstance = (props) => {
     setTimeout(() => Notice({ type, message, duration }), 0);
   };
 });
-
-export default Notice;

src/components/base/base-page.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { Typography } from "@mui/material";
-import BaseErrorBoundary from "./base-error-boundary";
+import { BaseErrorBoundary } from "./base-error-boundary";
 
 interface Props {
   title?: React.ReactNode; // the page title
@@ -8,7 +8,7 @@ interface Props {
   contentStyle?: React.CSSProperties;
 }
 
-const BasePage: React.FC<Props> = (props) => {
+export const BasePage: React.FC<Props> = (props) => {
   const { title, header, contentStyle, children } = props;
 
   return (
@@ -31,5 +31,3 @@ const BasePage: React.FC<Props> = (props) => {
     </BaseErrorBoundary>
   );
 };
-
-export default BasePage;

src/components/base/index.ts

@@ -1,2 +1,6 @@
 export { BaseDialog, type DialogRef } from "./base-dialog";
+export { BasePage } from "./base-page";
+export { BaseEmpty } from "./base-empty";
+export { BaseLoading } from "./base-loading";
+export { BaseErrorBoundary } from "./base-error-boundary";
 export { Notice } from "./base-notice";