navigate(`/proposal?id=${proposalNumber}`)}
+ >
+
+ );
+};
+
+export default ProposalCard;
diff --git a/dapp/src/components/page/governance/ProposalList.tsx b/dapp/src/components/page/governance/ProposalList.tsx
new file mode 100644
index 0000000..b922f40
--- /dev/null
+++ b/dapp/src/components/page/governance/ProposalList.tsx
@@ -0,0 +1,48 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import Pagination from "../../utils/Pagination";
+import { demoProposalCardData } from "constants/demoProposalData";
+import ProposalCard from "./ProposalCard";
+import { projectNameForGovernance } from "utils/store";
+import { useStore } from "@nanostores/react";
+import type { ProposalCardProps } from "types/proposal";
+
+const ProposalList: React.FC = () => {
+ const projectName = useStore(projectNameForGovernance);
+ const [currentPage, setCurrentPage] = useState(1);
+ const [proposalCardData, setProposalCardData] = useState
+
+
+
+
+
+
+ {proposalNumber}
+
+
+ {proposalTitle}
+
+
+
+
+ {proposalStatus === "active" &&
+ endDate &&
+ calculateDateDifference(endDate) && (
+
+
+ Ends in {calculateDateDifference(endDate)}
+
+ )}
+ {proposalStatus === "voted" && (
+
+ Pending execution
+
+ )}
+
+
+
+
+
+ {proposalStatus === "active" &&
+ endDate &&
+ calculateDateDifference(endDate) && (
+
+
+ Ends in {calculateDateDifference(endDate)}
+
+ )}
+ {proposalStatus === "voted" && (
+
+ Pending execution
+
+ )}
+
+
+ );
+};
+
+export default ProposalList;
diff --git a/dapp/src/components/page/governance/ProposalStatusShow.tsx b/dapp/src/components/page/governance/ProposalStatusShow.tsx
new file mode 100644
index 0000000..fb27b20
--- /dev/null
+++ b/dapp/src/components/page/governance/ProposalStatusShow.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+import type { ProposalStatus } from "types/proposal";
+
+interface ProposalStatusShowProps {
+ proposalStatus: ProposalStatus;
+}
+
+const ProposalStatusShow: React.FC
+ {proposalCardData.map((proposal) => (
+
+
+ setCurrentPage(page)}
+ />
+
+
+
+ );
+};
+
+export default ProposalStatusShow;
diff --git a/dapp/src/components/page/governance/ProposalTypeButton.tsx b/dapp/src/components/page/governance/ProposalTypeButton.tsx
new file mode 100644
index 0000000..169a9ef
--- /dev/null
+++ b/dapp/src/components/page/governance/ProposalTypeButton.tsx
@@ -0,0 +1,40 @@
+import React from "react";
+import { useState, useEffect } from "react";
+
+interface ProposalTypeButtonProps {
+ proposalTypeStatus: string;
+ proposalType: string;
+ title: string;
+ position?: "start" | "end";
+ onClick: (proposalType: string) => void;
+}
+
+const ProposalTypeButton: React.FC{title}
+
+
+ );
+};
+
+export default ProposalsSection;
diff --git a/dapp/src/components/page/project/Commit.astro b/dapp/src/components/page/project/Commit.astro
index a4b09c5..d95c183 100644
--- a/dapp/src/components/page/project/Commit.astro
+++ b/dapp/src/components/page/project/Commit.astro
@@ -5,7 +5,9 @@ import PrimaryButton from "../../utils/PrimaryButton.astro";
---
+ setProposalType(proposalType)}
+ />
+ setProposalType(proposalType)}
+ />
+
+
+ {proposalType === "proposal" &&
+
- fetchCommitHistory(page)}
+ />
);
};
diff --git a/dapp/src/components/page/project/DonateModal.astro b/dapp/src/components/page/project/DonateModal.astro
index f1e1e7b..aefc95a 100644
--- a/dapp/src/components/page/project/DonateModal.astro
+++ b/dapp/src/components/page/project/DonateModal.astro
@@ -11,7 +11,7 @@ import Loading from "../../utils/Loading.astro";
>
@@ -57,7 +57,7 @@ import Loading from "../../utils/Loading.astro";
+
- {/* Pagination */}
-
-
-
- {currentPage > 2 && ...}
- {currentPage !== 1 && (
-
- )}
-
-
+
XLM
XLM
- btn.classList.add("bg-zinc-200", "border-zinc-300", "text-zinc-600"),
+ btn.classList.add("bg-zinc-200", "border-zinc-300", "text-zinc-700"),
);
button.classList.remove(
"bg-zinc-200",
"border-zinc-300",
- "text-zinc-600",
+ "text-zinc-700",
);
button.classList.add("bg-zinc-800", "border-zinc-800", "text-white");
diff --git a/dapp/src/components/page/project/GetCommit.astro b/dapp/src/components/page/project/GetCommit.astro
index 7500371..8c00e3d 100644
--- a/dapp/src/components/page/project/GetCommit.astro
+++ b/dapp/src/components/page/project/GetCommit.astro
@@ -3,7 +3,9 @@ import Topic from "../../utils/Topic.astro";
import Loading from "../../utils/Loading.astro";
---
-
+
+
-
+
@@ -254,8 +274,10 @@ import DonateModal from "./DonateModal.astro";
"update-config-modal",
) as HTMLDialogElement;
+ let projectInfo: any;
+
async function updateProjectInfo() {
- const projectInfo = loadProjectInfo();
+ projectInfo = loadProjectInfo();
if (projectInfo) {
const projectNameElement =
document.getElementById("project-name-value");
@@ -879,5 +901,15 @@ import DonateModal from "./DonateModal.astro";
};
return icons[iconName] || "";
}
+
+ const proposalsButton = document.getElementById("go-to-proposals-button");
+ if (proposalsButton) {
+ proposalsButton.addEventListener("click", () => {
+ if (projectInfo) {
+ const name = projectInfo.name;
+ window.location.href = `/governance?name=${name}`;
+ }
+ });
+ }
});
diff --git a/dapp/src/components/page/project/ReadmeViewer.tsx b/dapp/src/components/page/project/ReadmeViewer.tsx
index 319988e..a067825 100644
--- a/dapp/src/components/page/project/ReadmeViewer.tsx
+++ b/dapp/src/components/page/project/ReadmeViewer.tsx
@@ -25,7 +25,6 @@ const ReadmeViewer = () => {
await fetchReadmeContentFromConfigUrl(configUrl);
if (readmeContent) {
setReadmeContent(readmeContent);
- console.log("readmeContent:", readmeContent);
}
}
}
diff --git a/dapp/src/components/page/proposal/ExecuteProposalModal.tsx b/dapp/src/components/page/proposal/ExecuteProposalModal.tsx
new file mode 100644
index 0000000..8e0c78f
--- /dev/null
+++ b/dapp/src/components/page/proposal/ExecuteProposalModal.tsx
@@ -0,0 +1,97 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import JsonView from "react18-json-view";
+import { modifySlashInXdr, processDecodedData } from "utils/utils";
+import { stellarLabViewXdrLink } from "constants/serviceLinks";
+import { demoOutcomeData } from "constants/demoProposalData";
+
+interface VotersModalProps {
+ xdr: string;
+ onClose: () => void;
+}
+
+const VotersModal: React.FC = ({ xdr, onClose }) => {
+ const [content, setContent] = useState(null);
+
+ const signAndExecute = () => {};
+
+ const getContentFromXdr = async (_xdr: string) => {
+ try {
+ if (_xdr) {
+ const decoded = processDecodedData(_xdr);
+ console.log("decode:", decoded);
+ setContent(demoOutcomeData);
+ }
+ } catch (error) {
+ console.error("Error decoding XDR:", error);
+ }
+ };
+
+ useEffect(() => {
+ getContentFromXdr(xdr);
+ }, [xdr]);
+
+ return (
+ = ({
+ ipfsLink,
+ description,
+ outcome,
+ status,
+}) => {
+ return (
+ (null);
+ const [isExpanded, setIsExpanded] = useState(false);
+
+ const toggleHeight = () => {
+ setIsExpanded(!isExpanded);
+ };
+
+ const getContentFromXdr = async (_xdr: string) => {
+ try {
+ if (_xdr) {
+ const decoded = processDecodedData(_xdr);
+ console.log("decode:", decoded);
+ setContent(demoOutcomeData);
+ }
+ } catch (error) {
+ console.error("Error decoding XDR:", error);
+ }
+ };
+
+ useEffect(() => {
+ getContentFromXdr(detail.xdr);
+ }, [detail]);
+
+ return (
+ (null);
+ const [description, setDescription] = useState("");
+ const [outcome, setOutcome] = useState(null);
+ const [voteType, setVoteType] = useState();
+
+ const openVotersModal = (voteType: VoteType) => {
+ if (proposal?.status !== "active") {
+ setVoteType(voteType);
+ setIsVotersModalOpen(true);
+ } else {
+ alert("Cannot show voters while voting is in progress");
+ }
+ };
+
+ const openVotingModal = () => {
+ if (proposal?.status === "active") {
+ if (connectedAddress) {
+ setIsVotingModalOpen(true);
+ } else {
+ alert("Please connect your wallet first");
+ }
+ }
+ };
+
+ const openExecuteProposalModal = () => {
+ if (proposal?.status === "voted") {
+ setIsExecuteProposalModalOpen(true);
+ } else {
+ alert("Cannot execute proposal.");
+ }
+ };
+ const getProposalDetails = async () => {
+ const proposal = demoProposalData[id - 1];
+ if (proposal) {
+ setProposal(proposal);
+ const description = await fetchProposalFromIPFS(proposal.ipfsLink);
+ setDescription(description);
+ const outcome = await fetchOutcomeDataFromIPFS(proposal.ipfsLink);
+ setOutcome(outcome);
+ } else {
+ alert("Proposal not found");
+ }
+ };
+
+ useEffect(() => {
+ getProposalDetails();
+ }, [id]);
+
+ return (
+ = ({
+ id,
+ title,
+ maintainers,
+ submitVote,
+ executeProposal,
+ status,
+}) => {
+ const [projectId, setProjectId] = useState(id);
+ const [isMaintainer, setIsMaintainer] = useState(false);
+ const connectedAddress = useStore(connectedPublicKey);
+
+ const checkIsMaintainer = () => {
+ if (connectedAddress) {
+ const isMaintainer = maintainers.includes(connectedAddress);
+ setIsMaintainer(isMaintainer);
+ } else {
+ setIsMaintainer(false);
+ }
+ };
+
+ useEffect(() => {
+ checkIsMaintainer();
+ }, [connectedAddress, maintainers]);
+
+ useEffect(() => {
+ if (id) {
+ setProjectId(id);
+ }
+ }, [id]);
+
+ return (
+ = ({ status, endDate }) => {
+ return (
+ = ({
+ approve,
+ reject,
+ abstain,
+ onClick,
+}) => {
+ const total = approve + reject + abstain;
+ const interestPercent = total ? (approve / total) * 100 : 0;
+ const conflictPercent = total ? (reject / total) * 100 : 0;
+ const abstainPercent = total ? (abstain / total) * 100 : 0;
+
+ return (
+ = ({
+ NQGScore,
+ voteData,
+ onClose,
+}) => {
+ const [voters, setVoters] = useState(voteData?.voters);
+
+ useEffect(() => {
+ setVoters(voteData?.voters);
+ }, [voteData]);
+
+ return (
+ = ({ voterRole, voters }) => {
+ return (
+ = ({ onClose }) => {
+ const [selectedOption, setSelectedOption] = useState(null);
+
+ const handleVote = () => {
+ if (!selectedOption) {
+ alert("You should select one option to vote");
+ return;
+ }
+ alert("Voted!");
+ };
+
+ return (
+
{
+ if (e.target === e.currentTarget) {
+ onClose();
+ }
+ }}
+ >
+
+ );
+};
+
+export default VotersModal;
diff --git a/dapp/src/components/page/proposal/ProposalDetail.tsx b/dapp/src/components/page/proposal/ProposalDetail.tsx
new file mode 100644
index 0000000..51f3c0a
--- /dev/null
+++ b/dapp/src/components/page/proposal/ProposalDetail.tsx
@@ -0,0 +1,217 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import Markdown from "markdown-to-jsx";
+import "github-markdown-css";
+import JsonView from "react18-json-view";
+import "react18-json-view/src/style.css";
+import {
+ capitalizeFirstLetter,
+ processDecodedData,
+ modifySlashInXdr,
+ getProposalLinkFromIpfs,
+ getOutcomeLinkFromIpfs,
+} from "utils/utils";
+import { demoOutcomeData } from "constants/demoProposalData";
+import { stellarLabViewXdrLink } from "constants/serviceLinks";
+import type { ProposalOutcome, ProposalStatus } from "types/proposal";
+interface ProposalDetailProps {
+ ipfsLink: string | null;
+ description: string;
+ outcome: ProposalOutcome | null;
+ status: ProposalStatus | null;
+}
+
+const ProposalDetail: React.FC e.stopPropagation()}
+ >
+
+
+
+ Outcome
+
+
+
+
+ View in Stellar Lab
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ProposalDetail;
+
+export const OutcomeDetail: React.FC<{
+ type: string;
+ detail: { description: string; xdr: string };
+ proposalStatus: ProposalStatus | null;
+}> = ({ type, detail, proposalStatus }) => {
+ const [content, setContent] = useState
+
+ );
+};
diff --git a/dapp/src/components/page/proposal/ProposalPage.tsx b/dapp/src/components/page/proposal/ProposalPage.tsx
new file mode 100644
index 0000000..960f7c6
--- /dev/null
+++ b/dapp/src/components/page/proposal/ProposalPage.tsx
@@ -0,0 +1,123 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import { useStore } from "@nanostores/react";
+import ProposalPageTitle from "./ProposalPageTitle";
+import ProposalStatusSection from "./ProposalStatusSection";
+import VoteStatusBar from "./VoteStatusBar";
+import VotersModal from "./VotersModal";
+import VotingModal from "./VotingModal";
+import { connectedPublicKey, proposalId } from "utils/store";
+import type { VoteType, Proposal } from "types/proposal";
+import { demoProposalData } from "constants/demoProposalData";
+import ProposalDetail from "./ProposalDetail";
+import {
+ fetchOutcomeDataFromIPFS,
+ fetchProposalFromIPFS,
+} from "@service/ProposalService";
+import type { ProposalOutcome } from "types/proposal";
+import ExecuteProposalModal from "./ExecuteProposalModal";
+
+const ProposalPage: React.FC = () => {
+ const id = useStore(proposalId);
+ const connectedAddress = useStore(connectedPublicKey);
+ const [isVotersModalOpen, setIsVotersModalOpen] = useState(false);
+ const [isVotingModalOpen, setIsVotingModalOpen] = useState(false);
+ const [isExecuteProposalModalOpen, setIsExecuteProposalModalOpen] =
+ useState(false);
+ const [proposal, setProposal] = useState
+
+
+ {capitalizeFirstLetter(type)}
+
+
+ {detail.description}
+
+
+ {content ? (
+
+
+
+
+
+ View in Stellar Lab
+
+
+
+ ) : (
+
+
+
+
+
+
+ XDR
+ 
+ 
+
+
+
+
+
+
+
+
+
+
+ No transaction to execute
+
+ )}
+
+ openVotingModal()}
+ executeProposal={() => openExecuteProposalModal()}
+ status={proposal?.status || null}
+ maintainers={proposal?.maintainers || []}
+ />
+ setIsVotersModalOpen(false)}
+ />
+ )}
+ {isVotingModalOpen && (
+ setIsVotingModalOpen(false)} />
+ )}
+ {isExecuteProposalModalOpen && (
+ setIsExecuteProposalModalOpen(false)}
+ />
+ )}
+
+ );
+};
+
+export default ProposalPage;
diff --git a/dapp/src/components/page/proposal/ProposalPageTitle.tsx b/dapp/src/components/page/proposal/ProposalPageTitle.tsx
new file mode 100644
index 0000000..1691658
--- /dev/null
+++ b/dapp/src/components/page/proposal/ProposalPageTitle.tsx
@@ -0,0 +1,92 @@
+import { useStore } from "@nanostores/react";
+import React from "react";
+import { useState, useEffect } from "react";
+import { connectedPublicKey } from "utils/store";
+import type { ProposalStatus } from "types/proposal";
+interface Props {
+ id: string;
+ title: string;
+ maintainers: string[];
+ submitVote: () => void;
+ executeProposal: () => void;
+ status: ProposalStatus | null;
+}
+
+const ProposalPageTitle: React.FC
+ openVotersModal(voteType)}
+ />
+
+ {isVotersModalOpen && proposal?.voteStatus && (
+
+
+ );
+};
+
+export default ProposalPageTitle;
diff --git a/dapp/src/components/page/proposal/ProposalStatusSection.tsx b/dapp/src/components/page/proposal/ProposalStatusSection.tsx
new file mode 100644
index 0000000..0fee989
--- /dev/null
+++ b/dapp/src/components/page/proposal/ProposalStatusSection.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+import { calculateDateDifference } from "../../../utils/formatTimeFunctions";
+import ProposalStatusShow from "../governance/ProposalStatusShow";
+import type { ProposalStatus } from "types/proposal";
+
+interface Props {
+ status: ProposalStatus | null;
+ endDate: string | null;
+}
+
+const ProposalStatusSection: React.FC
+
+ {projectId}
+
+
+ + {title} +
+
+
+
+
+
+
+ );
+};
+
+export default ProposalStatusSection;
diff --git a/dapp/src/components/page/proposal/VoteStatusBar.tsx b/dapp/src/components/page/proposal/VoteStatusBar.tsx
new file mode 100644
index 0000000..be2164c
--- /dev/null
+++ b/dapp/src/components/page/proposal/VoteStatusBar.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+import type { VoteType } from "types/proposal";
+
+interface VoteStatusBarProps {
+ approve: number;
+ reject: number;
+ abstain: number;
+ onClick?: (voteType: VoteType) => void;
+}
+
+const VoteStatusBar: React.FC
+ {status &&
+
+ {status === "active" && endDate && (
+
+
+ Ends in {calculateDateDifference(endDate)}
+
+ )}
+
+
+ );
+};
+
+export default VoteStatusBar;
diff --git a/dapp/src/components/page/proposal/VotersModal.tsx b/dapp/src/components/page/proposal/VotersModal.tsx
new file mode 100644
index 0000000..2a614e7
--- /dev/null
+++ b/dapp/src/components/page/proposal/VotersModal.tsx
@@ -0,0 +1,92 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import { capitalizeFirstLetter } from "utils/utils";
+import type { VoteData, VoterRole, Voter } from "types/proposal";
+
+interface VotersModalProps {
+ NQGScore: number;
+ voteData: VoteData | null;
+ onClose: () => void;
+}
+
+const VotersModal: React.FC onClick?.("approve")}
+ >
+ onClick?.("abstain")}
+ >
+ onClick?.("reject")}
+ >
+ {
+ if (e.target === e.currentTarget) {
+ onClose();
+ }
+ }}
+ >
+
+ );
+};
+
+export default VotersModal;
+
+interface VoterCardProps {
+ voterRole: VoterRole;
+ voters: Voter[];
+}
+
+const VotersCard: React.FC e.stopPropagation()}
+ >
+
+
+ {voters && (
+ <>
+
+
+ {NQGScore}
+
+
+
+ );
+};
diff --git a/dapp/src/components/page/proposal/VotingModal.tsx b/dapp/src/components/page/proposal/VotingModal.tsx
new file mode 100644
index 0000000..fd2b775
--- /dev/null
+++ b/dapp/src/components/page/proposal/VotingModal.tsx
@@ -0,0 +1,103 @@
+import React from "react";
+import { useState } from "react";
+import type { VoteType } from "types/proposal";
+
+interface VotersModalProps {
+ onClose: () => void;
+}
+
+const VotingModal: React.FC
+
+
+ {capitalizeFirstLetter(voterRole)}
+
+
+ {voters.map((voter) => (
+
+ {
+ voter.github && window.open(voter.github, "_blank");
+ }}
+ className="w-10 h-10 rounded-full overflow-hidden cursor-pointer"
+ >
+ 
+
+ ))}
+ {
+ if (e.target === e.currentTarget) {
+ onClose();
+ }
+ }}
+ >
+
+ );
+};
+
+export default VotingModal;
+
+const CheckBox: React.FC<{
+ value: VoteType;
+ option: string | null;
+ setOption: any;
+ label: string;
+ bgColor: string;
+}> = ({ value, option, setOption, label, bgColor }) => {
+ return (
+
+ );
+};
diff --git a/dapp/src/components/page/register/RegisterProject.astro b/dapp/src/components/page/register/RegisterProject.astro
index bea2bac..cad5d7c 100644
--- a/dapp/src/components/page/register/RegisterProject.astro
+++ b/dapp/src/components/page/register/RegisterProject.astro
@@ -4,7 +4,9 @@ import Loading from "../../utils/Loading.astro";
import ModalInput from "../../utils/ModalInput.astro";
---
- e.stopPropagation()}
+ >
+
+ Vote
+
+
+ Select one option to vote
+ +
+
+
+
+
+
= ({
+ currentPage,
+ onPageChange,
+}) => {
+ return (
+
+
+
+ {currentPage > 2 && ...}
+ {currentPage !== 1 && (
+
+ )}
+
+
+ );
+};
+
+export default Pagination;
diff --git a/dapp/src/components/utils/PrimaryButton.astro b/dapp/src/components/utils/PrimaryButton.astro
index 0a3db8d..857b25c 100644
--- a/dapp/src/components/utils/PrimaryButton.astro
+++ b/dapp/src/components/utils/PrimaryButton.astro
@@ -21,11 +21,13 @@ const {
diff --git a/dapp/src/components/utils/Topic.astro b/dapp/src/components/utils/Topic.astro
index a29a1f6..536a657 100644
--- a/dapp/src/components/utils/Topic.astro
+++ b/dapp/src/components/utils/Topic.astro
@@ -2,7 +2,7 @@
const { title, description, id } = Astro.props;
---
-
+
diff --git a/dapp/src/constants/demoProposalData.ts b/dapp/src/constants/demoProposalData.ts
new file mode 100644
index 0000000..2ee0cc7
--- /dev/null
+++ b/dapp/src/constants/demoProposalData.ts
@@ -0,0 +1,632 @@
+import type { Proposal, ProposalCardProps } from "types/proposal";
+
+export const demoProposalCardData: ProposalCardProps[] = [
+ {
+ proposalNumber: 5,
+ proposalTitle: "Support: Addition of DAO system to Tansu",
+ proposalStatus: "active",
+ endDate: "2024-11-24",
+ },
+ {
+ proposalNumber: 4,
+ proposalTitle: "Hire design team",
+ proposalStatus: "voted",
+ endDate: "2024-11-17",
+ },
+ {
+ proposalNumber: 3,
+ proposalTitle: "Use design system from Stellar",
+ proposalStatus: "rejected",
+ endDate: "2024-11-15",
+ },
+ {
+ proposalNumber: 2,
+ proposalTitle: "Integrate with xlm.sh",
+ proposalStatus: "approved",
+ endDate: "2024-11-14",
+ },
+ {
+ proposalNumber: 1,
+ proposalTitle: "Support Soroban Domains for maintainers' addresses",
+ proposalStatus: "cancelled",
+ endDate: null,
+ },
+];
+
+export const demoProposalData: Proposal[] = [
+ {
+ id: 1,
+ title: "Support Soroban Domains for maintainers' addresses",
+ projectName: "Tansu",
+ maintainers: [
+ "GCMFQP44AR32S7IRIUKNOEJW5PNWOCLRHLQWSHUCSV4QZOMUXZOVA7Q2",
+ "GDOQ67KNQFEQW27QTLSBD2UWDAGPWVFCK6TP73WF7OS2A3VEYSAZXQWD",
+ ],
+ ipfsLink: "bafybeifaztpwi4j2jslrbofmifj2teld6aglhny2z6ivjga7vv5thidrr4",
+ status: "cancelled",
+ voteStatus: {
+ totalScore: 0,
+ nqgScore: 0,
+ approve: {
+ voteType: "approve",
+ score: 0,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [],
+ },
+ },
+ reject: {
+ voteType: "reject",
+ score: 0,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [],
+ },
+ },
+ abstain: {
+ voteType: "abstain",
+ score: 0,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [],
+ },
+ },
+ },
+ endDate: null,
+ },
+ {
+ id: 2,
+ title: "Integrate with xlm.sh",
+ projectName: "Tansu",
+ maintainers: [
+ "GCMFQP44AR32S7IRIUKNOEJW5PNWOCLRHLQWSHUCSV4QZOMUXZOVA7Q2",
+ "GDOQ67KNQFEQW27QTLSBD2UWDAGPWVFCK6TP73WF7OS2A3VEYSAZXQWD",
+ ],
+ ipfsLink: "bafybeib6ioupho3p3pliusx7tgs7dvi6mpu2bwfhayj6w6ie44lo3vvc4i",
+ status: "approved",
+ voteStatus: {
+ totalScore: 10,
+ nqgScore: 4.8,
+ approve: {
+ voteType: "approve",
+ score: 8,
+ voters: {
+ maintainer: [
+ {
+ address: "",
+ image: null,
+ name: "Pamphile Roy",
+ github: "https://github.com/tupui",
+ },
+ ],
+ contributor: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ reject: {
+ voteType: "reject",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ abstain: {
+ voteType: "abstain",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ },
+ endDate: "2024-11-14",
+ },
+ {
+ id: 3,
+ title: "Use design system from Stellar",
+ projectName: "Tansu",
+ maintainers: [
+ "GCMFQP44AR32S7IRIUKNOEJW5PNWOCLRHLQWSHUCSV4QZOMUXZOVA7Q2",
+ "GDOQ67KNQFEQW27QTLSBD2UWDAGPWVFCK6TP73WF7OS2A3VEYSAZXQWD",
+ ],
+ ipfsLink: "bafybeiafz4gvlwe74n4chp3elpxuogusqsutpj6vrprj5bazrb3yjcru5u",
+ status: "rejected",
+ voteStatus: {
+ totalScore: 8,
+ nqgScore: 1.7,
+ approve: {
+ voteType: "approve",
+ score: 3,
+ voters: {
+ maintainer: [
+ {
+ address: "",
+ image: null,
+ name: "Pamphile Roy",
+ github: "https://github.com/tupui",
+ },
+ ],
+ contributor: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ reject: {
+ voteType: "reject",
+ score: 4,
+ voters: {
+ maintainer: [],
+ contributor: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ abstain: {
+ voteType: "abstain",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ },
+ endDate: "2024-11-15",
+ },
+ {
+ id: 4,
+ title: "Hire design team",
+ projectName: "Tansu",
+ maintainers: [
+ "GCMFQP44AR32S7IRIUKNOEJW5PNWOCLRHLQWSHUCSV4QZOMUXZOVA7Q2",
+ "GDOQ67KNQFEQW27QTLSBD2UWDAGPWVFCK6TP73WF7OS2A3VEYSAZXQWD",
+ ],
+ ipfsLink: "bafybeifzgwidr5ppkwplu4g7ckylksscxslgu367bbtrptzhkgdsai6yxa",
+ status: "voted",
+ voteStatus: {
+ totalScore: 7,
+ nqgScore: 4.5,
+ approve: {
+ voteType: "approve",
+ score: 5,
+ voters: {
+ maintainer: [
+ {
+ address: "",
+ image: null,
+ name: "Pamphile Roy",
+ github: "https://github.com/tupui",
+ },
+ ],
+ contributor: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ reject: {
+ voteType: "reject",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ abstain: {
+ voteType: "abstain",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ },
+ endDate: "2024-11-17",
+ },
+ {
+ id: 5,
+ title: "Support: Add DAO system to the project",
+ projectName: "Tansu",
+ maintainers: [
+ "GCMFQP44AR32S7IRIUKNOEJW5PNWOCLRHLQWSHUCSV4QZOMUXZOVA7Q2",
+ "GDOQ67KNQFEQW27QTLSBD2UWDAGPWVFCK6TP73WF7OS2A3VEYSAZXQWD",
+ ],
+ ipfsLink: "bafybeigstnjnededvbckmvlmodpw2m745i5lidmyttb4u7o6ouiudokbx4",
+ status: "active",
+ voteStatus: {
+ totalScore: 6,
+ nqgScore: 3.7,
+ approve: {
+ voteType: "approve",
+ score: 4,
+ voters: {
+ maintainer: [
+ {
+ address: "",
+ image: null,
+ name: "Pamphile Roy",
+ github: "https://github.com/tupui",
+ },
+ ],
+ contributor: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ reject: {
+ voteType: "reject",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ abstain: {
+ voteType: "abstain",
+ score: 1,
+ voters: {
+ maintainer: [],
+ contributor: [],
+ community: [
+ {
+ address: "",
+ image: null,
+ name: "",
+ github: "",
+ },
+ ],
+ },
+ },
+ },
+ endDate: "2024-11-24",
+ },
+];
+
+export const demoOutcomeData: any = {
+ tx: {
+ tx: {
+ source_account:
+ "GBU764PFZXKZUORAUK3IG36Y6OXSLYM6ZERLJA2BZ2Y2GSKNKWL4KKC5",
+ fee: 5312486,
+ seq_num: 221608492723602976,
+ cond: {
+ time: {
+ min_time: 0,
+ max_time: 0,
+ },
+ },
+ memo: "none",
+ operations: [
+ {
+ source_account: null,
+ body: {
+ invoke_host_function: {
+ host_function: {
+ invoke_contract: {
+ contract_address:
+ "CC5TSJ3E26YUYGYQKOBNJQLPX4XMUHUY7Q26JX53CJ2YUIZB5HVXXRV6",
+ function_name: "mine",
+ args: [
+ {
+ bytes:
+ "000000ea80a23b9340abb81e22ebe2c84783896eab4ab047ebc006f9ca54fb66",
+ },
+ {
+ string: "TANSU28",
+ },
+ {
+ u64: 1188896,
+ },
+ {
+ address:
+ "GBU764PFZXKZUORAUK3IG36Y6OXSLYM6ZERLJA2BZ2Y2GSKNKWL4KKC5",
+ },
+ ],
+ },
+ },
+ auth: [
+ {
+ credentials: "source_account",
+ root_invocation: {
+ function: {
+ contract_fn: {
+ contract_address:
+ "CC5TSJ3E26YUYGYQKOBNJQLPX4XMUHUY7Q26JX53CJ2YUIZB5HVXXRV6",
+ function_name: "mine",
+ args: [
+ {
+ bytes:
+ "000000ea80a23b9340abb81e22ebe2c84783896eab4ab047ebc006f9ca54fb66",
+ },
+ {
+ string: "TANSU28",
+ },
+ {
+ u64: 1188896,
+ },
+ {
+ address:
+ "GBU764PFZXKZUORAUK3IG36Y6OXSLYM6ZERLJA2BZ2Y2GSKNKWL4KKC5",
+ },
+ ],
+ },
+ },
+ sub_invocations: [],
+ },
+ },
+ ],
+ },
+ },
+ },
+ ],
+ ext: {
+ v1: {
+ ext: "v0",
+ resources: {
+ footprint: {
+ read_only: [
+ {
+ contract_data: {
+ contract:
+ "CC2D4LQAWPMGD5A7XJHF5KN3A5QYJGQJS3VSFXR6TKTH6ZUR5RUFCYCW",
+ key: "ledger_key_contract_instance",
+ durability: "persistent",
+ },
+ },
+ ],
+ read_write: [
+ {
+ trustline: {
+ account_id:
+ "GDNMPUEOS27LYEG4HS74RHLFWO325JMIDEAP67QOVYJBJC6XSGE4E5ST",
+ asset: {
+ credit_alphanum4: {
+ asset_code: "FCM",
+ issuer:
+ "GD765M4FIG4C4CGWUFDPD2QCWKISYRLBRIYMLSILCCTPY7DEGGUKPFBE",
+ },
+ },
+ },
+ },
+ {
+ contract_data: {
+ contract:
+ "CC5TSJ3E26YUYGYQKOBNJQLPX4XMUHUY7Q26JX53CJ2YUIZB5HVXXRV6",
+ key: {
+ vec: [
+ {
+ symbol: "Block",
+ },
+ {
+ u64: 4211,
+ },
+ ],
+ },
+ durability: "persistent",
+ },
+ },
+ ],
+ },
+ instructions: 5000000,
+ read_bytes: 25000,
+ write_bytes: 1200,
+ },
+ resource_fee: 5312386,
+ },
+ },
+ },
+ signatures: [],
+ },
+};
diff --git a/dapp/src/constants/serviceLinks.js b/dapp/src/constants/serviceLinks.js
new file mode 100644
index 0000000..5ba651e
--- /dev/null
+++ b/dapp/src/constants/serviceLinks.js
@@ -0,0 +1,2 @@
+export const stellarLabViewXdrLink =
+ "https://lab.stellar.org/xdr/view?$=network$id=testnet&label=Testnet&horizonUrl=https:////horizon-testnet.stellar.org&rpcUrl=https:////soroban-testnet.stellar.org&passphrase=Test%20SDF%20Network%20/;%20September%202015;&xdr$blob=";
diff --git a/dapp/src/layouts/Layout.astro b/dapp/src/layouts/Layout.astro
index 762fd90..59ad4f5 100644
--- a/dapp/src/layouts/Layout.astro
+++ b/dapp/src/layouts/Layout.astro
@@ -28,10 +28,10 @@ const { title } = Astro.props;
+ var global = global || window;
+
+
+
+
+
+
+
+
+
+
diff --git a/dapp/src/pages/proposal/index.astro b/dapp/src/pages/proposal/index.astro
new file mode 100644
index 0000000..989c49c
--- /dev/null
+++ b/dapp/src/pages/proposal/index.astro
@@ -0,0 +1,30 @@
+---
+import Layout from "../../layouts/Layout.astro";
+import Container from "../../components/layout/Container.astro";
+import ProposalPage from "../../components/page/proposal/ProposalPage.tsx";
+---
+
+
+
+
+
+
+
+
+
+
+
diff --git a/dapp/src/service/ProposalService.ts b/dapp/src/service/ProposalService.ts
new file mode 100644
index 0000000..4c96a9d
--- /dev/null
+++ b/dapp/src/service/ProposalService.ts
@@ -0,0 +1,31 @@
+import axios from "axios";
+import { getOutcomeLinkFromIpfs, getProposalLinkFromIpfs } from "utils/utils";
+
+async function fetchProposalFromIPFS(url: string) {
+ try {
+ const proposalUrl = getProposalLinkFromIpfs(url);
+ const response = await axios.get(proposalUrl);
+ let content = response.data;
+ content = content.replace(
+ /!\[([^\]]*)\]\(([^http][^)]+)\)/g,
+ ``,
+ );
+ return content;
+ } catch (error) {
+ console.error("Error fetching the IPFS file:", error);
+ throw error;
+ }
+}
+
+async function fetchOutcomeDataFromIPFS(url: string) {
+ try {
+ const outcomeUrl = getOutcomeLinkFromIpfs(url);
+ const response = await axios.get(outcomeUrl);
+ return response.data;
+ } catch (error) {
+ console.error("Error fetching the outcomes data from IPFS:", error);
+ throw error;
+ }
+}
+
+export { fetchProposalFromIPFS, fetchOutcomeDataFromIPFS };
diff --git a/dapp/src/styles/global.css b/dapp/src/styles/global.css
index 96b10d7..7d4f01a 100644
--- a/dapp/src/styles/global.css
+++ b/dapp/src/styles/global.css
@@ -16,23 +16,25 @@
/* custom scrollbar */
/* For Webkit-based browsers (Chrome, Safari) */
::-webkit-scrollbar {
- width: 10px !important;
+ width: 2px !important;
+}
+
+::-webkit-scrollbar:horizontal {
+ height: 2px !important;
}
::-webkit-scrollbar-track {
- background: #f1f1f1 !important;
border-radius: 10px !important;
cursor: pointer;
}
::-webkit-scrollbar-thumb {
- background-color: #777 !important;
+ background-color: #aaa !important;
border-radius: 10px;
- border: 2px solid #f1f1f1 !important;
}
::-webkit-scrollbar-thumb:hover {
- background-color: #555 !important;
+ background-color: #999 !important;
}
/* Custom number input */
diff --git a/dapp/src/types/proposal.ts b/dapp/src/types/proposal.ts
new file mode 100644
index 0000000..7580634
--- /dev/null
+++ b/dapp/src/types/proposal.ts
@@ -0,0 +1,68 @@
+export type ProposalStatus =
+ | "active"
+ | "rejected"
+ | "cancelled"
+ | "approved"
+ | "voted";
+
+export interface Proposal {
+ id: number;
+ title: string;
+ projectName: string;
+ maintainers: string[];
+ ipfsLink: string;
+ status: ProposalStatus;
+ voteStatus: VoteStatus;
+ endDate: string | null;
+}
+
+export interface ProposalCardProps {
+ proposalNumber: number;
+ proposalTitle: string;
+ proposalStatus: ProposalStatus;
+ endDate: string | null;
+}
+
+export type VoteType = "approve" | "reject" | "abstain";
+
+export type VoterRole = "maintainer" | "contributor" | "community";
+
+export interface VoteStatus {
+ totalScore: number;
+ nqgScore: number;
+ approve: VoteData;
+ reject: VoteData;
+ abstain: VoteData;
+}
+
+export interface VoteData {
+ voteType: VoteType;
+ score: number;
+ voters: {
+ maintainer: Voter[];
+ contributor: Voter[];
+ community: Voter[];
+ };
+}
+
+export interface Voter {
+ address: string;
+ image: string | null;
+ name: string;
+ github: string;
+}
+
+export interface ProposalOutcome {
+ approved: {
+ description: string;
+ xdr: string;
+ };
+ rejected: {
+ description: string;
+ xdr: string;
+ };
+ cancelled: {
+ description: string;
+ xdr: string;
+ };
+}
diff --git a/dapp/src/utils/formatTimeFunctions.ts b/dapp/src/utils/formatTimeFunctions.ts
index b2c6b24..3a55bd0 100644
--- a/dapp/src/utils/formatTimeFunctions.ts
+++ b/dapp/src/utils/formatTimeFunctions.ts
@@ -32,3 +32,19 @@ export function formatDate(dateString: string): string {
};
return date.toLocaleDateString(undefined, dateOptions);
}
+
+export function calculateDateDifference(dateString: string): string | null {
+ const inputDate = new Date(dateString + "T00:00:00");
+ const now = new Date();
+
+ const timeDiff = inputDate.getTime() - now.getTime();
+ const dayDiff = Math.ceil(timeDiff / (1000 * 3600 * 24));
+
+ if (dayDiff < 1) {
+ return null;
+ } else if (dayDiff < 2) {
+ return `${dayDiff} day`;
+ } else {
+ return `${dayDiff} days`;
+ }
+}
diff --git a/dapp/src/utils/store.js b/dapp/src/utils/store.js
index 017ac8f..691b26a 100644
--- a/dapp/src/utils/store.js
+++ b/dapp/src/utils/store.js
@@ -3,3 +3,6 @@ import { atom } from "nanostores";
export const projectInfoLoaded = atom(false);
export const latestCommit = atom("");
export const projectCardModalOpen = atom(false);
+export const projectNameForGovernance = atom("");
+export const proposalId = atom(0);
+export const connectedPublicKey = atom("");
diff --git a/dapp/src/utils/utils.ts b/dapp/src/utils/utils.ts
index 610bbec..a72931b 100644
--- a/dapp/src/utils/utils.ts
+++ b/dapp/src/utils/utils.ts
@@ -1,3 +1,5 @@
+import { TransactionBuilder } from "@stellar/stellar-sdk";
+
export function truncateMiddle(str: string, maxLength: number): string {
if (str.length <= maxLength) return str;
const ellipsis = "...";
@@ -38,3 +40,34 @@ export function extractConfigData(tomlData: any, projectName: string) {
maintainersAddresses: tomlData.ACCOUNTS || [],
};
}
+
+export function capitalizeFirstLetter(str: string): string {
+ if (!str) return str;
+ return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+export const processDecodedData = (xdrData: string): any => {
+ let trxFromXdr;
+ try {
+ trxFromXdr = TransactionBuilder.fromXDR(
+ xdrData,
+ import.meta.env.PUBLIC_SOROBAN_NETWORK_PASSPHRASE,
+ );
+ } catch (error) {
+ console.error("Error decoding XDR:", error);
+ }
+
+ return trxFromXdr;
+};
+
+export const modifySlashInXdr = (xdr: string) => {
+ return xdr.replaceAll("/", "//");
+};
+
+export const getProposalLinkFromIpfs = (ipfsLink: string) => {
+ return `https://${ipfsLink}.ipfs.w3s.link/proposal.md`;
+};
+
+export const getOutcomeLinkFromIpfs = (ipfsLink: string) => {
+ return `https://${ipfsLink}.ipfs.w3s.link/outcomes.json`;
+};
diff --git a/dapp/tailwind.config.mjs b/dapp/tailwind.config.mjs
index 4b5793b..748f6d4 100644
--- a/dapp/tailwind.config.mjs
+++ b/dapp/tailwind.config.mjs
@@ -12,18 +12,27 @@ export default {
colors: {
black: "#000000",
white: "#FFFFFF",
- gray: "#0D0C22",
+ gray: "#B4B4B4",
stone: "#231F20",
lime: "#B9FF66",
+ blue: "#0B32F6",
+ red: "#E70C0C",
+ yellow: "#E0D911",
+ active: "#ED9033",
+ interest: "#A9EE72",
+ conflict: "#FF8383",
+ abstain: "#C2C2C2",
+ voted: "#B40BF6",
+ approved: "#43B369",
zinc: {
100: "#F3F3F3",
200: "#F0F0F0",
300: "#D9D9D9",
- 400: "#D8D8D8",
- 500: "#898989",
- 600: "#B0B0B0",
+ 400: "#D5D5D5",
+ 500: "#CBCBCB",
+ 600: "#A3A3A3",
700: "#787878",
- 800: "#292A32",
+ 800: "#494949",
900: "#191A23",
},
},
@@ -33,6 +42,7 @@ export default {
},
boxShadow: {
card: "0px 5px 0px 0px #191A23",
+ vote: "0px 0px 4px 4px #ACFF75",
},
},
};