Issue/326

src/modules/explorer/components/ProposalSelectionMenuLambda.tsx

@@ -1,13 +1,10 @@
-/* eslint-disable react/display-name */
-import { Grid, styled, Button, Typography } from "@material-ui/core"
+import { Grid, styled, Typography } from "@material-ui/core"
 import { RegistryProposalFormValues } from "modules/explorer/components/UpdateRegistryDialog"
 import { TreasuryProposalFormValues } from "modules/explorer/components/NewTreasuryProposalDialog"
 import React, { useState } from "react"
 import { useDAO } from "services/indexer/dao/hooks/useDAO"
 import { NFTTransferFormValues } from "./NFTTransfer"
 import { useDAOID } from "../pages/DAO/router"
-import { ProposalFormContainer } from "./ProposalForm"
-import { ConfigProposalForm } from "./ConfigProposalForm"
 import { ResponsiveDialog } from "./ResponsiveDialog"
 import { MainButton } from "../../common/MainButton"
 import { ProposalFormLambda } from "./ConfigProposalFormLambda"
@@ -45,7 +42,7 @@ export const ProposalSelectionMenuLambda: React.FC<Props> = ({ open, handleClose
   const [actionModal, setActionModal] = useState<ProposalModalKey>()
   const [openModal, setOpenModal] = useState(false)
 
-  const handleOptionSelected = (key: ProposalModalKey) => {
+  const handleOpenModal = (key: ProposalModalKey) => {
     setActionModal(key)
     setOpenModal(true)
     handleClose()
@@ -68,22 +65,22 @@ export const ProposalSelectionMenuLambda: React.FC<Props> = ({ open, handleClose
                 </Typography>
               </Grid>
               <Grid container justifyContent="center" style={{ gap: 20 }} direction={"column"}>
-                <MainButton variant={"contained"} onClick={() => handleOptionSelected(ProposalModalKey.add)}>
+                <MainButton variant={"contained"} onClick={() => handleOpenModal(ProposalModalKey.add)}>
                   Add Lambda
                 </MainButton>
 
                 <MainButton
                   variant={"contained"}
                   color={"secondary"}
-                  onClick={() => handleOptionSelected(ProposalModalKey.remove)}
+                  onClick={() => handleOpenModal(ProposalModalKey.remove)}
                 >
                   Remove Lambda
                 </MainButton>
 
                 <MainButton
                   variant={"contained"}
                   color={"secondary"}
-                  onClick={() => handleOptionSelected(ProposalModalKey.execute)}
+                  onClick={() => handleOpenModal(ProposalModalKey.execute)}
                 >
                   Execute Lambda
                 </MainButton>
@@ -93,7 +90,7 @@ export const ProposalSelectionMenuLambda: React.FC<Props> = ({ open, handleClose
         )}
       </ResponsiveDialog>
 
-      <ProposalFormLambda action={actionModal} open={openModal} handleClose={() => handleCloseModal()} />
+      <ProposalFormLambda action={actionModal} open={openModal} handleClose={handleCloseModal} />
     </>
   )
 }

src/modules/explorer/pages/ProposalDetails/components/CodeVisor.tsx

@@ -39,35 +39,34 @@ const CustomEditor = styled(Editor)({
 })
 interface Props {
   open: boolean
-  code: any
+  title?: string
+  code: string
   handleClose: () => void
 }
 
-export const CodeVisor: React.FC<Props> = ({ open, handleClose, code }) => {
+export const CodeVisor: React.FC<Props> = ({ open, title = "View Code", code, handleClose }) => {
   const grammar = Prism.languages.javascript
 
   return (
     <>
-      <CustomDialog open={open} onClose={handleClose} title={"View Code"} template={"lambda"}>
-        {code && (
-          <>
-            <Content container direction={"column"} style={{ gap: 32 }}>
-              <CustomEditor
-                disabled={false}
-                onValueChange={() => console.log("changed")}
-                value={code}
-                highlight={code => highlight(code, grammar, "javascript")}
-                padding={10}
-                style={{
-                  fontFamily: "Roboto Mono",
-                  fontSize: 14,
-                  fontWeight: 400,
-                  outlineWidth: 0
-                }}
-              />
-            </Content>
-          </>
-        )}
+      <CustomDialog open={open} onClose={handleClose} title={title} template="lambda">
+        <>
+          <Content container direction={"column"} style={{ gap: 32 }}>
+            <CustomEditor
+              disabled={false}
+              onValueChange={() => true}
+              value={code}
+              highlight={code => highlight(code, grammar, "javascript")}
+              padding={10}
+              style={{
+                fontFamily: "Roboto Mono",
+                fontSize: 14,
+                fontWeight: 400,
+                outlineWidth: 0
+              }}
+            />
+          </Content>
+        </>
       </CustomDialog>
     </>
   )

src/modules/explorer/pages/ProposalDetails/index.tsx

@@ -12,7 +12,7 @@ import { useParams } from "react-router"
 import { useAgoraTopic } from "services/agora/hooks/useTopic"
 import { BaseDAO } from "services/contracts/baseDAO"
 import { useDropProposal } from "services/contracts/baseDAO/hooks/useDropProposal"
-import { formatUnits, parseUnits, toShortAddress } from "services/contracts/utils"
+import { parseUnits, toShortAddress } from "services/contracts/utils"
 import { useDAO } from "services/indexer/dao/hooks/useDAO"
 import { useProposal } from "services/indexer/dao/hooks/useProposal"
 import { ContentContainer } from "../../components/ContentContainer"
@@ -23,6 +23,7 @@ import { HighlightedBadge } from "modules/explorer/components/styled/Highlighted
 import { TransferBadge } from "modules/explorer/components/TransferBadge"
 import {
   FA2Transfer,
+  LambdaProposal,
   Proposal,
   ProposalStatus,
   RegistryProposal,
@@ -36,7 +37,6 @@ import { ProposalTransferBadge } from "modules/explorer/components/ProposalTrans
 import { useUnstakeVotes } from "../../../../services/contracts/baseDAO/hooks/useUnstakeVotes"
 import { useTezos } from "../../../../services/beacon/hooks/useTezos"
 import { CodeVisor } from "./components/CodeVisor"
-import { FileCopyOutlined } from "@material-ui/icons"
 import { CopyButton } from "modules/common/CopyButton"
 
 const Container = styled(ContentContainer)({
@@ -91,7 +91,7 @@ const InfoTitle = styled(Typography)({
   marginTop: 37,
   fontWeight: 400,
   fontSize: 18,
-  lineHeight: "27px"
+  lineHeigh: "27px"
 })
 
 const InfoItem = styled(Typography)({
@@ -130,14 +130,14 @@ export const ProposalDetails: React.FC = () => {
   const [voteIsSupport, setVoteIsSupport] = useState(false)
   const theme = useTheme<Theme>()
   const { data: proposal } = useProposal(daoId, proposalId)
+  const isLambdaProposal = proposal?.type === "lambda"
   const { data: dao, cycleInfo } = useDAO(daoId)
   const isMobileSmall = useMediaQuery(theme.breakpoints.down("sm"))
   const { mutate: dropProposal } = useDropProposal()
   const { data: holdings } = useDAOHoldings(daoId)
   const { account } = useTezos()
   const canDropProposal = useCanDropProposal(daoId, proposalId)
   const { data: agoraPost } = useAgoraTopic(Number(proposal?.metadata?.agoraPostId))
-
   const [code, setCode] = React.useState<string>(`
   const allowances = new MichelsonMap();
   const ledger = new MichelsonMap();
@@ -183,6 +183,36 @@ export const ProposalDetails: React.FC = () => {
   const quorumThreshold = proposal?.quorumThreshold || new BigNumber(0)
   const { mutate: mutateUnstake } = useUnstakeVotes()
 
+  const getLambdaProposalInfo = useCallback(() => {
+    const info = {
+      type: "",
+      title: "",
+      code: ""
+    }
+
+    if (!isLambdaProposal) {
+      return info
+    }
+
+    const lambdaProposal = proposal as LambdaProposal
+    if (!!lambdaProposal.metadata.add_handler) {
+      info.type = "add_handler"
+      info.title = "Add Handler"
+      info.code = JSON.stringify(lambdaProposal.metadata.add_handler, null, 2)
+    } else if (!!lambdaProposal.metadata.remove_handler) {
+      info.type = "remove_handler"
+      info.title = "Remove Handler"
+      info.code = JSON.stringify(lambdaProposal.metadata.remove_handler, null, 2)
+    } else if (!!lambdaProposal.metadata.execute_handler) {
+      info.type = "execute_handler"
+      info.title = "Execute Handler"
+      info.code = JSON.stringify(lambdaProposal.metadata.execute_handler, null, 2)
+    }
+
+    return info
+  }, [proposal, isLambdaProposal])
+  const lambdaProposalInfo = getLambdaProposalInfo()
+
   const onClickVote = (support: boolean) => {
     setVoteIsSupport(support)
     setOpenVote(true)
@@ -305,13 +335,19 @@ export const ProposalDetails: React.FC = () => {
                         <UserBadge address={proposal.proposer} short={true} />
                       </Grid>
 
-                      <Grid item>
-                        <ViewCodeButton variant="contained" color="secondary" onClick={() => setOpenVisor(true)}>
-                          View Code
-                        </ViewCodeButton>
-
-                        <CodeVisor open={openVisor} handleClose={() => setOpenVisor(false)} code={code} />
-                      </Grid>
+                      {isLambdaProposal ? (
+                        <Grid item>
+                          <ViewCodeButton variant="contained" color="secondary" onClick={() => setOpenVisor(true)}>
+                            View Code
+                          </ViewCodeButton>
+                          <CodeVisor
+                            open={openVisor}
+                            code={lambdaProposalInfo.code}
+                            title={lambdaProposalInfo.title}
+                            handleClose={() => setOpenVisor(false)}
+                          />
+                        </Grid>
+                      ) : null}
                     </Grid>
                   )}
                 </Grid>
@@ -428,7 +464,7 @@ export const ProposalDetails: React.FC = () => {
             <Grid item container style={{ gap: 25 }}>
               {proposal ? (
                 <>
-                  {transfers.map((transfer, index) => {
+                  {transfers?.map((transfer, index) => {
                     return (
                       <Grid key={index} item container alignItems="center" direction={isMobileSmall ? "column" : "row"}>
                         {transfer.type === "XTZ" ? (
@@ -511,24 +547,34 @@ export const ProposalDetails: React.FC = () => {
                   )
                 })}
 
-              {true ? (
-                <Grid container direction="column">
-                  <Grid item>
-                    <InfoTitle color="secondary">Information</InfoTitle>
-                  </Grid>
-                  <Grid item container direction="row" alignItems="center">
-                    <InfoItem color="textPrimary">
-                      Contract Address: {"tz1XJcu9baEFdsgtawB7Twas6VxtetwJZcVF "}{" "}
-                    </InfoItem>
-                    <InfoCopyIcon text="tz1XJcu9baEFdsgtawB7Twas6VxtetwJZcVF" style={{ height: 15, marginLeft: -6 }} />
-                  </Grid>
-                  <Grid item container direction="row">
-                    <InfoItem color="textPrimary">Parameter 1: {"tz1bQgEea45ciBpYdFj4y4P3hNyDM8aMF6WB"}</InfoItem>
-                  </Grid>
-                  <Grid item container direction="row">
-                    <InfoItem color="textPrimary">Parameter 2: {"1300"}</InfoItem>
+              {isLambdaProposal ? (
+                <>
+                  <Grid container direction="column">
+                    <Grid item>
+                      <InfoTitle color="secondary">Information</InfoTitle>
+                    </Grid>
+                    <Grid item container direction="row" alignItems="center">
+                      <InfoItem color="textPrimary">
+                        Contract Address: {"Mock tz1XJcu9baEFdsgtawB7Twas6VxtetwJZcVF "}{" "}
+                      </InfoItem>
+                      <InfoCopyIcon
+                        text="Mock tz1XJcu9baEFdsgtawB7Twas6VxtetwJZcVF"
+                        style={{ height: 15, marginLeft: -6 }}
+                      />
+                    </Grid>
+                    <Grid item container direction="row">
+                      <InfoItem color="textPrimary">
+                        Parameter 1: {"Mock tz1bQgEea45ciBpYdFj4y4P3hNyDM8aMF6WB"}
+                      </InfoItem>
+                    </Grid>
+                    <Grid item container direction="row">
+                      <InfoItem color="textPrimary">Parameter 2: {"Mock 1300"}</InfoItem>
+                    </Grid>
+                    <Grid item container direction="row">
+                      <InfoItem color="textPrimary">Type: {lambdaProposalInfo.title}</InfoItem>
+                    </Grid>
                   </Grid>
-                </Grid>
+                </>
               ) : null}
             </Container>
           </Grid>

src/modules/explorer/pages/Proposals/index.tsx

@@ -11,7 +11,6 @@ import { ContentContainer } from "../../components/ContentContainer"
 import { ProposalsList } from "../../components/ProposalsList"
 import { DAOStatsRow } from "../../components/DAOStatsRow"
 import { ProposalStatus } from "services/indexer/dao/mappers/proposal/types"
-// import { ProposalFormContainer } from "modules/explorer/components/ProposalForm";
 import { InfoIcon } from "../../components/styled/InfoIcon"
 import { useIsProposalButtonDisabled } from "../../../../services/contracts/baseDAO/hooks/useCycleInfo"
 import { ProposalSelectionMenu } from "../../components/ProposalSelectionMenu"
@@ -77,14 +76,14 @@ export const Proposals: React.FC = () => {
     }
   }, [data, dropAllExpired, expiredProposals])
 
-  const onCloseModal = () => {
-    data?.data.dao_type?.name === "registry" ? setOpenModalLambda(false) : setOpenModal(false)
-  }
-
-  const handleProposalModal = () => {
-    // console.log("data?.data.dao_type: ", data?.data.dao_type);
-    // data?.data.dao_type?.name === "registry" ?  setOpenModalLambda(true) : setOpenModal(true);
-    setOpenModalLambda(true)
+  const toggleProposalModal = () => {
+    switch (data?.data.dao_type?.name) {
+      case "lambda":
+        setOpenModalLambda(!openModalLambda)
+        break
+      default:
+        setOpenModal(!openModal)
+    }
   }
 
   return (
@@ -126,13 +125,7 @@ export const Proposals: React.FC = () => {
               </Grid>
             </Grid>
             <Grid item>
-              <MainButton
-                variant="contained"
-                color="secondary"
-                onClick={handleProposalModal}
-                // disabled={false}
-                disabled={shouldDisable}
-              >
+              <MainButton variant="contained" color="secondary" onClick={toggleProposalModal} disabled={shouldDisable}>
                 New Proposal
               </MainButton>
               {shouldDisable && (
@@ -154,12 +147,8 @@ export const Proposals: React.FC = () => {
           <ProposalsList title={"All Proposals"} currentLevel={cycleInfo.currentLevel} proposals={proposals} />
         )}
       </Grid>
-      {/*<ProposalFormContainer*/}
-      {/*  open={openModal}*/}
-      {/*  handleClose={onCloseModal}*/}
-      {/*/>*/}
-      <ProposalSelectionMenu open={openModal} handleClose={onCloseModal} />
-      <ProposalSelectionMenuLambda open={openModalLambda} handleClose={onCloseModal} />
+      <ProposalSelectionMenu open={openModal} handleClose={toggleProposalModal} />
+      <ProposalSelectionMenuLambda open={openModalLambda} handleClose={toggleProposalModal} />
     </>
   )
 }

src/services/contracts/baseDAO/registryDAO/types.ts

@@ -418,8 +418,23 @@ export type PMRegistryProposal =
 export type PMLambdaProposal =
   | PMBaseProposal
   | {
-      transfer_proposal: {
-        agora_post_id: string
+      add_handler: {
+        code: Record<string, any>
+        handler_check: Record<string, string>
+        name: string
+      }
+    }
+  | {
+      remove_handler: {
+        code: Record<string, any>
+        handler_check: Record<string, string>
+        name: string
+      }
+    }
+  | {
+      execute_handler: {
+        code: Record<string, any>
+        handler_check: Record<string, string>
         name: string
       }
     }

src/services/indexer/dao/hooks/useDAO.ts

@@ -25,7 +25,6 @@ export const useDAO = (address: string) => {
       const response = await getDAO(address as string)
 
       const dao = response.daos[0]
-      console.log("dao: ", dao)
       const base = {
         ...dao,
         token: new Token({