{socialMedia.map((item, index) => (
@@ -109,11 +109,11 @@ return (
onClick={() => {
clipboard.writeText(url);
State.update({
- copied: true,
+ copied: true
});
setTimout(() => {
State.update({
- copied: false,
+ copied: false
});
}, 2000);
}}
diff --git a/apps/astraplusplus/widget/Common/Modals/Voters.jsx b/apps/astraplusplus/widget/Common/Modals/Voters.jsx
index 67969fe..6484d41 100644
--- a/apps/astraplusplus/widget/Common/Modals/Voters.jsx
+++ b/apps/astraplusplus/widget/Common/Modals/Voters.jsx
@@ -15,159 +15,153 @@ const query = `query MyQuery {
}`;
function fetchGraphQL(operationsDoc, operationName, variables) {
- return asyncFetch(QUERYAPI_ENDPOINT, {
- method: "POST",
- headers: { "x-hasura-role": "strachu_near" },
- body: JSON.stringify({
- query: operationsDoc,
- variables: variables,
- operationName: operationName
- })
- });
+ return asyncFetch(QUERYAPI_ENDPOINT, {
+ method: "POST",
+ headers: { "x-hasura-role": "strachu_near" },
+ body: JSON.stringify({
+ query: operationsDoc,
+ variables: variables,
+ operationName: operationName
+ })
+ });
}
+
if (isVotingBodyDao) {
- votes = useCache(
- () =>
- fetchGraphQL(query, "MyQuery", {}).then((result) => {
- const parsedData = {};
- if (result.status === 200) {
- if (result.body.data) {
- const data =
- result.body.data["strachu_near_vb_prod_v2_vote"];
+ votes = useCache(
+ () =>
+ fetchGraphQL(query, "MyQuery", {}).then((result) => {
+ const parsedData = {};
+ if (result.status === 200) {
+ if (result.body.data) {
+ const data = result.body.data["strachu_near_vb_prod_v2_vote"];
- if (data?.length > 0) {
- for (const a of data) {
- parsedData[a.voter] = {
- timestamp: a.timestamp,
- vote: a.vote
- };
- }
- }
- }
- }
- return parsedData;
- }),
- daoId + "proposals" + proposalId,
- { subscribe: false }
- );
+ if (data?.length > 0) {
+ for (const a of data) {
+ parsedData[a.voter] = {
+ timestamp: a.timestamp,
+ vote: a.vote
+ };
+ }
+ }
+ }
+ }
+ return parsedData;
+ }),
+ daoId + "proposals" + proposalId,
+ { subscribe: false }
+ );
}
const Wrapper = styled.ul`
- background: #f8f9fa;
+ overflow: hidden;
+ padding: 24px;
+ list-style: none;
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+
+ .radius {
border-radius: 14px;
- overflow: hidden;
- padding: 24px;
- list-style: none;
+ }
+
+ li {
display: flex;
flex-direction: column;
- gap: 12px;
-
- .radius {
- border-radius: 14px;
- }
-
- li {
- display: flex;
- flex-direction: column;
- padding: 12px;
- gap: 10px;
- border-radius: 14px;
- }
+ padding: 12px;
+ gap: 10px;
+ border-radius: 14px;
+ }
- div.Approve {
- background-color: #59e69220;
- .vote {
- color: #0d562b;
- }
+ div.Approve {
+ background-color: #59e69220;
+ .vote {
+ color: #0d562b;
}
- div.Reject {
- background-color: #e5484d20;
- .vote {
- color: #bf2c30;
- }
+ }
+ div.Reject {
+ background-color: #e5484d20;
+ .vote {
+ color: #bf2c30;
}
- div.Abstain {
- background-color: #d3d3d3;
- .vote {
- color: black;
- }
+ }
+ div.Abstain {
+ background-color: #d3d3d3;
+ .vote {
+ color: black;
}
- div.Spam {
- background-color: #ffda0920;
- .vote {
- color: #73692d;
- }
+ }
+ div.Spam {
+ background-color: #ffda0920;
+ .vote {
+ color: #73692d;
}
- div.Remove {
- background-color: #ffda0920;
- .vote {
- color: #73692d;
- }
+ }
+ div.Remove {
+ background-color: #ffda0920;
+ .vote {
+ color: #73692d;
}
+ }
`;
return (
-
- {Object.keys(votes).length === 0 && (
- No votes yet
- )}
- {isCongressDaoID &&
- isVotingBodyDao &&
- votersCount > Object.keys(votes).length && (
-
- Note: Indexer is currently running behind schedule, and the
- expected results may take longer to appear. We appreciate
- your patience and apologize for any inconvenience.
-
- )}
- {Object.keys(votes).map((voterId) => {
- const vote =
- isCongressDaoID || isVotingBodyDao
- ? votes[voterId].vote
- : votes[voterId];
- return (
-
-
-
-
-
-
-
- {vote}
- ),
- variant: `round`,
- size: "md"
- }}
- />
-
-
- {((isCongressDaoID && votes[voterId].timestamp > 0) ||
- isVotingBodyDao) &&
- votes[voterId].timestamp && (
-
-
-
-
-
- {new Date(
- votes[voterId].timestamp
- ).toLocaleString()}
-
-
- )}
-
+
+ {Object.keys(votes).length === 0 && (
+ No votes yet
+ )}
+ {isCongressDaoID &&
+ isVotingBodyDao &&
+ votersCount > Object.keys(votes).length && (
+
+ Note: Indexer is currently running behind schedule, and the expected
+ results may take longer to appear. We appreciate your patience and
+ apologize for any inconvenience.
+
+ )}
+ {Object.keys(votes).map((voterId) => {
+ const vote =
+ isCongressDaoID || isVotingBodyDao
+ ? votes[voterId].vote
+ : votes[voterId];
+ return (
+
+
+
+
+
+
+
+ {vote},
+ variant: `round`,
+ size: "md"
+ }}
+ />
+
+
+ {((isCongressDaoID && votes[voterId].timestamp > 0) ||
+ isVotingBodyDao) &&
+ votes[voterId].timestamp && (
+
+
+
+
+
+ {new Date(votes[voterId].timestamp).toLocaleString()}
+
- );
- })}
-
+ )}
+
+
+ );
+ })}
+
);
diff --git a/apps/astraplusplus/widget/DAO/Proposals/Card/ui.jsx b/apps/astraplusplus/widget/DAO/Proposals/Card/ui.jsx
index 7efa726..d4d65d0 100644
--- a/apps/astraplusplus/widget/DAO/Proposals/Card/ui.jsx
+++ b/apps/astraplusplus/widget/DAO/Proposals/Card/ui.jsx
@@ -851,6 +851,8 @@ function renderPreVoteButtons({ proposal }) {
);
}
+const [footerModal, setFooterModal] = useState({});
+
function renderFooter({ totalVotes, votes, comments, daoId, proposal }) {
const items = [
{
@@ -914,21 +916,30 @@ function renderFooter({ totalVotes, votes, comments, daoId, proposal }) {
}
const renderModal = (item, index) => {
+ const toggleKey = proposal.id + item.title;
+
return (
+ setFooterModal((prevState) => ({
+ ...prevState,
+ [toggleKey]: !prevState[toggleKey]
+ })),
content: (
),
+ avoidDefaultDomBehavior: true,
toggle: (
@@ -946,7 +957,7 @@ function renderFooter({ totalVotes, votes, comments, daoId, proposal }) {
};
return (
-
+
{items.map(renderModal)}
);
@@ -1058,52 +1069,60 @@ const NotificationModal = () => {
);
};
-return (
-
-
- {renderPermission({ isAllowedToVote: isAllowedToVote.every((v) => v) })}
- {renderHeader({ typeName, id, daoId, statusName })}
- {renderData({
- proposer,
- category,
- description,
- submission_time,
- totalVotesNeeded
- })}
- {!!showMultiVote &&
- renderMultiVoteButtons({
- daoId,
- proposal,
- canVote
+const Content = useMemo(() => {
+ return (
+ <>
+ {renderPermission({ isAllowedToVote: isAllowedToVote.every((v) => v) })}
+ {renderHeader({ typeName, id, daoId, statusName })}
+ {renderData({
+ proposer,
+ category,
+ description,
+ submission_time,
+ totalVotesNeeded
})}
-
- {statusName !== "Pre Vote" &&
- !showMultiVote &&
- renderVoteButtons({
- totalVotes,
- statusName,
- votes,
- accountId,
- isAllowedToVote,
- handleVote: (action) => {
- if (isVotingBodyDao) {
- return handleVote({
- action,
- daoId,
- proposalId: proposal.id,
- proposer
- });
- } else {
- setNotificationModal(true);
- setVoteDetails(action);
+ {!!showMultiVote &&
+ renderMultiVoteButtons({
+ daoId,
+ proposal,
+ canVote
+ })}
+
+ {statusName !== "Pre Vote" &&
+ !showMultiVote &&
+ renderVoteButtons({
+ totalVotes,
+ statusName,
+ votes,
+ accountId,
+ isAllowedToVote,
+ handleVote: (action) => {
+ if (isVotingBodyDao) {
+ return handleVote({
+ action,
+ daoId,
+ proposalId: proposal.id,
+ proposer
+ });
+ } else {
+ setNotificationModal(true);
+ setVoteDetails(action);
+ }
}
- }
- })}
+ })}
- {statusName === "Pre Vote" &&
- renderPreVoteButtons({
- proposal
- })}
+ {statusName === "Pre Vote" &&
+ renderPreVoteButtons({
+ proposal
+ })}
+ >
+ );
+}, [proposal.id]);
+
+return (
+
+
+ {Content}
{renderFooter({
totalVotes,
votes,
diff --git a/apps/astraplusplus/widget/DAO/Proposals/ProposalsPikespeak.jsx b/apps/astraplusplus/widget/DAO/Proposals/ProposalsPikespeak.jsx
index 545ab1d..72cb041 100644
--- a/apps/astraplusplus/widget/DAO/Proposals/ProposalsPikespeak.jsx
+++ b/apps/astraplusplus/widget/DAO/Proposals/ProposalsPikespeak.jsx
@@ -239,7 +239,7 @@ function getDaoConfig() {
getDaoConfig();
return (
- <>
+
-
- Table View
- {state.tableView ? (
-
- ) : (
-
- )}
- >
- ),
- variant: "info outline",
- size: "md",
- onClick: () => {
- Storage.privateSet("tableView", !state.tableView);
- State.update({
- ...state,
- tableView: !state.tableView
- });
- }
- }}
- />
+
+
+ Table View
+ {state.tableView ? (
+
+ ) : (
+
+ )}
+ >
+ ),
+ variant: "info outline",
+ size: "md",
+ onClick: () => {
+ Storage.privateSet("tableView", !state.tableView);
+ State.update({
+ ...state,
+ tableView: !state.tableView
+ });
+ }
+ }}
+ />
+
)}
-
+
{state.tableView ? (
)}
+
-
- 0,
- hasNext: hasNextHandler(),
- onPrev: () => {
- update({
- page: state.page - 1
- });
- },
- onNext: () => {
- update({
- page: state.page + 1
- });
- },
- nextHref: `#proposals-top`
- }}
- />
-
+
+
+
+
+ 0,
+ hasNext: hasNextHandler(),
+ onPrev: () => {
+ update({
+ page: state.page - 1
+ });
+ },
+ onNext: () => {
+ update({
+ page: state.page + 1
+ });
+ },
+ nextHref: `#proposals-top`
+ }}
+ />
+
+
{state.multiSelectMode && (
<>
)}
- >
+
);
diff --git a/apps/astraplusplus/widget/Layout/Modal.jsx b/apps/astraplusplus/widget/Layout/Modal.jsx
index e6bcc74..d37d6c8 100644
--- a/apps/astraplusplus/widget/Layout/Modal.jsx
+++ b/apps/astraplusplus/widget/Layout/Modal.jsx
@@ -1,56 +1,83 @@
const toggle = props.toggle ?? Open Modal ;
const toggleContainerProps = props.toggleContainerProps ?? {};
const content = props.content ?? (
- Modal Content
+ Modal Content
);
const open = props.open;
const onOpenChange = props.onOpenChange;
const modalWidth = props.modalWidth ?? "700px";
+const avoidDefaultDomBehavior = props.avoidDefaultDomBehavior;
const Overlay = styled.div`
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- display: grid;
- place-items: center;
- overflow-y: auto;
- z-index: 1000;
- width: 100vw;
- height: 100vh;
- background: rgba(0, 0, 0, 0.7);
- backdrop-filter: blur(6px);
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ display: grid;
+ place-items: center;
+ overflow-y: auto;
+ z-index: 99999;
+ width: 100vw;
+ height: 100vh;
+ background: rgba(0, 0, 0, 0.7);
+ backdrop-filter: blur(6px);
`;
const Content = styled.div`
- max-width: ${modalWidth};
- max-height: 100%;
- overflow-y: auto;
- margin-top: 20px;
- margin-bottom: 20px;
- outline: none !important;
+ max-width: ${modalWidth};
+ max-height: 100%;
+ overflow-y: auto;
+ margin-top: 20px;
+ margin-bottom: 20px;
+ outline: none !important;
`;
const NoButton = styled.button`
- background: transparent;
- border: none;
- padding: 0;
- margin: 0;
- box-shadow: none;
+ background: transparent;
+ border: none;
+ padding: 0;
+ margin: 0;
+ box-shadow: none;
`;
+const avoidDefaultBehavior = (e) => {
+ avoidDefaultDomBehavior && e.preventDefault();
+};
+
return (
-
-
- {toggle}
-
-
-
-
- {content}
-
-
-
-
+
+
+ {toggle}
+
+
+
+
+
+
+ {avoidDefaultDomBehavior && (
+
+
+
+
+
+ )}
+ {content}
+
+
+
+
+
+
);