From f1125494ce26b71db0aba0e08df5b9be8d3f675f Mon Sep 17 00:00:00 2001
From: David Disu <daviddisu8@gmail.com>
Date: Mon, 11 Jul 2022 14:05:08 +0100
Subject: [PATCH] Added pre-deployment modal

---
 libs/remix-ui/helper/src/lib/helper-components.tsx   | 12 ++++++++++++
 libs/remix-ui/run-tab/src/lib/actions/events.ts      |  3 +--
 .../src/lib/components/contractDropdownUI.tsx        | 12 +++++++++++-
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/libs/remix-ui/helper/src/lib/helper-components.tsx b/libs/remix-ui/helper/src/lib/helper-components.tsx
index aa2928f691..8dc4e95a16 100644
--- a/libs/remix-ui/helper/src/lib/helper-components.tsx
+++ b/libs/remix-ui/helper/src/lib/helper-components.tsx
@@ -95,3 +95,15 @@ export const cancelUpgradeMsg = () => (
     <b>Upgrade with proxy cancelled.</b>
   </div>
 )
+
+export const deployWithProxyMsg = () => (
+  <div>
+    NOTE: Deploy With Proxy will initiate two (2) transactions. The first is for the deployment of your implementation contract and the second will be a deployment of an ERC1967 proxy contract.
+  </div>
+)
+
+export const upgradeWithProxyMsg = () => (
+  <div>
+    NOTE: Upgrade With Proxy will initiate two (2) transactions. The first is for the deployment of your implementation contract and the second will intiate a call to the upgradeTo function in your proxy contract.
+  </div>
+)
diff --git a/libs/remix-ui/run-tab/src/lib/actions/events.ts b/libs/remix-ui/run-tab/src/lib/actions/events.ts
index 0156ef8432..4355f4e87e 100644
--- a/libs/remix-ui/run-tab/src/lib/actions/events.ts
+++ b/libs/remix-ui/run-tab/src/lib/actions/events.ts
@@ -6,7 +6,6 @@ import { addDeployOption, clearAllInstances, clearRecorderCount, fetchContractLi
 import { CompilerAbstract } from '@remix-project/remix-solidity'
 import * as ethJSUtil from 'ethereumjs-util'
 import Web3 from 'web3'
-import { ContractSources } from "../types"
 
 export const setupEvents = (plugin: RunTab, dispatch: React.Dispatch<any>) => {
   plugin.blockchain.events.on('newTransaction', (tx, receipt) => {
@@ -93,7 +92,7 @@ export const setupEvents = (plugin: RunTab, dispatch: React.Dispatch<any>) => {
   })
 }
 
-const broadcastCompilationResult = async (plugin: RunTab, dispatch: React.Dispatch<any>, file, source, languageVersion, data: ContractSources, input?) => {
+const broadcastCompilationResult = async (plugin: RunTab, dispatch: React.Dispatch<any>, file, source, languageVersion, data, input?) => {
   // TODO check whether the tab is configured
   const compiler = new CompilerAbstract(languageVersion, data, source, input)
 
diff --git a/libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx b/libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx
index da13ce63d6..556491bc2c 100644
--- a/libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx
+++ b/libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx
@@ -4,6 +4,7 @@ import { ContractDropdownProps, DeployMode } from '../types'
 import { ContractData, FuncABI } from '@remix-project/core-plugin'
 import * as ethJSUtil from 'ethereumjs-util'
 import { ContractGUI } from './contractGUI'
+import { deployWithProxyMsg, upgradeWithProxyMsg } from '@remix-ui/helper'
 
 export function ContractDropdownUI (props: ContractDropdownProps) {
   const [abiLabel, setAbiLabel] = useState<{
@@ -156,7 +157,16 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
       return props.modal('Alert', 'This contract may be abstract, it may not implement an abstract parent\'s methods completely or it may not invoke an inherited contract\'s constructor correctly.', 'OK', () => {})
     }
     if ((selectedContract.name !== currentContract) && (selectedContract.name === 'ERC1967Proxy')) selectedContract.name = currentContract
-    props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
+    const isProxyDeployment = (deployMode || []).find(mode => mode === 'Deploy with Proxy')
+    const isContractUpgrade = (deployMode || []).find(mode => mode === 'Upgrade with Proxy')
+  
+    if (isProxyDeployment || isContractUpgrade) {
+      props.modal('ERC1967', isProxyDeployment ? deployWithProxyMsg() : upgradeWithProxyMsg(), 'Proceed', () => {
+        props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
+      }, 'Cancel', () => {})
+    } else {
+      props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
+    }
   }
 
   const atAddressChanged = (event) => {