diff --git a/src/assets/tail-spin.svg b/src/assets/tail-spin.svg
new file mode 100644
index 0000000..8e86ce3
--- /dev/null
+++ b/src/assets/tail-spin.svg
@@ -0,0 +1,29 @@
+
\ No newline at end of file
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 1b2e560..8e4050b 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -1,8 +1,11 @@
import styled from 'styled-components';
import { Outlet, NavLink } from 'react-router-dom';
import '@wcj/dark-mode';
+import { useContext } from 'react';
import { ReactComponent as LogoIcon } from '../assets/logo.svg';
import { ReactComponent as GithubIcon } from '../assets/github.svg';
+import { ReactComponent as Loading } from '../assets/tail-spin.svg';
+import { Context } from '../store/context';
const Warpper = styled.div``;
@@ -75,6 +78,7 @@ const Section = styled.section`
`;
export function Layout() {
+ const { isLoading } = useContext(Context);
return (
@@ -84,6 +88,7 @@ export function Layout() {
微信公众号排版编辑器
v{VERSION}
+ {isLoading && }
首页
diff --git a/src/store/getMdSource.ts b/src/store/getMdSource.tsx
similarity index 51%
rename from src/store/getMdSource.ts
rename to src/store/getMdSource.tsx
index 7e6a54f..8aab251 100644
--- a/src/store/getMdSource.ts
+++ b/src/store/getMdSource.tsx
@@ -1,4 +1,10 @@
import { useQuery } from '@tanstack/react-query';
+import toast from 'react-hot-toast';
+import styled from 'styled-components';
+
+const Warpper = styled.div`
+ font-size: 0.8rem;
+`;
export const useMdSource = (url: string | null) => {
return useQuery(['database-list', url], () => {
@@ -7,6 +13,13 @@ export const useMdSource = (url: string | null) => {
.then((response) => response.text())
.then((data) => {
return data;
+ })
+ .catch((err) => {
+ toast.error(
+
+ 加载失败！请检查你的URL
+ ,
+ );
});
});
};