- {/*
- );
-};
-
-export default NftBadge;
diff --git a/apps/web/src/app/pages/component/StoreModal.tsx b/apps/web/src/app/pages/component/StoreModal.tsx
new file mode 100644
index 0000000..4c07cb9
--- /dev/null
+++ b/apps/web/src/app/pages/component/StoreModal.tsx
@@ -0,0 +1,52 @@
+import React from "react";
+
+interface ModalProps {
+ message: string | null;
+ onClose: () => void;
+}
+
+const Modal: React.FC- Total Bottles Submitted:{" "} - {totalBottles} -
*/} -
- {nftTargets.map((nft) => (
-
- 
-
- ))}
-
- {nft.name}
-Target: {nft.target} bottles
- -
+
+ );
+};
+
+export default Modal;
diff --git a/apps/web/src/app/pages/subPage/Challenges_page.tsx b/apps/web/src/app/pages/subPage/Challenges_page.tsx
index 9778163..b45b45c 100644
--- a/apps/web/src/app/pages/subPage/Challenges_page.tsx
+++ b/apps/web/src/app/pages/subPage/Challenges_page.tsx
@@ -1,63 +1,99 @@
"use client";
-import React from "react";
+import React, { useState } from "react";
import Footers from "../../pages/footer";
+const Modal = ({ show, onClose }: { show: boolean; onClose: () => void }) => {
+ if (!show) return null;
+
+ return (
+
+
+
+ {message}
+ +
+
+ );
+};
+
const Challenges = () => {
+ const [showModal, setShowModal] = useState(false);
+ const [isJoined1, setIsJoined_1] = useState(false);
+ const [isJoined2, setIsJoined_2] = useState(false);
+
+ const handleJoinChallenge1 = () => {
+ setShowModal(true);
+ setIsJoined_1(true);
+ setTimeout(() => {
+ setShowModal(false);
+ }, 2000);
+ };
+
+ const handleJoinChallenge2 = () => {
+ setShowModal(true);
+ setIsJoined_2(true);
+ setTimeout(() => {
+ setShowModal(false);
+ }, 2000);
+ };
+
return (
+
+
+ You have joined!
+ +
-
+
+ setShowModal(false)} />
);
diff --git a/apps/web/src/app/pages/subPage/Leaderboard_page.tsx b/apps/web/src/app/pages/subPage/Leaderboard_page.tsx
index 2b37426..78c83eb 100644
--- a/apps/web/src/app/pages/subPage/Leaderboard_page.tsx
+++ b/apps/web/src/app/pages/subPage/Leaderboard_page.tsx
@@ -69,12 +69,7 @@ const Leaderboard = () => {
-
-
-
+ - Weekly Bottle Challenge -
-- Participate in the weekly challenge and earn extra $XOTL - tokens by recycling more bottles! -
- -
+
+
+
- + Weekly Bottle Challenge +
++ Participate in the weekly challenge and earn extra $XOTL + tokens by recycling more bottles! +
+ +
-
- Monthly Recycling Marathon -
-- Collect and submit as many bottles as you can this month to - win big rewards! -
- +
+
+ Monthly Recycling Marathon +
++ Collect and submit as many bottles as you can this month to + win big rewards! +
+ +
-
+
| {index + 1} | -{entry.address} | -{entry.count} | +{index + 1} | +{entry.address} | +{entry.count} |