- {pendingCount > 0 && (
-
+ {checkerDetails.pendingCount > 0 && (
+
)}
{/* {reviewCount > 0 && (
diff --git a/checkers-app/src/components/myvotes/MessagesDisplay.tsx b/checkers-app/src/components/myvotes/MessagesDisplay.tsx
index bd260331..93d28145 100644
--- a/checkers-app/src/components/myvotes/MessagesDisplay.tsx
+++ b/checkers-app/src/components/myvotes/MessagesDisplay.tsx
@@ -26,7 +26,7 @@ import { VoteSummary, VoteSummaryApiResponse } from "../../types";
import Pagination from "./Pagination"; // Make sure to create this component
const MessagesDisplay: FC = () => {
- const { checkerId } = useUser();
+ const { checkerDetails } = useUser();
const [isLoading, setIsLoading] = useState(false);
const [votes, setVotes] = useState
([]);
const [lastPath, setLastPath] = useState(null);
@@ -39,11 +39,11 @@ const MessagesDisplay: FC = () => {
const fetchMessages = async () => {
setIsLoading(true);
try {
- if (!checkerId) {
+ if (!checkerDetails.checkerId) {
throw new Error("Checker Id missing.");
}
const response: VoteSummaryApiResponse = await getCheckerVotes(
- checkerId,
+ checkerDetails.checkerId,
activeTab.toLowerCase(),
5,
lastPath
@@ -60,10 +60,10 @@ const MessagesDisplay: FC = () => {
setIsLoading(false);
}
};
- if (checkerId) {
+ if (checkerDetails.checkerId) {
fetchMessages();
}
- }, [checkerId, activeTab, currentPage]);
+ }, [checkerDetails.checkerId, activeTab, currentPage]);
const handleTabChange = (tab: "pending" | "voted") => {
setActiveTab(tab);
diff --git a/checkers-app/src/components/vote/CustomReply.tsx b/checkers-app/src/components/vote/CustomReply.tsx
new file mode 100644
index 00000000..a7d93d9e
--- /dev/null
+++ b/checkers-app/src/components/vote/CustomReply.tsx
@@ -0,0 +1,121 @@
+import React, { useState, useEffect } from "react";
+import { Alert } from "@material-tailwind/react";
+import { useNavigate } from "react-router-dom";
+import {
+ getMessage,
+ postCustomReply,
+ sendWhatsappTestMessage,
+} from "../../services/api";
+import { useUser } from "../../providers/UserContext";
+
+interface PropType {
+ messageId: string | undefined;
+}
+
+export default function CustomReply(Prop: PropType) {
+ //load props
+ const navigate = useNavigate();
+ const { messageId } = Prop;
+ const { checkerDetails } = useUser();
+ const [customReplyText, setCustomReplyText] = useState("");
+ const [showAlerts, setShowAlerts] = useState(false);
+
+ useEffect(() => {
+ const fetchMessage = async () => {
+ if (messageId) {
+ const message = await getMessage(messageId);
+ if (message.customReply) {
+ setCustomReplyText(message?.customReply?.text ?? "");
+ } else {
+ setCustomReplyText("");
+ }
+ }
+ };
+ if (messageId) {
+ fetchMessage();
+ }
+ }, []);
+
+ const handleInputChange = (event: React.ChangeEvent) => {
+ setCustomReplyText(event.target.value);
+ };
+
+ const handleSubmit = () => {
+ // Implement what happens when the comment is posted (e.g., send to a server)
+ if (checkerDetails.checkerId && customReplyText && messageId) {
+ postCustomReply(
+ messageId,
+ checkerDetails.checkerId,
+ customReplyText
+ ).then(() => {
+ console.log("Custom reply posted successfully");
+ navigate("/votes");
+ });
+ }
+ };
+
+ const handleWhatsappTest = () => {
+ if (checkerDetails.checkerId && customReplyText) {
+ sendWhatsappTestMessage(checkerDetails.checkerId, customReplyText)
+ .then((data) => {
+ console.log(data);
+ console.log("Test is successfull");
+ setShowAlerts(false);
+ })
+ .catch((error) => {
+ console.error(error);
+ setShowAlerts(true);
+ });
+ }
+ };
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ {showAlerts && (
+
setShowAlerts(false)}
+ >
+ A dismissible alert for showing message.
+
+ )}
+
+
+ );
+}
diff --git a/checkers-app/src/components/vote/index.tsx b/checkers-app/src/components/vote/index.tsx
index c4e6657a..81e4f014 100644
--- a/checkers-app/src/components/vote/index.tsx
+++ b/checkers-app/src/components/vote/index.tsx
@@ -1,6 +1,6 @@
import VoteCategories from "./VoteCategories";
import MessageCard from "./MessageCard";
-import { Typography } from "@material-tailwind/react";
+import { Typography, Alert } from "@material-tailwind/react";
import { BackButton } from "../common/BackButton";
import { useEffect, useState } from "react";
import { useParams } from "react-router-dom";
@@ -11,9 +11,10 @@ import { getVote } from "../../services/api";
import CategoryRationalisation from "./Rationalisation";
import VoteResult from "./VoteResult";
import VotingChart from "./VotingChart";
+import CustomReply from "./CustomReply";
export default function VotePage() {
- const { checkerId } = useUser();
+ const { checkerDetails } = useUser();
const { messageId, voteRequestId } = useParams();
const [isLoading, setIsLoading] = useState(false);
const [vote, setVote] = useState(null);
@@ -28,10 +29,10 @@ export default function VotePage() {
setIsLoading(false);
};
- if (messageId && voteRequestId && checkerId) {
+ if (messageId && voteRequestId && checkerDetails.checkerId) {
fetchVote();
}
- }, [checkerId]);
+ }, [checkerDetails.checkerId]);
if (isLoading) {
return ;
@@ -58,6 +59,7 @@ export default function VotePage() {
imageUrl={vote.signedImageUrl}
caption={vote.caption}
/>
+ Sender: {vote.sender}
{vote.category === null || !vote.isAssessed ? (
<>
>
)}
+ {checkerDetails.tier === "expert" && (
+
+ )}
>
);
diff --git a/checkers-app/src/pages/Onboarding.tsx b/checkers-app/src/pages/Onboarding.tsx
index 7e4f39d4..b76be396 100644
--- a/checkers-app/src/pages/Onboarding.tsx
+++ b/checkers-app/src/pages/Onboarding.tsx
@@ -4,6 +4,7 @@ import { router } from "../App";
import { useUpdateFactChecker } from "../services/mutations";
import { sendOTP, checkOTP } from "../services/api";
import { signInWithToken, signOut } from "../utils/authManagement";
+import { Alert, Button } from "@material-tailwind/react";
import PhoneInput from "react-phone-number-input";
const NameForm = ({
@@ -120,8 +121,7 @@ const steps: { [key: number]: JSX.Element } = {
const numberOfSteps = Object.keys(steps).length;
const Onboarding = () => {
- const { authScopes } = useUser();
- const { setCheckerId, setCheckerName } = useUser();
+ const { setCheckerDetails, authScopes } = useUser();
const [whatsappId, setWhatsappId] = useState("");
const [isOTPSent, setIsOTPSent] = useState(false);
const [isOTPValidated, setIsOTPValidated] = useState(false);
@@ -134,6 +134,7 @@ const Onboarding = () => {
const [checkerId, updateCheckerId] = useState(authScopes?.checkerId ?? "");
const [name, setName] = useState(authScopes?.name ?? "");
const [currentStep, setCurrentStep] = useState(1);
+ const [showAlerts, setShowAlerts] = useState(false);
const sendWhatsappOTP = () => {
// Here you would add the logic to actually verify the phone number, probably by sending an API request
@@ -157,33 +158,37 @@ const Onboarding = () => {
//only for existing checkers
const customToken = data?.customToken;
const updatedCheckerId = data?.checkerId;
+ const isAdmin = data?.isAdmin;
+ const tier = data?.tier;
if (!customToken || !updatedCheckerId) {
throw new Error("Custom token or checkerId not found in response");
}
- console.log("202");
updateCheckerId(updatedCheckerId);
setCustomAuthToken(customToken);
signOut().then(() => {
- signInWithToken(
- customToken,
- setCheckerId,
- setCheckerName,
- updatedCheckerId,
- name
- ).then(() => {
- console.log("Sign-in successful");
+ signInWithToken(customToken).then(() => {
+ setCheckerDetails((currentChecker) => ({
+ ...currentChecker,
+ checkerId: updatedCheckerId,
+ checkerName: name,
+ isAdmin: isAdmin ?? false,
+ tier: tier ?? "beginner",
+ }));
+ handleOnCompleteOnboarding(updatedCheckerId); //immediately complete onboarding
});
});
}
setIsOTPValidated(true);
+ setShowAlerts(false);
console.log("OTP checked");
})
.catch((error) => {
console.error("Error checking OTP", error);
+ setShowAlerts(true);
});
};
- const handleOnCompleteOnboarding = () => {
+ const handleOnCompleteOnboarding = (checkerId: string) => {
if (!checkerId) {
throw new Error("Checker ID not found");
}
@@ -212,15 +217,14 @@ const Onboarding = () => {
try {
if (customAuthToken) {
signOut().then(() => {
- signInWithToken(
- customAuthToken,
- setCheckerId,
- setCheckerName,
- checkerId,
- name
- ).then(() => {
- console.log("Sign-in successful");
+ signInWithToken(customAuthToken).then(() => {
+ setCheckerDetails((currentChecker) => ({
+ ...currentChecker,
+ checkerId: checkerId,
+ checkerName: name,
+ }));
router.navigate("/");
+ router.navigate(0);
});
});
}
@@ -283,25 +287,32 @@ const Onboarding = () => {
>
Submit
+ {showAlerts && (
+