feat: SOV-3236 proposal creation context and submission (#623)

DistributedCollective · Oct 5, 2023 · 72db499 · 72db499
1 parent 574e018
commit 72db499
Show file tree

Hide file tree

Showing 10 changed files with 349 additions and 39 deletions.
diff --git a/apps/frontend/src/app/3_organisms/TransactionStepDialog/TransactionStepDialog.types.ts b/apps/frontend/src/app/3_organisms/TransactionStepDialog/TransactionStepDialog.types.ts
@@ -24,19 +24,26 @@ export type TransactionStepData = {
   config: TransactionConfig;
 };
 
-export type Transaction = {
-  title: string;
-  subtitle?: string;
-  request: TransactionRequest;
-  onStart?: (hash: string) => void;
-  onComplete?: (result: string | PermitTransactionResponse) => void;
-  onChangeStatus?: (status: StatusType) => void;
-  updateHandler?: (
+export type TransactionCallbacks = {
+  onStart: (hash: string) => void;
+  onComplete: (result: string | PermitTransactionResponse) => void;
+  onChangeStatus: (status: StatusType) => void;
+};
+
+export type TransactionUpdateHandler = {
+  updateHandler: (
     request: TransactionRequest,
     receipts: TransactionReceipt[],
   ) => TransactionRequest | Promise<TransactionRequest>;
 };
 
+export type Transaction = {
+  title: string;
+  subtitle?: string;
+  request: TransactionRequest;
+} & Partial<TransactionCallbacks> &
+  Partial<TransactionUpdateHandler>;
+
 export enum TransactionType {
   signMessage = 'sign',
   signTypedData = 'signTypedData',

diff --git a/...frontend/src/app/5_pages/BitocracyPage/components/NewProposalButton/NewProposalButton.tsx b/...frontend/src/app/5_pages/BitocracyPage/components/NewProposalButton/NewProposalButton.tsx
@@ -12,6 +12,7 @@ import {
 
 import { translations } from '../../../../../locales/i18n';
 import { useGetPersonalStakingStatistics } from '../../../StakePage/components/PersonalStakingStatistics/hooks/useGetPersonalStakingStatistics';
+import { ProposalContextProvider } from '../../contexts/NewProposalContext';
 import { NewProposalForm } from '../NewProposalForm/NewProposalForm';
 
 const pageTranslations = translations.bitocracyPage;
@@ -30,7 +31,7 @@ export const NewProposalButton: FC = () => {
   );
 
   return (
-    <>
+    <ProposalContextProvider>
       {isNewProposalButtonVisible && (
         <div className="bg-gray-90 sm:bg-transparent p-4 pb-8 sm:p-0 border-t sm:border-none border-gray-60 flex items-center justify-center sm:ml-3 sm:relative fixed bottom-0 left-0 right-0 z-10 sm:z-0">
           <Button
@@ -53,6 +54,6 @@ export const NewProposalButton: FC = () => {
         />
         <DialogBody children={<NewProposalForm />} />
       </Dialog>
-    </>
+    </ProposalContextProvider>
   );
 };
diff --git a/...end/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.constants.ts b/...end/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.constants.ts
@@ -1,21 +1,18 @@
-import {
-  ProposalContract,
-  ProposalTreasury,
-  ProposalType,
-} from './NewProposalForm.types';
+import { ProposalCreationType } from '../../contexts/ProposalContext.types';
+import { ProposalContract, ProposalTreasury } from './NewProposalForm.types';
 
 export const PROPOSAL_TYPE_OPTIONS = [
   {
-    value: ProposalType.Parameter,
-    label: ProposalType.Parameter,
+    value: ProposalCreationType.Parameters,
+    label: ProposalCreationType.Parameters,
   },
   {
-    value: ProposalType.Proclamation,
-    label: ProposalType.Proclamation,
+    value: ProposalCreationType.Proclamation,
+    label: ProposalCreationType.Proclamation,
   },
   {
-    value: ProposalType.Treasury,
-    label: ProposalType.Treasury,
+    value: ProposalCreationType.Treasury,
+    label: ProposalCreationType.Treasury,
   },
 ];
 

diff --git a/apps/frontend/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.tsx b/apps/frontend/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.tsx
@@ -1,21 +1,57 @@
-import React, { FC, useState } from 'react';
+import React, { FC, useEffect, useState } from 'react';
 
 import { t } from 'i18next';
 
-import { Select, Button } from '@sovryn/ui';
+import { getProtocolContract } from '@sovryn/contracts';
+import { Select, Button, SelectOption } from '@sovryn/ui';
+
+import { defaultChainId } from '../../../../../config/chains';
 
 import { translations } from '../../../../../locales/i18n';
+import { useProposalContext } from '../../contexts/NewProposalContext';
+import { ProposalCreationType } from '../../contexts/ProposalContext.types';
 import {
-  PROPOSAL_CONTRACT_OPTIONS,
   PROPOSAL_TYPE_OPTIONS,
   PROPOSAL_TREASURY_OPTIONS,
 } from './NewProposalForm.constants';
-import { ProposalType } from './NewProposalForm.types';
 
 export const NewProposalForm: FC = () => {
-  const [proposalType, setProposalType] = useState(ProposalType.Parameter);
-  const [proposalContract, setProposalContract] = useState('');
+  const {
+    type: proposalType,
+    setType: setProposalType,
+    setDetails,
+    governor,
+    setGovernor,
+    submit,
+  } = useProposalContext();
   const [proposalTreasuryAccount, setProposalTreasuryAccount] = useState('');
+  const [governors, setGovernors] = useState<SelectOption<string>[]>([]);
+
+  // todo: these should be implemented in their own components.
+  useEffect(() => {
+    setDetails({
+      title: 'SIP: Default title',
+      link: 'https://sovryn.app',
+      summary: 'Default summary',
+      text: 'Default *text*',
+    });
+    Promise.all([
+      getProtocolContract('governorOwner', defaultChainId),
+      getProtocolContract('governorAdmin', defaultChainId),
+    ]).then(([owner, admin]) => {
+      setGovernors([
+        {
+          label: 'Owner',
+          value: owner.address,
+        },
+        {
+          label: 'Admin',
+          value: admin.address,
+        },
+      ]);
+      setGovernor(owner.address);
+    });
+  }, [setDetails, setGovernor]);
 
   return (
     <>
@@ -26,15 +62,15 @@ export const NewProposalForm: FC = () => {
           options={PROPOSAL_TYPE_OPTIONS}
           className="w-full"
         />
-        {proposalType === ProposalType.Parameter && (
+        {proposalType === ProposalCreationType.Parameters && (
           <Select
-            value={proposalContract}
-            onChange={setProposalContract}
-            options={PROPOSAL_CONTRACT_OPTIONS}
+            value={governor || ''}
+            onChange={setGovernor}
+            options={governors}
             className="w-full"
           />
         )}
-        {proposalType === ProposalType.Treasury && (
+        {proposalType === ProposalCreationType.Treasury && (
           <Select
             value={proposalTreasuryAccount}
             onChange={setProposalTreasuryAccount}
@@ -46,6 +82,7 @@ export const NewProposalForm: FC = () => {
         <Button
           text={t(translations.common.buttons.continue)}
           className="w-full sm:w-auto"
+          onClick={() => submit()}
         />
       </div>
     </>

diff --git a/...ontend/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.types.tsx b/...ontend/src/app/5_pages/BitocracyPage/components/NewProposalForm/NewProposalForm.types.tsx
@@ -1,9 +1,3 @@
-export enum ProposalType {
-  Parameter = 'Parameter',
-  Proclamation = 'Proclamation',
-  Treasury = 'Treasury',
-}
-
 export enum ProposalContract {
   SovrynProtocol = 'Sovryn Protocol',
   Staking = 'Staking',