accepted proposals

Author: marcoacierno

frontend/src/components/blocks/dynamic-content-display-section/accepted-proposals-content.tsx

@@ -1,3 +1,50 @@
+import {
+  CardPart,
+  FilterBar,
+  Heading,
+  HorizontalStack,
+  MultiplePartsCard,
+  MultiplePartsCardCollection,
+  Section,
+} from "@python-italia/pycon-styleguide";
+import { FormattedMessage } from "react-intl";
+import { VotingCard } from "~/components/voting-card";
+import { useCurrentLanguage } from "~/locale/context";
+import { useAcceptedProposalsQuery } from "~/types";
+
 export const AcceptedProposalsContent = () => {
-  return <div>accepted proposals</div>;
+  const language = useCurrentLanguage();
+  const {
+    data: {
+      conference: { submissions },
+    },
+  } = useAcceptedProposalsQuery({
+    variables: {
+      code: process.env.conferenceCode,
+      language,
+    },
+  });
+
+  return (
+    <Section>
+      <MultiplePartsCardCollection>
+        <MultiplePartsCard>
+          <CardPart contentAlign="left" overflow={true}>
+            <HorizontalStack justifyContent="spaceBetween" alignItems="center">
+              <Heading size={2}>
+                <FormattedMessage id="voting.proposals" />
+              </Heading>
+            </HorizontalStack>
+          </CardPart>
+        </MultiplePartsCard>
+        {submissions.map((submission) => (
+          <VotingCard
+            key={submission.id}
+            submission={submission}
+            showVotingUI={false}
+          />
+        ))}
+      </MultiplePartsCardCollection>
+    </Section>
+  );
 };

frontend/src/components/blocks/dynamic-content-display-section/accepted-proposals.graphql

@@ -1,7 +1,10 @@
+#import "../../fragments/submission-accordion.graphql"
+
 query AcceptedProposals($code: String!, $language: String!) {
   conference(code: $code) {
     id
     submissions(onlyAccepted: true) {
+      ...submissionAccordion
       id
       title(language: $language)
       speaker {

frontend/src/components/voting-card/index.tsx

@@ -17,10 +17,12 @@ import { type SubmissionAccordionFragment, useSendVoteMutation } from "~/types";
 
 type Props = {
   submission: SubmissionAccordionFragment;
+  showVotingUI?: boolean;
 };
 
 export const VotingCard = ({
   submission,
+  showVotingUI = true,
   submission: {
     id,
     title,
@@ -99,42 +101,44 @@ export const VotingCard = ({
       >
         <Heading size={4}>{title}</Heading>
       </CardPart>
-      <CardPart id="content" contentAlign="left" background="blue">
-        <InputNumber
-          values={[
-            {
-              value: 1,
-              label: <FormattedMessage id="voteSelector.notInterested" />,
-            },
-            {
-              value: 2,
-              label: <FormattedMessage id="voteSelector.maybe" />,
-            },
-            {
-              value: 3,
-              label: <FormattedMessage id="voteSelector.wantToSee" />,
-            },
-            {
-              value: 4,
-              label: <FormattedMessage id="voteSelector.mustSee" />,
-            },
-          ]}
-          value={submission?.myVote?.value}
-          onClick={onSubmitVote}
-        />
-
-        <Text size={3} color="error">
-          {error?.message}
-          {submissionData &&
-            submissionData.sendVote.__typename === "SendVoteErrors" && (
-              <>
-                {submissionData.sendVote.errors.nonFieldErrors}{" "}
-                {submissionData.sendVote.errors.validationSubmission}{" "}
-                {submissionData.sendVote.errors.validationValue}
-              </>
-            )}
-        </Text>
-      </CardPart>
+      {showVotingUI && (
+        <CardPart id="content" contentAlign="left" background="blue">
+          <InputNumber
+            values={[
+              {
+                value: 1,
+                label: <FormattedMessage id="voteSelector.notInterested" />,
+              },
+              {
+                value: 2,
+                label: <FormattedMessage id="voteSelector.maybe" />,
+              },
+              {
+                value: 3,
+                label: <FormattedMessage id="voteSelector.wantToSee" />,
+              },
+              {
+                value: 4,
+                label: <FormattedMessage id="voteSelector.mustSee" />,
+              },
+            ]}
+            value={submission?.myVote?.value}
+            onClick={onSubmitVote}
+          />
+
+          <Text size={3} color="error">
+            {error?.message}
+            {submissionData &&
+              submissionData.sendVote.__typename === "SendVoteErrors" && (
+                <>
+                  {submissionData.sendVote.errors.nonFieldErrors}{" "}
+                  {submissionData.sendVote.errors.validationSubmission}{" "}
+                  {submissionData.sendVote.errors.validationValue}
+                </>
+              )}
+          </Text>
+        </CardPart>
+      )}
       <CardPart id="content" contentAlign="left" background="white" size="none">
         <Grid cols={12} gap="none" divide={true}>
           <GridColumn colSpan={8}>