feat: added loader

client/package.json

@@ -28,6 +28,7 @@
     "@types/node": "20.4.8",
     "@types/react": "18.2.18",
     "@types/react-dom": "18.2.7",
+    "@uiball/loaders": "^1.3.0",
     "add": "^2.0.6",
     "clsx": "^2.0.0",
     "eslint": "8.46.0",

client/src/app/page.tsx

@@ -4,6 +4,7 @@ import { Flex, Typography, Skeleton } from '@/shared/ui';
 import { useGetScreenWidth } from '@/shared/lib';
 import { Crown } from '@/shared/assets';
 import { IUserRequest } from 'teameights-types';
+import { NewtonsCradle, RaceBy } from '@uiball/loaders';
 
 export default function Home() {
   const width = useGetScreenWidth();
@@ -31,6 +32,12 @@ export default function Home() {
       </Flex>
 
       <Crown width={70} height={70} />
+
+      <Flex direction='column' gap='200px' width='100%' justify='center' align='center'>
+        <NewtonsCradle size={50} speed={1.4} color='white' />
+
+        <RaceBy size={80} lineWeight={5} speed={1.4} color='#46A11B' />
+      </Flex>
     </>
   );
 }

client/yarn.lock

@@ -6005,6 +6005,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@uiball/loaders@npm:^1.3.0":
+  version: 1.3.0
+  resolution: "@uiball/loaders@npm:1.3.0"
+  peerDependencies:
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+  checksum: 99dae6e19efc8fc5c3db2c45972a7eb84e3ae4f38e8e2154782779ea2220034f3923760126bcdeffc9100df49bf2d5c2512fd864f59ff407224cfe432599ad38
+  languageName: node
+  linkType: hard
+
 "@webassemblyjs/ast@npm:1.11.6, @webassemblyjs/ast@npm:^1.11.5":
   version: 1.11.6
   resolution: "@webassemblyjs/ast@npm:1.11.6"
@@ -7617,6 +7627,7 @@ __metadata:
     "@types/react-modal": ^3.16.0
     "@typescript-eslint/eslint-plugin": ^6.3.0
     "@typescript-eslint/parser": ^6.3.0
+    "@uiball/loaders": ^1.3.0
     add: ^2.0.6
     clsx: ^2.0.0
     eslint: 8.46.0