From 54784f0150b179edfb86c42e32d7caf51d965335 Mon Sep 17 00:00:00 2001 From: Kakabay <2kakabayashyrberdyew@gmail.com> Date: Tue, 15 Oct 2024 12:11:25 +0500 Subject: [PATCH] routes fixed --- .../vote/{active => }/[vote_id]/page.tsx | 0 components/vote/ParticipantsList.tsx | 130 ++++++++++-------- 2 files changed, 76 insertions(+), 54 deletions(-) rename app/(main)/vote/{active => }/[vote_id]/page.tsx (100%) diff --git a/app/(main)/vote/active/[vote_id]/page.tsx b/app/(main)/vote/[vote_id]/page.tsx similarity index 100% rename from app/(main)/vote/active/[vote_id]/page.tsx rename to app/(main)/vote/[vote_id]/page.tsx diff --git a/components/vote/ParticipantsList.tsx b/components/vote/ParticipantsList.tsx index 6903f54..defe4ca 100644 --- a/components/vote/ParticipantsList.tsx +++ b/components/vote/ParticipantsList.tsx @@ -1,18 +1,18 @@ -'use client'; -import React, { useContext, useEffect, useState } from 'react'; -import GradientTitle from './GradientTitle'; -import ParticipantCard from './ParticipantCard'; -import { v4 } from 'uuid'; -import { IAllVotes, VotingItem } from '@/models/allVotes.model'; -import { Queries } from '@/api/queries'; -import Loader from '../Loader'; -import VoteContext from '@/context/VoteContext'; -import PageBage from './PageBage'; -import Image from 'next/image'; -import { useMediaQuery } from 'usehooks-ts'; -import Countdown from './Countdown'; -import Link from 'next/link'; -import { AnimatePresence } from 'framer-motion'; +"use client"; +import React, { useContext, useEffect, useState } from "react"; +import GradientTitle from "./GradientTitle"; +import ParticipantCard from "./ParticipantCard"; +import { v4 } from "uuid"; +import { IAllVotes, VotingItem } from "@/models/allVotes.model"; +import { Queries } from "@/api/queries"; +import Loader from "../Loader"; +import VoteContext from "@/context/VoteContext"; +import PageBage from "./PageBage"; +import Image from "next/image"; +import { useMediaQuery } from "usehooks-ts"; +import Countdown from "./Countdown"; +import Link from "next/link"; +import { AnimatePresence } from "framer-motion"; interface IParams { vote_id?: string; @@ -37,7 +37,7 @@ const ParticipantsList = ({ vote_id }: IParams) => { const [socket, setSocket] = useState(null); const [isConnected, setIsConnected] = useState(false); - const mobile = useMediaQuery('(max-width: 768px)'); + const mobile = useMediaQuery("(max-width: 768px)"); const { setVoteDescription } = useContext(VoteContext).voteDescriptionContext; @@ -72,21 +72,23 @@ const ParticipantsList = ({ vote_id }: IParams) => { const connectWebSocket = () => { try { - socket = new WebSocket(`wss://sms.turkmentv.gov.tm/ws/voting?dst=${smsNumber}`); + socket = new WebSocket( + `wss://sms.turkmentv.gov.tm/ws/voting?dst=${smsNumber}` + ); setSocket(socket); socket.onopen = () => { - console.log('WebSocket is connected'); + console.log("WebSocket is connected"); setIsConnected(true); // addVotes(); pingInterval = setInterval(() => { if (socket?.readyState === WebSocket.OPEN) { try { - socket.send(JSON.stringify({ type: 'ping' })); + socket.send(JSON.stringify({ type: "ping" })); // addVotes(); } catch (error) { - console.error('Error sending ping:', error); + console.error("Error sending ping:", error); } } }, 25000); // Ping every 25 seconds @@ -94,20 +96,20 @@ const ParticipantsList = ({ vote_id }: IParams) => { socket.onmessage = (event) => { try { - console.log('Message received from WebSocket:', event.data); + console.log("Message received from WebSocket:", event.data); const message = JSON.parse(event.data); handleWebSocketMessage(message); } catch (error) { - console.error('Error processing message:', error); + console.error("Error processing message:", error); } }; socket.onerror = (error) => { - console.error('WebSocket error:', error); + console.error("WebSocket error:", error); }; socket.onclose = () => { - console.log('WebSocket is closed'); + console.log("WebSocket is closed"); setIsConnected(false); if (pingInterval) { @@ -116,13 +118,13 @@ const ParticipantsList = ({ vote_id }: IParams) => { if (!reconnectTimeout) { reconnectTimeout = setTimeout(() => { - console.log('Attempting to reconnect WebSocket...'); + console.log("Attempting to reconnect WebSocket..."); connectWebSocket(); }, 5000); // Reconnect after 5 seconds } }; } catch (error) { - console.error('WebSocket connection error:', error); + console.error("WebSocket connection error:", error); } }; @@ -149,7 +151,9 @@ const ParticipantsList = ({ vote_id }: IParams) => { // Update the corresponding voting item const updatedItems = prevVotingItems.map((item, index) => - item.id === message.voting_item_id ? { ...item, votes_count: item.votes_count + 1 } : item, + item.id === message.voting_item_id + ? { ...item, votes_count: item.votes_count + 1 } + : item ); // Sort the updated items array by votes_count in descending order @@ -163,10 +167,10 @@ const ParticipantsList = ({ vote_id }: IParams) => { // Update the corresponding voting item const updatedItems = prevVotingItems.map((item, index) => - index === 1 ? { ...item, votes_count: item.votes_count + 1 } : item, + index === 1 ? { ...item, votes_count: item.votes_count + 1 } : item ); - console.log('votes updated'); + console.log("votes updated"); console.log(updatedItems.sort((a, b) => b.votes_count - a.votes_count)); // Sort the updated items array by votes_count in descending order return updatedItems.sort((a, b) => b.votes_count - a.votes_count); @@ -176,7 +180,10 @@ const ParticipantsList = ({ vote_id }: IParams) => { const winnersCountHandle = (winners: VotingItem[]) => { let count = 0; winners.map((winner) => { - if (winner.votes_percents === 100 && winner.votes_count === winners[0].votes_count) { + if ( + winner.votes_percents === 100 && + winner.votes_count === winners[0].votes_count + ) { count++; setWinnersCount(count); } @@ -190,21 +197,27 @@ const ParticipantsList = ({ vote_id }: IParams) => { if (!data?.data) { return (
- +
); } return (
- {data.data.description ? : null} + {data.data.description ? ( + + ) : null} {data.data.banner ? (
{mobile ? ( {data.data.title} { ) : null}
- {winnersCount > 1 ? : null} + {winnersCount > 1 ? ( + + ) : null} {participantsData && participantsData[0].votes_count > 0 ? (
{participantsData.map((participant, index) => - participant.votes_count === participantsData[0].votes_count ? ( + participant.votes_count === + participantsData[0].votes_count ? ( participant.url ? ( + className="w-full" + key={v4()} + > { key={v4()} index={index} hasUrl={false} - voteStatus={voteStatus ? voteStatus : ''} + voteStatus={voteStatus ? voteStatus : ""} isFirst={index === 0 ? true : false} name={participant.title} progress={participant.votes_percents} @@ -279,12 +296,14 @@ const ParticipantsList = ({ vote_id }: IParams) => { winner={true} /> ) - ) : null, + ) : null )}
) : null} - {winnersCount > 1 ?
: null} + {winnersCount > 1 ? ( +
+ ) : null}
@@ -293,14 +312,15 @@ const ParticipantsList = ({ vote_id }: IParams) => { !hasVotes ? ( participant.url ? ( + className="w-full mx-auto" + key={v4()} + > { hasUrl={false} key={v4()} index={index} - voteStatus={voteStatus ? voteStatus : ''} + voteStatus={voteStatus ? voteStatus : ""} isFirst={index === 0 ? true : false} name={participant.title} progress={participant.votes_percents} @@ -330,17 +350,19 @@ const ParticipantsList = ({ vote_id }: IParams) => { /> ) ) : ( - participant.votes_count !== participantsData[0].votes_count && + participant.votes_count !== + participantsData[0].votes_count && (participant.url ? ( + className="w-full mx-auto" + key={v4()} + > { hasUrl={false} key={v4()} index={index} - voteStatus={voteStatus ? voteStatus : ''} + voteStatus={voteStatus ? voteStatus : ""} isFirst={index === 0 ? true : false} name={participant.title} progress={participant.votes_percents} @@ -369,7 +391,7 @@ const ParticipantsList = ({ vote_id }: IParams) => { winner={false} /> )) - ), + ) ) : null}