feat: enable osnap selection to restrict voting types (snapshot-labs#…

…3992) * feat: enable osnap selection to restrict voting types Signed-off-by: david <[email protected]> * skip transaction page if osnap disabled Signed-off-by: david <[email protected]> * look at correct network when verifying osnap Signed-off-by: david <[email protected]> * move osnap selection to vote page, and make checkbox Signed-off-by: david <[email protected]> * fix spelling, formatting, ensure vote selections disabled with osnap Signed-off-by: david <[email protected]> --------- Signed-off-by: david <[email protected]>
hradma · Jun 24, 2023 · add17ea · add17ea
1 parent 1b954cf
commit add17ea
Show file tree

Hide file tree

Showing 2 changed files with 78 additions and 7 deletions.
diff --git a/src/components/SpaceCreateVoting.vue b/src/components/SpaceCreateVoting.vue
@@ -6,6 +6,7 @@ const props = defineProps<{
   space: ExtendedSpace;
   dateStart: number;
   dateEnd: number;
+  osnap: { enabled: boolean; selection: boolean };
 }>();
 
 const {
@@ -53,24 +54,58 @@ watch(
   { immediate: true }
 );
 
+// we need to watch for selection change to properly update the voting form stae
+watch(
+  () => props.osnap.selection,
+  () => {
+    // If using osnap, we can only allow basic voting, for, against, abstain
+    if (props.osnap.selection) {
+      form.value.type = 'basic';
+    } else {
+      // Initialize the proposal type if set in space
+      if (props.space?.voting?.type) form.value.type = props.space.voting.type;
+    }
+  }
+);
+
 const { getSnapshot } = useSnapshot();
 
 onMounted(async () => {
   // Initialize the start date to current
   if (!sourceProposalLoaded.value && !userSelectedDateStart.value)
     form.value.start = Number((Date.now() / 1e3).toFixed());
-  // Initialize the proposal type if set in space
-  if (props.space?.voting?.type) form.value.type = props.space.voting.type;
   form.value.snapshot = await getSnapshot(props.space.network);
 });
+
+defineEmits<{
+  (event: 'osnapToggle'): void;
+}>();
 </script>
 
 <template>
+  <div v-if="osnap.enabled" class="mb-4">
+    <h6>oSnap Proposal</h6>
+    <p>
+      Are you planning for this proposal to initiate a transaction that your
+      organizations Safe will execute if approved? (Remember, oSnap enables
+      trustless and permissionless execution)
+    </p>
+    <br />
+    <input
+      id="toggleOsnap"
+      type="checkbox"
+      :checked="osnap.selection"
+      @change="$emit('osnapToggle')"
+    />
+    <label for="toggleOsnap">
+      Yes, use oSnap for transactions (this will restrict voting types).
+    </label>
+  </div>
   <div class="mb-5 space-y-4">
     <BaseBlock :title="$t('create.voting')">
       <InputSelectVoteType
         :type="space.voting?.type || form.type"
-        :disabled="!!space.voting?.type"
+        :disabled="!!space.voting?.type || osnap.selection"
         @update:type="value => (form.type = value)"
       />
 

diff --git a/src/views/SpaceCreate.vue b/src/views/SpaceCreate.vue
@@ -4,6 +4,9 @@ import { getInstance } from '@snapshot-labs/lock/plugins/vue3';
 import { PROPOSAL_QUERY } from '@/helpers/queries';
 import { proposalValidation } from '@/helpers/snapshot';
 import { ExtendedSpace } from '@/helpers/interfaces';
+import Plugin from '@/plugins/safeSnap';
+
+const safeSnapPlugin = new Plugin();
 
 enum Step {
   CONTENT,
@@ -169,7 +172,6 @@ const { resetSpaceProposals } = useProposals();
 async function handleSubmit() {
   const formattedForm = getFormattedForm();
   const result = await send(props.space, 'proposal', formattedForm);
-  console.log('Result', result);
   if (result.id) {
     resetSpaceProposals();
     notify(['green', t('notify.proposalCreated')]);
@@ -222,6 +224,8 @@ async function loadSourceProposal() {
 
 function nextStep() {
   if (formContainsShortUrl.value) return;
+  // skip transaction page if user has osnap, but chosen not to use it for this vote
+  if (shouldSkipTransactions()) return;
   currentStep.value++;
 }
 
@@ -264,10 +268,9 @@ async function validateAuthor() {
       );
 
       isValidAuthor.value = validationRes;
-      console.log('Pass validation?', validationRes, validationName.value);
     } catch (e) {
       hasAuthorValidationFailed.value = true;
-      console.log(e);
+      console.warn(e);
     } finally {
       validationLoading.value = false;
     }
@@ -282,7 +285,37 @@ watch(
   { immediate: true }
 );
 
+// We need to know if the space is using osnap, this will change what types of voting we can do
+// We also need to know if the user plans to use osnap
+const osnap = ref<{
+  enabled: boolean;
+  selection: boolean;
+}>({
+  selection: false,
+  enabled: false
+});
+
+// Skip transaction page if osnap is enabled, its not selected to be used, and we are on the voting page
+function shouldSkipTransactions() {
+  return (
+    osnap.value.enabled &&
+    !osnap.value.selection &&
+    currentStep.value === Step.VOTING
+  );
+}
+
+function handleOsnapToggle() {
+  osnap.value.selection = !osnap.value.selection;
+}
+
 onMounted(async () => {
+  const network = props?.space?.plugins?.safeSnap?.safes?.[0]?.network;
+  const umaAddress = props?.space?.plugins?.safeSnap?.safes?.[0]?.umaAddress;
+  if (network && umaAddress) {
+    // this is how we check if osnap is enabled and valid.
+    osnap.value.enabled =
+      (await safeSnapPlugin.validateUmaModule(network, umaAddress)) === 'uma';
+  }
   if (sourceProposal.value && !sourceProposalLoaded.value)
     await loadSourceProposal();
 
@@ -338,6 +371,8 @@ onMounted(async () => {
         :space="space"
         :date-start="dateStart"
         :date-end="dateEnd"
+        :osnap="osnap"
+        @osnapToggle="handleOsnapToggle"
       />
 
       <!-- Step 3 (only when plugins) -->
@@ -363,7 +398,8 @@ onMounted(async () => {
         <BaseButton
           v-if="
             currentStep === Step.PLUGINS ||
-            (!needsPluginConfigs && currentStep === Step.VOTING)
+            (!needsPluginConfigs && currentStep === Step.VOTING) ||
+            shouldSkipTransactions()
           "
           :disabled="!isFormValid"
           :loading="isSending || queryLoading || isSnapshotLoading"