diff --git a/package-lock.json b/package-lock.json
index cb0c8c0..b5245eb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7,7 +7,6 @@
"": {
"name": "xbu",
"version": "0.0.0",
- "hasInstallScript": true,
"license": "MIT",
"dependencies": {
"@chakra-ui/react": "2.8.2",
@@ -15,6 +14,7 @@
"@emotion/styled": "11.13.0",
"@tanstack/react-query": "5.51.11",
"@tanstack/react-query-devtools": "5.51.11",
+ "atropos": "2.0.2",
"chakra-react-select": "4.9.1",
"firebase": "10.12.4",
"framer-motion": "11.3.8",
@@ -5074,6 +5074,14 @@
"node": ">= 4.0.0"
}
},
+ "node_modules/atropos": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/atropos/-/atropos-2.0.2.tgz",
+ "integrity": "sha512-8f0u0hEOlBTWTSvzY17TcHuQjxUIpkTBq70/I4+UF5B43ORtOoRjm8TPBYEgLM8Ba9AWf6PDtkagbYoybdjaKg==",
+ "engines": {
+ "node": ">= 12.0.0"
+ }
+ },
"node_modules/available-typed-arrays": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
@@ -17189,6 +17197,11 @@
"integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==",
"dev": true
},
+ "atropos": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/atropos/-/atropos-2.0.2.tgz",
+ "integrity": "sha512-8f0u0hEOlBTWTSvzY17TcHuQjxUIpkTBq70/I4+UF5B43ORtOoRjm8TPBYEgLM8Ba9AWf6PDtkagbYoybdjaKg=="
+ },
"available-typed-arrays": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
diff --git a/package.json b/package.json
index 309df7c..0d67b6d 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
"@emotion/styled": "11.13.0",
"@tanstack/react-query": "5.51.11",
"@tanstack/react-query-devtools": "5.51.11",
+ "atropos": "2.0.2",
"chakra-react-select": "4.9.1",
"firebase": "10.12.4",
"framer-motion": "11.3.8",
diff --git a/src/pages/Book.tsx b/src/pages/Book.tsx
index b060ab8..1df43cd 100644
--- a/src/pages/Book.tsx
+++ b/src/pages/Book.tsx
@@ -23,6 +23,8 @@ import {
import { BsTag } from 'react-icons/bs';
import { FaCheckCircle } from 'react-icons/fa';
import LazyLoad from 'react-lazy-load';
+import Atropos from 'atropos/react';
+import 'atropos/css';
import { useBook, useDeleteBook } from '@hooks/queries';
import { handleImageLoad } from '@utils/utils';
@@ -453,19 +455,30 @@ export default function Book() {
zIndex='1'
>
-
+
+
+