diff --git a/packages/hardhat/contracts/PollManager.sol b/packages/hardhat/contracts/PollManager.sol
index 0e681d9..0044b76 100644
--- a/packages/hardhat/contracts/PollManager.sol
+++ b/packages/hardhat/contracts/PollManager.sol
@@ -18,7 +18,7 @@ contract PollManager is Params, DomainObjs {
 		uint256 maciPollId;
 		string name;
 		bytes encodedOptions;
-		string ipfsHash;
+		string metadata;
 		MACI.PollContracts pollContracts;
 		uint256 startTime;
 		uint256 endTime;
@@ -47,7 +47,7 @@ contract PollManager is Params, DomainObjs {
 		MACI.PollContracts pollContracts,
 		string name,
 		string[] options,
-		string ipfsHash,
+		string metadata,
 		uint256 startTime,
 		uint256 endTime
 	);
@@ -89,7 +89,7 @@ contract PollManager is Params, DomainObjs {
 	function createPoll(
 		string calldata _name,
 		string[] calldata _options,
-		string calldata _ipfsHash,
+		string calldata _metadata,
 		uint256 _duration
 	) public onlyOwner {
 		// TODO: check if the number of options are more than limit
@@ -120,7 +120,7 @@ contract PollManager is Params, DomainObjs {
 			name: _name,
 			encodedOptions: encodedOptions,
 			numOfOptions: _options.length,
-			ipfsHash: _ipfsHash,
+			metadata: _metadata,
 			startTime: block.timestamp,
 			endTime: endTime,
 			pollContracts: pollContracts,
@@ -135,7 +135,7 @@ contract PollManager is Params, DomainObjs {
 			pollContracts,
 			_name,
 			_options,
-			_ipfsHash,
+			_metadata,
 			block.timestamp,
 			endTime
 		);
diff --git a/packages/nextjs/app/admin/_components/CreatePollModal.tsx b/packages/nextjs/app/admin/_components/CreatePollModal.tsx
index e9eef1e..41b4c2e 100644
--- a/packages/nextjs/app/admin/_components/CreatePollModal.tsx
+++ b/packages/nextjs/app/admin/_components/CreatePollModal.tsx
@@ -5,15 +5,9 @@ import { MdEdit } from "react-icons/md";
 import { RxCross2 } from "react-icons/rx";
 import Modal from "~~/components/Modal";
 import { useScaffoldContractWrite } from "~~/hooks/scaffold-eth";
+import { PollType } from "~~/types/poll";
 import { notification } from "~~/utils/scaffold-eth";
 
-enum PollType {
-  NOT_SELECTED,
-  SINGLE_VOTE,
-  MULTIPLE_VOTE,
-  WEIGHTED_MULTIPLE_VOTE,
-}
-
 export default function Example({
   show,
   setOpen,
@@ -68,7 +62,12 @@ export default function Example({
   const { writeAsync } = useScaffoldContractWrite({
     contractName: "PollManager",
     functionName: "createPoll",
-    args: [pollData?.title, pollData?.options || [], "", duration > 0 ? BigInt(duration) : 0n],
+    args: [
+      pollData.title,
+      pollData.options || [],
+      JSON.stringify({ pollType: pollData.pollType }),
+      duration > 0 ? BigInt(duration) : 0n,
+    ],
   });
 
   async function onSubmit() {
@@ -163,7 +162,7 @@ export default function Example({
         value={pollData.pollType}
         onChange={handlePollTypeChange}
       >
-        <option disabled selected value={PollType.NOT_SELECTED}>
+        <option disabled value={PollType.NOT_SELECTED}>
           Select Poll Type
         </option>
         <option value={PollType.SINGLE_VOTE}>Single Candidate Select</option>
diff --git a/packages/nextjs/app/admin/page.tsx b/packages/nextjs/app/admin/page.tsx
index 29d6a9e..a7f0c7e 100644
--- a/packages/nextjs/app/admin/page.tsx
+++ b/packages/nextjs/app/admin/page.tsx
@@ -46,8 +46,8 @@ export default function AdminPage() {
             <thead>
               <tr className="text-lg font-extralight">
                 <th className="border border-slate-600 bg-primary">Poll Name</th>
-                <th className="border border-slate-600 bg-primary">End Time</th>
                 <th className="border border-slate-600 bg-primary">Start Time</th>
+                <th className="border border-slate-600 bg-primary">End Time</th>
                 <th className="border border-slate-600 bg-primary">Status</th>
               </tr>
             </thead>
diff --git a/packages/nextjs/app/polls/[id]/page.tsx b/packages/nextjs/app/polls/[id]/page.tsx
index 9f59bdd..3f09b82 100644
--- a/packages/nextjs/app/polls/[id]/page.tsx
+++ b/packages/nextjs/app/polls/[id]/page.tsx
@@ -3,59 +3,44 @@
 import { useEffect, useState } from "react";
 import { useParams } from "next/navigation";
 import { genRandomSalt } from "@se-2/hardhat/maci-ts/crypto";
-import { Keypair, Message, PCommand, PubKey } from "@se-2/hardhat/maci-ts/domainobjs";
+import { Keypair, PCommand, PubKey } from "@se-2/hardhat/maci-ts/domainobjs";
 import { useContractRead, useContractWrite } from "wagmi";
 import PollAbi from "~~/abi/Poll";
 import VoteCard from "~~/components/card/VoteCard";
 import { useAuthContext } from "~~/contexts/AuthContext";
 import { useAuthUserOnly } from "~~/hooks/useAuthUserOnly";
 import { useFetchPoll } from "~~/hooks/useFetchPoll";
+import { PollType } from "~~/types/poll";
+import { notification } from "~~/utils/scaffold-eth";
 
 export default function PollDetail() {
   const { id } = useParams<{ id: string }>();
 
   const { data: poll, error, isLoading } = useFetchPoll(id);
+  const [pollType, setPollType] = useState(PollType.NOT_SELECTED);
 
   useAuthUserOnly({});
 
   const { keypair, stateIndex } = useAuthContext();
 
-  const [votes] = useState<{ index: number; votes: number; voteMessage: { message: Message; encKeyPair: Keypair } }[]>(
-    [],
-  );
+  const [votes, setVotes] = useState<{ index: number; votes: number }[]>([]);
 
-  const [clickedIndex, setClickedIndex] = useState<number | null>(null);
-  const handleCardClick = (index: number) => {
-    setClickedIndex(clickedIndex === index ? null : index);
-  };
+  const [isVotesInvalid, setIsVotesInvalid] = useState<Record<number, boolean>>({});
 
-  const castVote = async () => {
-    console.log("Voting for candidate", clickedIndex);
-    console.log("A", message?.message.asContractParam(), message?.encKeyPair.pubKey.asContractParam());
-    // // navigate to the home page
-    // try {
-    //   // setLoaderMessage("Casting the vote, please wait...");
-
-    //   // router.push(`/voted-success?id=${clickedIndex}`);
-    // } catch (err) {
-    //   console.log("err", err);
-    //   // toast.error("Casting vote failed, please try again ");
-    // }
-  };
+  const isAnyInvalid = Object.values(isVotesInvalid).some(v => v);
 
   useEffect(() => {
-    if (votes.length === 0) {
+    if (!poll || !poll.metadata) {
       return;
     }
 
-    (async () => {
-      try {
-        await writeAsync();
-      } catch (err) {
-        console.log({ err });
-      }
-    })();
-  }, [votes]);
+    try {
+      const { pollType } = JSON.parse(poll.metadata);
+      setPollType(pollType);
+    } catch (err) {
+      console.log("err", err);
+    }
+  }, [poll]);
 
   const { data: coordinatorPubKeyResult } = useContractRead({
     abi: PollAbi,
@@ -63,15 +48,16 @@ export default function PollDetail() {
     functionName: "coordinatorPubKey",
   });
 
-  const [message, setMessage] = useState<{ message: Message; encKeyPair: Keypair }>();
-
-  console.log("message", message);
-
-  const { writeAsync } = useContractWrite({
+  const { writeAsync: publishMessage } = useContractWrite({
     abi: PollAbi,
     address: poll?.pollContracts.poll,
     functionName: "publishMessage",
-    args: message ? [message.message.asContractParam(), message.encKeyPair.pubKey.asContractParam()] : undefined,
+  });
+
+  const { writeAsync: publishMessageBatch } = useContractWrite({
+    abi: PollAbi,
+    address: poll?.pollContracts.poll,
+    functionName: "publishMessageBatch",
   });
 
   const [coordinatorPubKey, setCoordinatorPubKey] = useState<PubKey>();
@@ -89,28 +75,79 @@ export default function PollDetail() {
     setCoordinatorPubKey(coordinatorPubKey_);
   }, [coordinatorPubKeyResult]);
 
-  useEffect(() => {
-    if (clickedIndex === null || !coordinatorPubKey || !keypair || !stateIndex) {
+  const castVote = async () => {
+    if (!poll || stateIndex == null || !coordinatorPubKey || !keypair) return;
+
+    // check if the votes are valid
+    if (isAnyInvalid) {
+      notification.error("Please enter a valid number of votes");
       return;
     }
 
-    console.log(
-      stateIndex, // stateindex
-      keypair.pubKey, // userMaciPubKey
-      BigInt(clickedIndex),
-      1n,
-      1n, // nonce
-      BigInt(id),
-      genRandomSalt(),
+    // check if no votes are selected
+    if (votes.length === 0) {
+      notification.error("Please select at least one option to vote");
+      return;
+    }
+
+    // check if the poll is closed
+    // if (Number(poll.endTime) * 1000 < new Date().getTime()) {
+    //   notification.error("Voting is closed for this poll");
+    //   return;
+    // }
+
+    // TODO: check if the poll is not started
+
+    const votesToMessage = votes.map((v, i) =>
+      getMessageAndEncKeyPair(
+        stateIndex,
+        poll.id,
+        BigInt(v.index),
+        BigInt(v.votes),
+        BigInt(votes.length - i),
+        coordinatorPubKey,
+        keypair,
+      ),
     );
 
+    try {
+      if (votesToMessage.length === 1) {
+        await publishMessage({
+          args: [votesToMessage[0].message.asContractParam(), votesToMessage[0].encKeyPair.pubKey.asContractParam()],
+        });
+      } else {
+        await publishMessageBatch({
+          args: [
+            votesToMessage.map(v => v.message.asContractParam()),
+            votesToMessage.map(v => v.encKeyPair.pubKey.asContractParam()),
+          ],
+        });
+      }
+
+      //   // setLoaderMessage("Casting the vote, please wait...");
+      //   // router.push(`/voted-success?id=${clickedIndex}`);
+    } catch (err) {
+      console.log("err", err);
+      notification.error("Casting vote failed, please try again ");
+    }
+  };
+
+  function getMessageAndEncKeyPair(
+    stateIndex: bigint,
+    pollIndex: bigint,
+    candidateIndex: bigint,
+    weight: bigint,
+    nonce: bigint,
+    coordinatorPubKey: PubKey,
+    keypair: Keypair,
+  ) {
     const command: PCommand = new PCommand(
-      stateIndex, // stateindex
-      keypair.pubKey, // userMaciPubKey
-      BigInt(clickedIndex),
-      1n,
-      1n, // nonce
-      BigInt(id),
+      stateIndex,
+      keypair.pubKey,
+      candidateIndex,
+      weight,
+      nonce,
+      pollIndex,
       genRandomSalt(),
     );
 
@@ -120,13 +157,27 @@ export default function PollDetail() {
 
     const message = command.encrypt(signature, Keypair.genEcdhSharedKey(encKeyPair.privKey, coordinatorPubKey));
 
-    setMessage({ message, encKeyPair });
-  }, [id, clickedIndex, coordinatorPubKey, keypair, stateIndex]);
+    return { message, encKeyPair };
+  }
+
+  function voteUpdated(index: number, checked: boolean, voteCounts: number) {
+    if (pollType === PollType.SINGLE_VOTE) {
+      if (checked) {
+        setVotes([{ index, votes: voteCounts }]);
+      }
+      return;
+    }
+
+    if (checked) {
+      setVotes([...votes.filter(v => v.index !== index), { index, votes: voteCounts }]);
+    } else {
+      setVotes(votes.filter(v => v.index !== index));
+    }
+  }
 
   if (isLoading) return <div>Loading...</div>;
 
   if (error) return <div>Poll not found</div>;
-  console.log(poll);
 
   return (
     <div className="container mx-auto pt-10">
@@ -135,19 +186,21 @@ export default function PollDetail() {
           <div className="text-2xl font-bold ">Vote for {poll?.name}</div>
         </div>
         {poll?.options.map((candidate, index) => (
-          <div className="pb-5" key={index}>
-            <VoteCard clicked={clickedIndex === index} onClick={() => handleCardClick(index)}>
-              <div>{candidate}</div>
-            </VoteCard>
-
-            {/* add a votes number input here */}
+          <div className="pb-5 flex" key={index}>
+            <VoteCard
+              index={index}
+              candidate={candidate}
+              clicked={false}
+              pollType={pollType}
+              onChange={(checked, votes) => voteUpdated(index, checked, votes)}
+              isInvalid={Boolean(isVotesInvalid[index])}
+              setIsInvalid={status => setIsVotesInvalid({ ...isVotesInvalid, [index]: status })}
+            />
           </div>
         ))}
-        <div className={`mt-2 ${clickedIndex !== null ? " shadow-2xl" : ""}`}>
+        <div className={`mt-2 shadow-2xl`}>
           <button
-            onClick={() => {
-              castVote();
-            }}
+            onClick={castVote}
             disabled={!true}
             className="hover:border-black border-2 border-accent w-full text-lg text-center bg-accent py-3 rounded-xl font-bold"
           >
diff --git a/packages/nextjs/app/polls/page.tsx b/packages/nextjs/app/polls/page.tsx
index 87f3418..a13fd97 100644
--- a/packages/nextjs/app/polls/page.tsx
+++ b/packages/nextjs/app/polls/page.tsx
@@ -26,12 +26,12 @@ export default function Polls() {
         polls.length !== 0 ? (
           <>
             <div className="mb-3 flex flex-col gap-y-2">
-              {polls.map((poll: any) => (
+              {polls.map(poll => (
                 <HoverBorderCard key={poll.id} showArrow={true} click={() => router.push(`/polls/${poll.id}`)}>
                   <div className="flex">
                     <div className="flex-1 flex flex-col">
                       <h1 className="text-lg font-bold">
-                        {poll.name} ({"Closed"})
+                        {poll.name} ({poll.status})
                       </h1>
                       <h1 className="text-md text-sm">{poll.options.length} Candidates</h1>
                     </div>
diff --git a/packages/nextjs/components/card/VoteCard.tsx b/packages/nextjs/components/card/VoteCard.tsx
index c954e9d..97a78a6 100644
--- a/packages/nextjs/components/card/VoteCard.tsx
+++ b/packages/nextjs/components/card/VoteCard.tsx
@@ -1,36 +1,89 @@
-import { BiLike } from "react-icons/bi";
+import { useRef, useState } from "react";
+import { PollType } from "~~/types/poll";
 
 type VoteCardProps = {
-  children: React.ReactNode;
+  index: number;
+  candidate: string;
   clicked: boolean;
-  onClick: () => void;
+  pollType: PollType;
+  onChange: (checked: boolean, votes: number) => void;
+  setIsInvalid: (value: boolean) => void;
+  isInvalid: boolean;
 };
 
-const VoteCard = ({ children, clicked, onClick }: VoteCardProps) => {
-  const handleClick = () => {
-    onClick();
-  };
-
-  // Rest of the component code...
+const VoteCard = ({ index, candidate, onChange, pollType, isInvalid, setIsInvalid }: VoteCardProps) => {
+  const [selected, setSelected] = useState(false);
+  const [votes, setVotes] = useState(0);
+  const votesFieldRef = useRef<HTMLInputElement>(null);
 
   return (
-    <div
-      className={`w-full py-1 flex justify-end items-center border-2  text-lg rounded-full  cursor-pointer 
-            transition-all  transform 
-           hover:border-[#090F21]  hover:shadow hover:scale-[0.98]
-            ${
-              clicked
-                ? " bg-[#283896] bg-opacity-100 scale-[0.98] shadow border-[#090F21]"
-                : " bg-[#3647A4] bg-opacity-30 border-transparent"
+    <>
+      <div className="bg-primary flex w-full px-2 py-2 rounded-lg">
+        <input
+          type={pollType === PollType.SINGLE_VOTE ? "radio" : "checkbox"}
+          className="mr-2"
+          value={index}
+          onChange={e => {
+            console.log(e.target.checked);
+            setSelected(e.target.checked);
+            if (e.target.checked) {
+              switch (pollType) {
+                case PollType.SINGLE_VOTE:
+                  onChange(true, 1);
+                  break;
+                case PollType.MULTIPLE_VOTE:
+                  onChange(true, 1);
+                  break;
+                case PollType.WEIGHTED_MULTIPLE_VOTE:
+                  if (votes) {
+                    onChange(true, votes);
+                  } else {
+                    setIsInvalid(true);
+                  }
+                  break;
+              }
+            } else {
+              onChange(false, 0);
+              setIsInvalid(false);
+              setVotes(0);
+              if (votesFieldRef.current) {
+                votesFieldRef.current.value = "";
+              }
             }
-            `}
-      onClick={handleClick}
-    >
-      <div className="ml-8 flex-grow text-center">{children}</div>
-      <div className={`transition-all mr-5 transform ${clicked ? "opacity-100" : " opacity-0"}`}>
-        <BiLike />
+          }}
+          name={pollType === PollType.SINGLE_VOTE ? "candidate-votes" : `candidate-votes-${index}`}
+        />
+
+        <div>{candidate}</div>
       </div>
-    </div>
+
+      {pollType === PollType.WEIGHTED_MULTIPLE_VOTE && (
+        <input
+          ref={votesFieldRef}
+          type="number"
+          className={
+            "border border-slate-600 bg-primary text-primary-content rounded-lg px-2 py-2 ml-2 w-20" +
+            (isInvalid ? " border-red-500" : "")
+          }
+          disabled={!selected}
+          placeholder="Votes"
+          min={0}
+          step={1}
+          onChange={function (e) {
+            if (
+              Number(e.currentTarget.value) < 0 ||
+              (selected && (e.currentTarget.value === "" || Number(e.currentTarget.value) == 0))
+            ) {
+              setIsInvalid(true);
+            } else {
+              setIsInvalid(false);
+              setVotes(Number(e.currentTarget.value));
+              onChange(selected, Number(e.currentTarget.value));
+            }
+          }}
+        />
+      )}
+    </>
   );
 };
 
diff --git a/packages/nextjs/contracts/deployedContracts.ts b/packages/nextjs/contracts/deployedContracts.ts
index 6f48b64..3452ee4 100644
--- a/packages/nextjs/contracts/deployedContracts.ts
+++ b/packages/nextjs/contracts/deployedContracts.ts
@@ -1374,7 +1374,7 @@ const deployedContracts = {
             {
               indexed: false,
               internalType: "string",
-              name: "ipfsHash",
+              name: "metadata",
               type: "string",
             },
             {
@@ -1463,7 +1463,7 @@ const deployedContracts = {
             },
             {
               internalType: "string",
-              name: "_ipfsHash",
+              name: "_metadata",
               type: "string",
             },
             {
@@ -1511,7 +1511,7 @@ const deployedContracts = {
                 },
                 {
                   internalType: "string",
-                  name: "ipfsHash",
+                  name: "metadata",
                   type: "string",
                 },
                 {
@@ -1614,7 +1614,7 @@ const deployedContracts = {
                 },
                 {
                   internalType: "string",
-                  name: "ipfsHash",
+                  name: "metadata",
                   type: "string",
                 },
                 {
diff --git a/packages/nextjs/types/poll.ts b/packages/nextjs/types/poll.ts
index a0060d0..c295160 100644
--- a/packages/nextjs/types/poll.ts
+++ b/packages/nextjs/types/poll.ts
@@ -10,7 +10,7 @@ export interface RawPoll {
   maciPollId: bigint;
   name: string;
   encodedOptions: `0x${string}`;
-  ipfsHash: string;
+  metadata: string;
   pollContracts: {
     poll: string;
     messageProcessor: string;
@@ -23,21 +23,13 @@ export interface RawPoll {
   tallyJsonCID: string;
 }
 
-export interface Poll {
-  id: bigint;
-  maciPollId: bigint;
-  name: string;
-  encodedOptions: `0x${string}`;
-  ipfsHash: string;
-  pollContracts: {
-    poll: string;
-    messageProcessor: string;
-    tally: string;
-  };
-  startTime: bigint;
-  endTime: bigint;
-  numOfOptions: bigint;
-  options: readonly string[];
-  tallyJsonCID: string;
+export interface Poll extends RawPoll {
   status: PollStatus;
 }
+
+export enum PollType {
+  NOT_SELECTED,
+  SINGLE_VOTE,
+  MULTIPLE_VOTE,
+  WEIGHTED_MULTIPLE_VOTE,
+}