snapshot message now changes when space is changed in dropdown (#7007)

* snapshot message now changes when space is changed in dropdown * deleted commented out code * deleted console log * refactored code to not be redundant * destructured props to pass tests and clean up codebase
hicommonwealth · Mar 18, 2024 · 315dddc · 315dddc
1 parent 4325a55
commit 315dddc
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 9 deletions.
diff --git a/packages/commonwealth/client/scripts/views/modals/new_snapshot_proposal_modal.tsx b/packages/commonwealth/client/scripts/views/modals/new_snapshot_proposal_modal.tsx
@@ -1,13 +1,13 @@
-import React, { useState, useEffect, useMemo } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 
 import type Thread from '../../models/Thread';
 import app from '../../state';
-import { NewSnapshotProposalForm } from '../pages/new_snapshot_proposal';
 import { CWDropdown } from '../components/component_kit/cw_dropdown';
 import {
   CWModalBody,
   CWModalHeader,
 } from '../components/component_kit/new_designs/CWModal';
+import { NewSnapshotProposalForm } from '../pages/new_snapshot_proposal';
 
 import '../../../styles/modals/new_snapshot_proposal_modal.scss';
 
@@ -23,16 +23,20 @@ export const NewSnapshotProposalModal = ({
   onModalClose,
 }: NewSnapshotProposalModalProps) => {
   const [selectedSnapshotId, setSelectedSnapshotId] = useState<string | null>(
-    null
+    null,
   );
+  const handleSelect = async (item) => {
+    setSelectedSnapshotId(item.value);
+    await app.snapshot.init(item.value);
+  };
 
   const snapshotOptions = useMemo(
     () =>
       app.chain?.meta.snapshot.map((snapshot) => ({
         value: snapshot,
         label: snapshot,
       })) || [],
-    []
+    [],
   );
 
   useEffect(() => {
@@ -50,7 +54,7 @@ export const NewSnapshotProposalModal = ({
             <CWDropdown
               label="Select Snapshot Space"
               options={snapshotOptions}
-              onSelect={(item) => setSelectedSnapshotId(item.value)}
+              onSelect={handleSelect}
             />
             {selectedSnapshotId && (
               <NewSnapshotProposalForm

diff --git a/packages/commonwealth/client/scripts/views/pages/snapshot_proposals/SnapshotProposalCard.tsx b/packages/commonwealth/client/scripts/views/pages/snapshot_proposals/SnapshotProposalCard.tsx
@@ -16,16 +16,19 @@ type SnapshotProposalCardProps = {
   showSkeleton?: boolean;
 };
 
-export const SnapshotProposalCard = (props: SnapshotProposalCardProps) => {
-  const { proposal, snapshotId } = props;
+export const SnapshotProposalCard = ({
+  showSkeleton,
+  snapshotId,
+  proposal,
+}: SnapshotProposalCardProps) => {
   const navigate = useCommonNavigate();
 
   const proposalLink = `/snapshot/${snapshotId}/${proposal.id}`;
 
   const time = moment(+proposal.end * 1000);
   const now = moment();
 
-  if (props.showSkeleton) return <SnapshotProposalCardSkeleton />
+  if (showSkeleton) return <SnapshotProposalCardSkeleton />;
 
   // TODO: display proposal.scores and proposal.scores_total on card
   return (
@@ -48,7 +51,7 @@ export const SnapshotProposalCard = (props: SnapshotProposalCardProps) => {
       <div className="proposal-card-metadata">
         <ProposalTag
           label={`${proposal.ipfs.slice(0, 6)}...${proposal.ipfs.slice(
-            proposal.ipfs.length - 6
+            proposal.ipfs.length - 6,
           )}`}
         />
         <CWText title={proposal.title} fontWeight="semiBold" noWrap>