feat: add Loading component

gui/package.json

@@ -13,6 +13,7 @@
     "@tauri-apps/api": "^1.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^4.8.0",
     "react-router-dom": "^6.8.2"
   },
   "devDependencies": {

gui/pnpm-lock.yaml

@@ -11,6 +11,7 @@ specifiers:
   postcss: ^8.4.21
   react: ^18.2.0
   react-dom: ^18.2.0
+  react-icons: ^4.8.0
   react-router-dom: ^6.8.2
   tailwindcss: ^3.2.7
   typescript: ^4.9.5
@@ -21,6 +22,7 @@ dependencies:
   '@tauri-apps/api': 1.2.0
   react: 18.2.0
   react-dom: 18.2.0_react@18.2.0
+  react-icons: 4.8.0_react@18.2.0
   react-router-dom: 6.8.2_biqbaboplfbrettd7655fr4n2y
 
 devDependencies:
@@ -1191,6 +1193,14 @@ packages:
       scheduler: 0.23.0
     dev: false
 
+  /react-icons/4.8.0_react@18.2.0:
+    resolution: {integrity: sha512-N6+kOLcihDiAnj5Czu637waJqSnwlMNROzVZMhfX68V/9bu9qHaMIJC4UdozWoOk57gahFCNHwVvWzm0MTzRjg==}
+    peerDependencies:
+      react: '*'
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /react-refresh/0.14.0:
     resolution: {integrity: sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==}
     engines: {node: '>=0.10.0'}

gui/src/components/Loading.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+import { AiOutlineLoading3Quarters } from 'react-icons/ai';
+
+type LoadingProps = {
+}
+
+export const Loading: React.FC<LoadingProps> = ({ }) => {
+  return <AiOutlineLoading3Quarters className='animate-spin my-2 mx-auto' />
+}

gui/src/pages/Home.tsx

@@ -1,7 +1,8 @@
+import { Loading } from 'components/Loading'
 import React from 'react'
 
 export const Home: React.FC = ({ }) => {
   return <>
-    Hello world!
+    Hello world!  <Loading />
   </>
 }