diff --git a/.changeset/breezy-owls-clean.md b/.changeset/breezy-owls-clean.md
new file mode 100644
index 000000000..6b9d144e8
--- /dev/null
+++ b/.changeset/breezy-owls-clean.md
@@ -0,0 +1,5 @@
+---
+"@snapshot-labs/sx": patch
+---
+
+support submitting a reason when voting
diff --git a/apps/ui/src/components/IndicatorVotingPower.vue b/apps/ui/src/components/IndicatorVotingPower.vue
index 32c50f3be..428260e45 100644
--- a/apps/ui/src/components/IndicatorVotingPower.vue
+++ b/apps/ui/src/components/IndicatorVotingPower.vue
@@ -1,40 +1,29 @@
 <script setup lang="ts">
-import { _vp } from '@/helpers/utils';
+import { getFormattedVotingPower } from '@/helpers/utils';
 import { evmNetworks } from '@/networks';
-import { VotingPower, VotingPowerStatus } from '@/networks/types';
+import { VotingPowerItem } from '@/stores/votingPowers';
 import { NetworkID } from '@/types';
 
 const props = defineProps<{
   networkId: NetworkID;
-  status: VotingPowerStatus;
-  votingPowerSymbol: string;
-  votingPowers: VotingPower[];
+  votingPower?: VotingPowerItem;
 }>();
 
 defineEmits<{
-  (e: 'getVotingPower');
+  (e: 'fetchVotingPower');
 }>();
 
 const { web3 } = useWeb3();
 
 const modalOpen = ref(false);
 
-const votingPower = computed(() =>
-  props.votingPowers.reduce((acc, b) => acc + b.value, 0n)
+const formattedVotingPower = computed(() =>
+  getFormattedVotingPower(props.votingPower)
 );
-const decimals = computed(() =>
-  Math.max(...props.votingPowers.map(votingPower => votingPower.decimals), 0)
-);
-const formattedVotingPower = computed(() => {
-  const value = _vp(Number(votingPower.value) / 10 ** decimals.value);
-
-  if (props.votingPowerSymbol) {
-    return `${value} ${props.votingPowerSymbol}`;
-  }
 
-  return value;
-});
-const loading = computed(() => props.status === 'loading');
+const loading = computed(
+  () => !props.votingPower || props.votingPower.status === 'loading'
+);
 
 function handleModalOpen() {
   modalOpen.value = true;
@@ -63,7 +52,7 @@ function handleModalOpen() {
         >
           <IH-lightning-bolt class="inline-block -ml-1" />
           <IH-exclamation
-            v-if="props.status === 'error'"
+            v-if="props.votingPower?.status === 'error'"
             class="inline-block ml-1 text-rose-500"
           />
           <span v-else class="ml-1">{{ formattedVotingPower }}</span>
@@ -74,12 +63,9 @@ function handleModalOpen() {
       <ModalVotingPower
         :open="modalOpen"
         :network-id="networkId"
-        :voting-power-symbol="votingPowerSymbol"
-        :voting-powers="props.votingPowers"
-        :voting-power-status="status"
-        :final-decimals="decimals"
+        :voting-power="props.votingPower"
         @close="modalOpen = false"
-        @get-voting-power="$emit('getVotingPower')"
+        @fetch-voting-power="$emit('fetchVotingPower')"
       />
     </teleport>
   </div>
diff --git a/apps/ui/src/components/MessageVotingPower.vue b/apps/ui/src/components/MessageVotingPower.vue
new file mode 100644
index 000000000..0193b979c
--- /dev/null
+++ b/apps/ui/src/components/MessageVotingPower.vue
@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import { VotingPowerItem } from '@/stores/votingPowers';
+
+defineProps<{
+  votingPower: VotingPowerItem;
+  action?: 'vote' | 'propose';
+}>();
+
+defineEmits<{
+  (e: 'fetchVotingPower');
+}>();
+</script>
+
+<template>
+  <div
+    v-if="votingPower.status === 'error'"
+    class="flex flex-col gap-3 items-start"
+    v-bind="$attrs"
+  >
+    <UiAlert type="error">
+      There was an error fetching your voting power.
+    </UiAlert>
+    <UiButton
+      type="button"
+      class="flex items-center gap-2"
+      @click="$emit('fetchVotingPower')"
+    >
+      <IH-refresh />Retry
+    </UiButton>
+  </div>
+  <UiAlert
+    v-else-if="action === 'vote' && !votingPower.canVote"
+    type="error"
+    v-bind="$attrs"
+  >
+    You do not have enough voting power to vote.
+  </UiAlert>
+  <UiAlert
+    v-else-if="action === 'propose' && !votingPower.canPropose"
+    type="error"
+    v-bind="$attrs"
+  >
+    You do not have enough voting power to create proposal in this space.
+  </UiAlert>
+</template>
diff --git a/apps/ui/src/components/Modal/Vote.vue b/apps/ui/src/components/Modal/Vote.vue
new file mode 100644
index 000000000..9555b9afd
--- /dev/null
+++ b/apps/ui/src/components/Modal/Vote.vue
@@ -0,0 +1,168 @@
+<script setup lang="ts">
+import { getChoiceText, getFormattedVotingPower } from '@/helpers/utils';
+import { getValidator } from '@/helpers/validation';
+import { Choice, Proposal } from '@/types';
+
+const REASON_DEFINITION = {
+  title: 'Reason',
+  type: 'string',
+  format: 'long',
+  examples: ['Share you reason (optional)'],
+  maxLength: 1000
+};
+
+const props = defineProps<{
+  proposal: Proposal;
+  choice: Choice | null;
+  open: boolean;
+}>();
+
+const emit = defineEmits<{
+  (e: 'close');
+  (e: 'voted');
+}>();
+
+const { vote } = useActions();
+const { web3 } = useWeb3();
+const {
+  votingPower,
+  fetch: fetchVotingPower,
+  reset: resetVotingPower
+} = useVotingPower();
+
+const loading = ref(false);
+const form = ref<Record<string, string>>({ reason: '' });
+const formErrors = ref({} as Record<string, any>);
+const formValidated = ref(false);
+
+const formValidator = getValidator({
+  $async: true,
+  type: 'object',
+  title: 'Reason',
+  additionalProperties: false,
+  required: [],
+  properties: {
+    reason: REASON_DEFINITION
+  }
+});
+
+const formattedVotingPower = computed(() =>
+  getFormattedVotingPower(votingPower.value)
+);
+
+const canSubmit = computed(
+  () =>
+    formValidated &&
+    !!props.choice &&
+    Object.keys(formErrors.value).length === 0 &&
+    votingPower.value?.canVote
+);
+
+async function handleSubmit() {
+  loading.value = true;
+
+  if (!props.choice) return;
+
+  try {
+    await vote(props.proposal, props.choice, form.value.reason);
+    emit('voted');
+    emit('close');
+  } finally {
+    loading.value = false;
+  }
+}
+
+function handleFetchVotingPower() {
+  fetchVotingPower(props.proposal);
+}
+
+watch(
+  [() => props.open, () => web3.value.account],
+  ([open, toAccount], [, fromAccount]) => {
+    if (fromAccount && toAccount && fromAccount !== toAccount) {
+      resetVotingPower();
+    }
+
+    if (open) handleFetchVotingPower();
+  },
+  { immediate: true }
+);
+
+watchEffect(async () => {
+  formValidated.value = false;
+
+  formErrors.value = await formValidator.validateAsync(form.value);
+  formValidated.value = true;
+});
+</script>
+
+<template>
+  <UiModal :open="open" @close="$emit('close')">
+    <template #header>
+      <h3>Cast your vote</h3>
+    </template>
+    <div class="m-4 mb-3 flex flex-col space-y-3">
+      <MessageVotingPower
+        v-if="votingPower"
+        :voting-power="votingPower"
+        action="vote"
+        @fetch-voting-power="handleFetchVotingPower"
+      />
+      <dl>
+        <dt class="text-sm leading-5">Choice</dt>
+        <dd class="text-skin-heading text-[20px] leading-6">
+          <span
+            v-if="choice"
+            class="test-skin-heading font-semibold"
+            v-text="getChoiceText(proposal.choices, choice)"
+          />
+          <div v-else class="flex gap-1 text-skin-danger items-center">
+            <IH-exclamation-circle />
+            No choice selected
+          </div>
+        </dd>
+        <dt class="text-sm leading-5 mt-3">Voting power</dt>
+        <dd v-if="!votingPower || votingPower.status === 'loading'">
+          <UiLoading />
+        </dd>
+        <dd
+          v-else-if="votingPower.status === 'success'"
+          class="font-semibold text-skin-heading text-[20px] leading-6"
+          v-text="formattedVotingPower"
+        />
+        <dd
+          v-else-if="votingPower.status === 'error'"
+          class="font-semibold text-skin-heading text-[20px] leading-6"
+          v-text="formattedVotingPower"
+        />
+      </dl>
+      <div class="s-box">
+        <UiForm
+          v-model="form"
+          :error="formErrors"
+          :definition="{ properties: { reason: REASON_DEFINITION } }"
+        />
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="flex flex-col xs:flex-row gap-3">
+        <UiButton
+          class="w-full order-last xs:order-none"
+          @click="$emit('close')"
+        >
+          Cancel
+        </UiButton>
+        <UiButton
+          primary
+          class="w-full"
+          :disabled="!canSubmit"
+          :loading="loading"
+          @click="handleSubmit"
+        >
+          Confirm
+        </UiButton>
+      </div>
+    </template>
+  </UiModal>
+</template>
diff --git a/apps/ui/src/components/Modal/VotingPower.vue b/apps/ui/src/components/Modal/VotingPower.vue
index 76de4cfe0..688ebc73e 100644
--- a/apps/ui/src/components/Modal/VotingPower.vue
+++ b/apps/ui/src/components/Modal/VotingPower.vue
@@ -2,21 +2,18 @@
 import { _n, shorten } from '@/helpers/utils';
 import { addressValidator as isValidAddress } from '@/helpers/validation';
 import { getNetwork } from '@/networks';
-import { VotingPower, VotingPowerStatus } from '@/networks/types';
+import { VotingPowerItem } from '@/stores/votingPowers';
 import { NetworkID } from '@/types';
 
 const props = defineProps<{
   open: boolean;
   networkId: NetworkID;
-  votingPowerSymbol: string;
-  votingPowers: VotingPower[];
-  votingPowerStatus: VotingPowerStatus;
-  finalDecimals: number;
+  votingPower?: VotingPowerItem;
 }>();
 
 defineEmits<{
   (e: 'close');
-  (e: 'getVotingPower');
+  (e: 'fetchVotingPower');
 }>();
 
 const network = computed(() => getNetwork(props.networkId));
@@ -25,8 +22,9 @@ const baseNetwork = computed(() =>
     ? getNetwork(network.value.baseNetworkId)
     : network.value
 );
-const loading = computed(() => props.votingPowerStatus === 'loading');
-const error = computed(() => props.votingPowerStatus === 'error');
+const loading = computed(
+  () => !props.votingPower || props.votingPower.status === 'loading'
+);
 </script>
 
 <template>
@@ -35,21 +33,14 @@ const error = computed(() => props.votingPowerStatus === 'error');
       <h3>Your voting power</h3>
     </template>
     <UiLoading v-if="loading" class="p-4 block text-center" />
-    <div v-else>
-      <div v-if="error" class="p-4 flex flex-col gap-3 items-start">
-        <UiAlert type="error"
-          >There was an error fetching your voting power.</UiAlert
-        >
-        <UiButton
-          type="button"
-          class="flex items-center gap-2"
-          @click="$emit('getVotingPower')"
-        >
-          <IH-refresh />Retry
-        </UiButton>
-      </div>
+    <div v-else-if="votingPower">
+      <MessageVotingPower
+        class="p-4"
+        :voting-power="votingPower"
+        @fetch-voting-power="$emit('fetchVotingPower')"
+      />
       <div
-        v-for="(strategy, i) in votingPowers"
+        v-for="(strategy, i) in votingPower.votingPowers"
         :key="i"
         class="py-3 px-4 border-b last:border-b-0"
       >
@@ -67,12 +58,16 @@ const error = computed(() => props.votingPowerStatus === 'error');
           />
           <div class="text-skin-link shrink-0">
             {{
-              _n(Number(strategy.value) / 10 ** finalDecimals, 'compact', {
-                maximumFractionDigits: 2,
-                formatDust: true
-              })
+              _n(
+                Number(strategy.value) / 10 ** votingPower.decimals,
+                'compact',
+                {
+                  maximumFractionDigits: 2,
+                  formatDust: true
+                }
+              )
             }}
-            {{ votingPowerSymbol }}
+            {{ votingPower.symbol }}
           </div>
         </div>
         <div class="flex justify-between">
diff --git a/apps/ui/src/components/ProposalVoteApproval.vue b/apps/ui/src/components/ProposalVoteApproval.vue
index aebeebbcd..3f348387b 100644
--- a/apps/ui/src/components/ProposalVoteApproval.vue
+++ b/apps/ui/src/components/ProposalVoteApproval.vue
@@ -4,7 +4,6 @@ import { Choice, Proposal } from '@/types';
 type ApprovalChoice = number[];
 
 const props = defineProps<{
-  sendingType: Choice | null;
   proposal: Proposal;
   defaultChoice?: Choice;
 }>();
@@ -45,7 +44,6 @@ function toggleSelectedChoice(choice: number) {
     <UiButton
       primary
       class="!h-[48px] w-full"
-      :loading="!!sendingType"
       @click="emit('vote', selectedChoices)"
     >
       Vote
diff --git a/apps/ui/src/components/ProposalVoteBasic.vue b/apps/ui/src/components/ProposalVoteBasic.vue
index cab3ff8f5..da0c9dba5 100644
--- a/apps/ui/src/components/ProposalVoteBasic.vue
+++ b/apps/ui/src/components/ProposalVoteBasic.vue
@@ -3,7 +3,6 @@ import { Choice } from '@/types';
 
 withDefaults(
   defineProps<{
-    sendingType: Choice | null;
     size?: number;
   }>(),
   { size: 48 }
@@ -23,7 +22,6 @@ const emit = defineEmits<{
           '!size-[48px]': size === 48,
           '!size-[40px]': size === 40
         }"
-        :loading="sendingType === 'for'"
         @click="emit('vote', 'for')"
       >
         <IH-check class="inline-block" />
@@ -36,7 +34,6 @@ const emit = defineEmits<{
           '!size-[48px]': size === 48,
           '!size-[40px]': size === 40
         }"
-        :loading="sendingType === 'against'"
         @click="emit('vote', 'against')"
       >
         <IH-x class="inline-block" />
@@ -49,7 +46,6 @@ const emit = defineEmits<{
           '!size-[48px]': size === 48,
           '!size-[40px]': size === 40
         }"
-        :loading="sendingType === 'abstain'"
         @click="emit('vote', 'abstain')"
       >
         <IH-minus-sm class="inline-block" />
diff --git a/apps/ui/src/components/ProposalVoteRankedChoice.vue b/apps/ui/src/components/ProposalVoteRankedChoice.vue
index 2f62a1e67..2375e3aef 100644
--- a/apps/ui/src/components/ProposalVoteRankedChoice.vue
+++ b/apps/ui/src/components/ProposalVoteRankedChoice.vue
@@ -5,7 +5,6 @@ import { Choice, Proposal } from '@/types';
 type RankedChoice = number[];
 
 const props = defineProps<{
-  sendingType: Choice | null;
   proposal: Proposal;
   defaultChoice?: Choice;
 }>();
@@ -49,7 +48,6 @@ const selectedChoices = ref<RankedChoice>(
     <UiButton
       primary
       class="!h-[48px] w-full"
-      :loading="!!sendingType"
       @click="emit('vote', selectedChoices)"
     >
       Vote
diff --git a/apps/ui/src/components/ProposalVoteSingleChoice.vue b/apps/ui/src/components/ProposalVoteSingleChoice.vue
index a6e10d93c..747345d31 100644
--- a/apps/ui/src/components/ProposalVoteSingleChoice.vue
+++ b/apps/ui/src/components/ProposalVoteSingleChoice.vue
@@ -2,7 +2,6 @@
 import { Choice, Proposal } from '@/types';
 
 const props = defineProps<{
-  sendingType: Choice | null;
   proposal: Proposal;
   defaultChoice?: Choice;
 }>();
@@ -33,7 +32,6 @@ const selectedChoice = ref<number | null>(
     <UiButton
       primary
       class="!h-[48px] w-full"
-      :loading="!!sendingType"
       :disabled="!selectedChoice"
       @click="emit('vote', selectedChoice!)"
     >
diff --git a/apps/ui/src/components/ProposalVoteWeighted.vue b/apps/ui/src/components/ProposalVoteWeighted.vue
index b418168c8..b20e7a864 100644
--- a/apps/ui/src/components/ProposalVoteWeighted.vue
+++ b/apps/ui/src/components/ProposalVoteWeighted.vue
@@ -5,7 +5,6 @@ import { Choice, Proposal } from '@/types';
 type WeightedChoice = Record<string, number>;
 
 const props = defineProps<{
-  sendingType: Choice | null;
   proposal: Proposal;
   defaultChoice?: Choice;
 }>();
@@ -90,7 +89,6 @@ watch(
     <UiButton
       primary
       class="!h-[48px] w-full"
-      :loading="!!sendingType"
       @click="$emit('vote', selectedChoices)"
     >
       Vote
diff --git a/apps/ui/src/components/ProposalsListItem.vue b/apps/ui/src/components/ProposalsListItem.vue
index 141b9ffa6..323ca66cb 100644
--- a/apps/ui/src/components/ProposalsListItem.vue
+++ b/apps/ui/src/components/ProposalsListItem.vue
@@ -6,22 +6,25 @@ import { Choice, Proposal as ProposalType } from '@/types';
 const props = defineProps<{ proposal: ProposalType; showSpace: boolean }>();
 
 const { getTsFromCurrent } = useMetaStore();
-const { vote } = useActions();
+const { modalAccountOpen } = useModal();
+const { web3 } = useWeb3();
+
 const { votes } = useAccount();
 const modalOpenTimeline = ref(false);
-const sendingType = ref<Choice | null>(null);
+const modalOpenVote = ref(false);
+const selectedChoice = ref<Choice | null>(null);
 
 const totalProgress = computed(() => quorumProgress(props.proposal));
 
-async function handleVoteClick(choice: Choice) {
-  sendingType.value = choice;
-
-  try {
-    await vote(props.proposal, choice);
-  } finally {
-    sendingType.value = null;
+const handleVoteClick = (choice: Choice) => {
+  if (!web3.value.account) {
+    modalAccountOpen.value = true;
+    return;
   }
-}
+
+  selectedChoice.value = choice;
+  modalOpenVote.value = true;
+};
 </script>
 <template>
   <div>
@@ -136,7 +139,6 @@ async function handleVoteClick(choice: Choice) {
           </template>
           <ProposalVoteBasic
             v-if="proposal.type === 'basic'"
-            :sending-type="sendingType"
             :size="40"
             @vote="handleVoteClick"
           />
@@ -149,6 +151,13 @@ async function handleVoteClick(choice: Choice) {
         :proposal="proposal"
         @close="modalOpenTimeline = false"
       />
+      <ModalVote
+        :choice="selectedChoice"
+        :proposal="proposal"
+        :open="modalOpenVote"
+        @close="modalOpenVote = false"
+        @voted="selectedChoice = null"
+      />
     </teleport>
   </div>
 </template>
diff --git a/apps/ui/src/components/Ui/Button.vue b/apps/ui/src/components/Ui/Button.vue
index 19d97d0d0..f2f4ccefb 100644
--- a/apps/ui/src/components/Ui/Button.vue
+++ b/apps/ui/src/components/Ui/Button.vue
@@ -27,15 +27,32 @@ withDefaults(
   </button>
 </template>
 
-<style scoped lang="scss">
+<style lang="scss" scoped>
 .button {
-  &:disabled {
+  &:disabled:deep() {
     color: rgba(var(--border)) !important;
     cursor: not-allowed;
   }
 
   &.primary {
     @apply bg-skin-link text-skin-bg border-skin-link;
+
+    &:disabled:deep() {
+      @apply bg-skin-link/40 border-transparent;
+
+      .loading,
+      .loading.inverse {
+        svg {
+          path {
+            stroke: rgba(var(--primary));
+          }
+
+          stop {
+            stop-color: rgba(var(--primary));
+          }
+        }
+      }
+    }
   }
 }
 </style>
diff --git a/apps/ui/src/composables/useActions.ts b/apps/ui/src/composables/useActions.ts
index d1ad1dc75..d7de7410a 100644
--- a/apps/ui/src/composables/useActions.ts
+++ b/apps/ui/src/composables/useActions.ts
@@ -240,7 +240,7 @@ export function useActions() {
     );
   }
 
-  async function vote(proposal: Proposal, choice: Choice) {
+  async function vote(proposal: Proposal, choice: Choice, reason: string) {
     if (!web3.value.account) return await forceLogin();
 
     const network = getNetwork(proposal.network);
@@ -252,7 +252,8 @@ export function useActions() {
         web3.value.type as Connector,
         web3.value.account,
         proposal,
-        choice
+        choice,
+        reason
       )
     );
 
diff --git a/apps/ui/src/composables/useVotingPower.ts b/apps/ui/src/composables/useVotingPower.ts
new file mode 100644
index 000000000..52a508dc2
--- /dev/null
+++ b/apps/ui/src/composables/useVotingPower.ts
@@ -0,0 +1,68 @@
+import { supportsNullCurrent } from '@/networks';
+import { getIndex as getVotingPowerIndex } from '@/stores/votingPowers';
+import { Proposal, Space } from '@/types';
+
+export function useVotingPower() {
+  const votingPowersStore = useVotingPowersStore();
+  const { web3 } = useWeb3();
+  const { getCurrent } = useMetaStore();
+
+  const item = ref<Space | Proposal | undefined>();
+  const block = ref<number | null>(null);
+
+  const space = computed(() =>
+    item.value && 'space' in item.value
+      ? (item.value?.space as Space)
+      : item.value
+  );
+
+  const proposal = computed(() =>
+    item.value && 'snapshot' in item.value
+      ? (item.value as Proposal)
+      : undefined
+  );
+
+  const proposalSnapshot = computed(() => {
+    if (!proposal.value) return null;
+
+    return proposal.value.state === 'pending' ? null : proposal.value.snapshot;
+  });
+
+  const votingPower = computed(
+    () =>
+      space.value &&
+      votingPowersStore.votingPowers.get(
+        getVotingPowerIndex(space.value, block.value)
+      )
+  );
+
+  function latestBlock(space: Space) {
+    return supportsNullCurrent(space.network)
+      ? null
+      : getCurrent(space.network) ?? 0;
+  }
+
+  function reset() {
+    votingPowersStore.reset();
+  }
+
+  function fetch(spaceOrProposal: Space | Proposal) {
+    if (!web3.value.account) return;
+
+    item.value = spaceOrProposal;
+    block.value = proposal.value
+      ? proposalSnapshot.value
+      : latestBlock(space.value as Space);
+
+    votingPowersStore.fetch(item.value, web3.value.account, block.value);
+  }
+
+  watch(
+    () => web3.value.account,
+    account => {
+      if (!account) reset();
+    }
+  );
+
+  return { votingPower, fetch, reset };
+}
diff --git a/apps/ui/src/helpers/utils.ts b/apps/ui/src/helpers/utils.ts
index dd5313eb6..7dc78149d 100644
--- a/apps/ui/src/helpers/utils.ts
+++ b/apps/ui/src/helpers/utils.ts
@@ -10,7 +10,8 @@ import updateLocale from 'dayjs/plugin/updateLocale';
 import sha3 from 'js-sha3';
 import { validateAndParseAddress } from 'starknet';
 import networks from '@/helpers/networks.json';
-import { Proposal, SpaceMetadata } from '@/types';
+import { VotingPowerItem } from '@/stores/votingPowers';
+import { Choice, Proposal, SpaceMetadata } from '@/types';
 import { MAX_SYMBOL_LENGTH } from './constants';
 import pkg from '@/../package.json';
 import ICCoingecko from '~icons/c/coingecko';
@@ -475,21 +476,24 @@ export function getChoiceWeight(
   return isNaN(percent) ? 0 : percent;
 }
 
-export function getChoiceText(
-  availableChoices: string[],
-  choice: number | number[] | Record<string, number>
-) {
+export function getChoiceText(availableChoices: string[], choice: Choice) {
+  if (typeof choice === 'string') {
+    return ['for', 'against', 'abstain'].includes(choice)
+      ? choice.charAt(0).toUpperCase() + choice.slice(1)
+      : 'Invalid choice';
+  }
+
   if (typeof choice === 'number') {
-    return availableChoices[choice - 1];
+    return availableChoices[choice - 1] || 'Invalid choice';
   }
 
   if (Array.isArray(choice)) {
-    return (
-      choice.map(index => availableChoices[index - 1]).join(', ') ||
-      'Blank vote'
-    );
+    if (!choice.length) return 'Blank vote';
+    return choice.map(index => availableChoices[index - 1]).join(', ');
   }
 
+  if (!Object.keys(choice).length) return 'Blank vote';
+
   const total = Object.values(choice).reduce((acc, weight) => acc + weight, 0);
 
   return Object.entries(choice)
@@ -534,3 +538,12 @@ export function getSocialNetworksLink(data: any) {
     })
     .filter(social => social.href);
 }
+
+export function getFormattedVotingPower(votingPower?: VotingPowerItem) {
+  if (!votingPower) return;
+
+  const { totalVotingPower, decimals, symbol } = votingPower;
+  const value = _vp(Number(totalVotingPower) / 10 ** decimals);
+
+  return symbol ? `${value} ${symbol}` : value;
+}
diff --git a/apps/ui/src/networks/evm/actions.ts b/apps/ui/src/networks/evm/actions.ts
index 150b81e28..c0eca54f7 100644
--- a/apps/ui/src/networks/evm/actions.ts
+++ b/apps/ui/src/networks/evm/actions.ts
@@ -395,7 +395,8 @@ export function createActions(
       connectorType: Connector,
       account: string,
       proposal: Proposal,
-      choice: Choice
+      choice: Choice,
+      reason: string
     ) => {
       await verifyNetwork(web3, chainId);
 
@@ -427,13 +428,16 @@ export function createActions(
         })
       );
 
+      let pinned: { cid: string; provider: string } | null = null;
+      if (reason) pinned = await helpers.pin({ reason });
+
       const data = {
         space: proposal.space.id,
         authenticator,
         strategies: strategiesWithMetadata,
         proposal: proposal.proposal_id as number,
         choice: getSdkChoice(choice),
-        metadataUri: '',
+        metadataUri: pinned ? `ipfs://${pinned.cid}` : '',
         chainId
       };
 
diff --git a/apps/ui/src/networks/offchain/actions.ts b/apps/ui/src/networks/offchain/actions.ts
index 8fe0166df..c1106b80d 100644
--- a/apps/ui/src/networks/offchain/actions.ts
+++ b/apps/ui/src/networks/offchain/actions.ts
@@ -161,7 +161,8 @@ export function createActions(
       connectorType: Connector,
       account: string,
       proposal: Proposal,
-      choice: Choice
+      choice: Choice,
+      reason: string
     ): Promise<any> {
       const data = {
         space: proposal.space.id,
@@ -171,7 +172,8 @@ export function createActions(
         authenticator: '',
         strategies: [],
         metadataUri: '',
-        privacy: proposal.privacy
+        privacy: proposal.privacy,
+        reason
       };
 
       return client.vote({
diff --git a/apps/ui/src/networks/starknet/actions.ts b/apps/ui/src/networks/starknet/actions.ts
index 00366be0c..64f31e2e5 100644
--- a/apps/ui/src/networks/starknet/actions.ts
+++ b/apps/ui/src/networks/starknet/actions.ts
@@ -390,7 +390,8 @@ export function createActions(
       connectorType: Connector,
       account: string,
       proposal: Proposal,
-      choice: Choice
+      choice: Choice,
+      reason: string
     ) => {
       const isContract = await getIsContract(connectorType, account);
 
@@ -424,12 +425,16 @@ export function createActions(
         })
       );
 
+      let pinned: { cid: string; provider: string } | null = null;
+      if (reason) pinned = await helpers.pin({ reason });
+
       const data = {
         space: proposal.space.id,
         authenticator,
         strategies: strategiesWithMetadata,
         proposal: proposal.proposal_id as number,
-        choice: getSdkChoice(choice)
+        choice: getSdkChoice(choice),
+        metadataUri: pinned ? `ipfs://${pinned.cid}` : ''
       };
 
       if (relayerType === 'starknet') {
diff --git a/apps/ui/src/networks/types.ts b/apps/ui/src/networks/types.ts
index e1ba30346..e65f4cbb0 100644
--- a/apps/ui/src/networks/types.ts
+++ b/apps/ui/src/networks/types.ts
@@ -148,7 +148,8 @@ export type ReadOnlyNetworkActions = {
     connectorType: Connector,
     account: string,
     proposal: Proposal,
-    choice: Choice
+    choice: Choice,
+    reason: string
   ): Promise<any>;
   followSpace(
     web3: Web3Provider | Wallet,
diff --git a/apps/ui/src/stores/votingPowers.ts b/apps/ui/src/stores/votingPowers.ts
new file mode 100644
index 000000000..6360cfc10
--- /dev/null
+++ b/apps/ui/src/stores/votingPowers.ts
@@ -0,0 +1,104 @@
+import { utils } from '@snapshot-labs/sx';
+import { defineStore } from 'pinia';
+import { getNetwork } from '@/networks';
+import { VotingPower, VotingPowerStatus } from '@/networks/types';
+import { Proposal, Space } from '@/types';
+
+const LATEST_BLOCK_NAME = 'latest';
+
+type SpaceDetails = Proposal['space'];
+export type VotingPowerItem = {
+  votingPowers: VotingPower[];
+  totalVotingPower: bigint;
+  status: VotingPowerStatus;
+  symbol: string;
+  decimals: number;
+  error: utils.errors.VotingPowerDetailsError | null;
+  canPropose: boolean;
+  canVote: boolean;
+};
+
+export function getIndex(space: SpaceDetails, block: number | null): string {
+  return `${space.id}:${block ?? LATEST_BLOCK_NAME}`;
+}
+
+export const useVotingPowersStore = defineStore('votingPowers', () => {
+  const votingPowers = reactive<Map<string, VotingPowerItem>>(new Map());
+
+  async function fetch(
+    item: Space | Proposal,
+    account: string,
+    block: number | null
+  ) {
+    const space = 'space' in item ? item.space : item;
+
+    const existingVotingPower = votingPowers.get(getIndex(space, block));
+    if (existingVotingPower && existingVotingPower.status === 'success') return;
+
+    const network = getNetwork(item.network);
+
+    let vpItem: VotingPowerItem = {
+      status: 'loading',
+      votingPowers: [],
+      totalVotingPower: 0n,
+      decimals: 18,
+      symbol: space.voting_power_symbol,
+      error: null,
+      canPropose: false,
+      canVote: false
+    };
+
+    if (existingVotingPower) {
+      existingVotingPower.status = 'loading';
+      votingPowers.set(getIndex(space, block), existingVotingPower);
+    }
+
+    try {
+      const vp = await network.actions.getVotingPower(
+        space.id,
+        item.strategies,
+        item.strategies_params,
+        space.strategies_parsed_metadata,
+        account,
+        {
+          at: block,
+          chainId: space.snapshot_chain_id
+        }
+      );
+
+      vpItem = {
+        ...vpItem,
+        votingPowers: vp,
+        totalVotingPower: vp.reduce((acc, b) => acc + b.value, 0n),
+        status: 'success',
+        decimals: Math.max(...vp.map(votingPower => votingPower.decimals), 0)
+      };
+
+      if ('proposal_threshold' in space) {
+        vpItem.canPropose =
+          vpItem.totalVotingPower >= BigInt(space.proposal_threshold);
+      } else {
+        vpItem.canVote = vpItem.totalVotingPower > 0n;
+      }
+    } catch (e: unknown) {
+      if (e instanceof utils.errors.VotingPowerDetailsError) {
+        vpItem.error = e;
+      } else {
+        console.warn('Failed to load voting power', e);
+      }
+
+      vpItem.status = 'error';
+    }
+    votingPowers.set(getIndex(space, block), vpItem);
+  }
+
+  function reset() {
+    votingPowers.clear();
+  }
+
+  return {
+    votingPowers,
+    fetch,
+    reset
+  };
+});
diff --git a/apps/ui/src/views/Editor.vue b/apps/ui/src/views/Editor.vue
index 8a134ed3b..bc1f35790 100644
--- a/apps/ui/src/views/Editor.vue
+++ b/apps/ui/src/views/Editor.vue
@@ -4,7 +4,7 @@ import { StrategyWithTreasury } from '@/composables/useTreasuries';
 import { resolver } from '@/helpers/resolver';
 import { omit } from '@/helpers/utils';
 import { validateForm } from '@/helpers/validation';
-import { getNetwork, offchainNetworks, supportsNullCurrent } from '@/networks';
+import { getNetwork, offchainNetworks } from '@/networks';
 import { Contact, Transaction, VoteType } from '@/types';
 
 const MAX_BODY_LENGTH = {
@@ -51,15 +51,13 @@ const {
   executionStrategy: walletConnectTransactionExecutionStrategy,
   reset
 } = useWalletConnectTransaction();
-const { getCurrent } = useMetaStore();
 const spacesStore = useSpacesStore();
 const proposalsStore = useProposalsStore();
+const { votingPower, fetch: fetchVotingPower } = useVotingPower();
 
 const modalOpen = ref(false);
 const previewEnabled = ref(false);
 const sending = ref(false);
-const fetchingVotingPower = ref(true);
-const votingPowerValid = ref(false);
 
 const network = computed(() =>
   networkId.value ? getNetwork(networkId.value) : null
@@ -166,7 +164,7 @@ const canSubmit = computed(() => {
   if (Object.keys(formErrors.value).length > 0) return false;
 
   return web3.value.account
-    ? !fetchingVotingPower.value && votingPowerValid.value
+    ? votingPower.value?.canPropose
     : !web3.value.authLoading;
 });
 
@@ -254,35 +252,8 @@ function handleTransactionAccept() {
   reset();
 }
 
-async function getVotingPower() {
-  if (!space.value || !web3.value.account) return;
-
-  fetchingVotingPower.value = true;
-  try {
-    const network = getNetwork(space.value.network);
-
-    const votingPowers = await network.actions.getVotingPower(
-      space.value.id,
-      space.value.voting_power_validation_strategy_strategies,
-      space.value.voting_power_validation_strategy_strategies_params,
-      space.value.voting_power_validation_strategies_parsed_metadata,
-      web3.value.account,
-      {
-        at: supportsNullCurrent(space.value.network)
-          ? null
-          : getCurrent(space.value.network) || 0,
-        chainId: space.value.snapshot_chain_id
-      }
-    );
-
-    const currentVotingPower = votingPowers.reduce((a, b) => a + b.value, 0n);
-    votingPowerValid.value =
-      currentVotingPower >= BigInt(space.value.proposal_threshold);
-  } catch (e) {
-    console.warn('Failed to load voting power', e);
-  } finally {
-    fetchingVotingPower.value = false;
-  }
+function handleFetchVotingPower() {
+  space.value && fetchVotingPower(space.value);
 }
 
 watch(
@@ -294,7 +265,13 @@ watch(
   },
   { immediate: true }
 );
-watch([space, () => web3.value.account], () => getVotingPower());
+
+watch([space, () => web3.value.account], ([toSpace, toAccount]) => {
+  if (!toSpace || !proposal.value || !toAccount) return;
+
+  handleFetchVotingPower();
+});
+
 watch(proposalData, () => {
   if (!proposal.value) return;
 
@@ -380,7 +357,10 @@ export default defineComponent({
           </UiButton>
           <UiButton
             class="rounded-l-none border-l-0 float-left !m-0 !px-3"
-            :loading="sending || (web3.account !== '' && fetchingVotingPower)"
+            :loading="
+              !!web3.account &&
+              (sending || !votingPower || votingPower.status === 'loading')
+            "
             :disabled="!canSubmit"
             @click="handleProposeClick"
           >
@@ -395,13 +375,14 @@ export default defineComponent({
     </nav>
     <div class="md:mr-[340px]">
       <UiContainer class="pt-5 !max-w-[660px] mx-0 md:mx-auto s-box">
-        <UiAlert
-          v-if="!fetchingVotingPower && !votingPowerValid"
-          type="error"
+        <MessageVotingPower
+          v-if="votingPower && space"
           class="mb-4"
-        >
-          You do not have enough voting power to create proposal in this space.
-        </UiAlert>
+          :voting-power="votingPower"
+          action="propose"
+          @fetch-voting-power="handleFetchVotingPower"
+        />
+
         <UiInputString
           :key="proposalKey || ''"
           v-model="proposal.title"
diff --git a/apps/ui/src/views/Proposal.vue b/apps/ui/src/views/Proposal.vue
index baac6ccee..5b9d10caa 100644
--- a/apps/ui/src/views/Proposal.vue
+++ b/apps/ui/src/views/Proposal.vue
@@ -1,30 +1,32 @@
 <script setup lang="ts">
-import { utils } from '@snapshot-labs/sx';
-import { getCacheHash, getStampUrl, sanitizeUrl } from '@/helpers/utils';
-import { getNetwork, offchainNetworks } from '@/networks';
-import { VotingPower, VotingPowerStatus } from '@/networks/types';
+import {
+  getCacheHash,
+  getFormattedVotingPower,
+  getStampUrl,
+  sanitizeUrl
+} from '@/helpers/utils';
+import { offchainNetworks } from '@/networks';
 import { Choice } from '@/types';
 
 const route = useRoute();
+const proposalsStore = useProposalsStore();
+const {
+  votingPower,
+  fetch: fetchVotingPower,
+  reset: resetVotingPower
+} = useVotingPower();
 const { setFavicon } = useFavicon();
 const { param } = useRouteParser('space');
 const { resolved, address: spaceAddress, networkId } = useResolve(param);
 const { setTitle } = useTitle();
-const proposalsStore = useProposalsStore();
 const { web3 } = useWeb3();
-const { loadVotes, votes } = useAccount();
-const { vote } = useActions();
+const { modalAccountOpen } = useModal();
 
-const sendingType = ref<Choice | null>(null);
-const votingPowers = ref([] as VotingPower[]);
-const votingPowerStatus = ref<VotingPowerStatus>('loading');
-const votingPowerDetailsError =
-  ref<utils.errors.VotingPowerDetailsError | null>(null);
+const modalOpenVote = ref(false);
+const selectedChoice = ref<Choice | null>(null);
+const { loadVotes, votes } = useAccount();
 const editMode = ref(false);
 
-const network = computed(() =>
-  networkId.value ? getNetwork(networkId.value) : null
-);
 const id = computed(() => route.params.id as string);
 const proposal = computed(() => {
   if (!resolved.value || !spaceAddress.value || !networkId.value) {
@@ -60,50 +62,22 @@ const currentVote = computed(
     votes.value[`${proposal.value.network}:${proposal.value.id}`]
 );
 
-async function getVotingPower() {
-  if (!network.value) return;
-
-  votingPowerDetailsError.value = null;
-
-  if (!web3.value.account || !proposal.value) {
-    votingPowers.value = [];
-    votingPowerStatus.value = 'success';
+async function handleVoteClick(choice: Choice) {
+  if (!web3.value.account) {
+    modalAccountOpen.value = true;
     return;
   }
 
-  votingPowerStatus.value = 'loading';
-  try {
-    votingPowers.value = await network.value.actions.getVotingPower(
-      proposal.value.space.id,
-      proposal.value.strategies,
-      proposal.value.strategies_params,
-      proposal.value.space.strategies_parsed_metadata,
-      web3.value.account,
-      {
-        at: proposal.value.state === 'pending' ? null : proposal.value.snapshot,
-        chainId: proposal.value.space.snapshot_chain_id
-      }
-    );
-    votingPowerStatus.value = 'success';
-  } catch (e: unknown) {
-    if (e instanceof utils.errors.VotingPowerDetailsError) {
-      votingPowerDetailsError.value = e;
-    } else {
-      console.warn('Failed to load voting power', e);
-    }
-
-    votingPowers.value = [];
-    votingPowerStatus.value = 'error';
-  }
+  selectedChoice.value = choice;
+  modalOpenVote.value = true;
 }
 
-async function handleVoteClick(choice: Choice) {
+async function handleVoteSubmitted() {
   if (!proposal.value) return;
 
-  sendingType.value = choice;
+  selectedChoice.value = null;
 
   try {
-    await vote(proposal.value, choice);
     // TODO: Quick fix only for offchain proposals, need a more complete solution for onchain proposals
     if (offchainNetworks.includes(proposal.value.network)) {
       proposalsStore.fetchProposal(
@@ -114,12 +88,30 @@ async function handleVoteClick(choice: Choice) {
       await loadVotes(proposal.value.network, [proposal.value.space.id]);
     }
   } finally {
-    sendingType.value = null;
     editMode.value = false;
   }
 }
 
-watch([() => web3.value.account, proposal], () => getVotingPower());
+function handleFetchVotingPower() {
+  if (!proposal.value) return;
+
+  fetchVotingPower(proposal.value);
+}
+
+watch(
+  [proposal, () => web3.value.account, () => web3.value.authLoading],
+  ([toProposal, toAccount, toAuthLoading], [, fromAccount]) => {
+    if (fromAccount && toAccount && fromAccount !== toAccount) {
+      resetVotingPower();
+    }
+
+    if (toAuthLoading || !toProposal || !toAccount) return;
+
+    handleFetchVotingPower();
+  },
+  { immediate: true }
+);
+
 watch(
   [networkId, spaceAddress, id],
   async ([networkId, spaceAddress, id]) => {
@@ -223,17 +215,16 @@ watchEffect(() => {
             v-if="web3.account && networkId && (!currentVote || editMode)"
             v-slot="props"
             :network-id="networkId"
-            :status="votingPowerStatus"
-            :voting-power-symbol="proposal.space.voting_power_symbol"
-            :voting-powers="votingPowers"
+            :voting-power="votingPower"
             class="mb-2 flex items-center"
-            @get-voting-power="getVotingPower"
+            @fetch-voting-power="handleFetchVotingPower"
           >
             <div
               v-if="
-                votingPowerDetailsError?.details === 'NOT_READY_YET' &&
+                votingPower?.error &&
+                votingPower.error.details === 'NOT_READY_YET' &&
                 ['evmSlotValue', 'ozVotesStorageProof'].includes(
-                  votingPowerDetailsError.source
+                  votingPower.error.source
                 )
               "
             >
@@ -246,21 +237,23 @@ watchEffect(() => {
             <template v-else>
               <span class="mr-1.5">Voting power:</span>
               <button type="button" @click="props.onClick">
-                <UiLoading v-if="votingPowerStatus === 'loading'" />
+                <UiLoading
+                  v-if="!votingPower || votingPower.status === 'loading'"
+                />
                 <IH-exclamation
-                  v-else-if="votingPowerStatus === 'error'"
+                  v-else-if="votingPower.status === 'error'"
                   class="inline-block text-rose-500"
                 />
                 <span
                   v-else
                   class="text-skin-link"
-                  v-text="props.formattedVotingPower"
+                  v-text="getFormattedVotingPower(votingPower)"
                 />
               </button>
               <a
                 v-if="
-                  votingPowerStatus === 'success' &&
-                  props.votingPower === BigInt(0)
+                  votingPower?.status === 'success' &&
+                  votingPower.totalVotingPower === BigInt(0)
                 "
                 href="https://help.snapshot.org/en/articles/9566904-why-do-i-have-0-voting-power"
                 target="_blank"
@@ -278,34 +271,29 @@ watchEffect(() => {
           >
             <ProposalVoteBasic
               v-if="proposal.type === 'basic'"
-              :sending-type="sendingType"
               @vote="handleVoteClick"
             />
             <ProposalVoteSingleChoice
               v-else-if="proposal.type === 'single-choice'"
               :proposal="proposal"
-              :sending-type="sendingType"
               :default-choice="currentVote?.choice"
               @vote="handleVoteClick"
             />
             <ProposalVoteApproval
               v-else-if="proposal.type === 'approval'"
               :proposal="proposal"
-              :sending-type="sendingType"
               :default-choice="currentVote?.choice"
               @vote="handleVoteClick"
             />
             <ProposalVoteRankedChoice
               v-else-if="proposal.type === 'ranked-choice'"
               :proposal="proposal"
-              :sending-type="sendingType"
               :default-choice="currentVote?.choice"
               @vote="handleVoteClick"
             />
             <ProposalVoteWeighted
               v-else-if="['weighted', 'quadratic'].includes(proposal.type)"
               :proposal="proposal"
-              :sending-type="sendingType"
               :default-choice="currentVote?.choice"
               @vote="handleVoteClick"
             />
@@ -331,5 +319,15 @@ watchEffect(() => {
         </div>
       </div>
     </template>
+    <teleport to="#modal">
+      <ModalVote
+        v-if="proposal && selectedChoice"
+        :choice="selectedChoice"
+        :proposal="proposal"
+        :open="modalOpenVote"
+        @close="modalOpenVote = false"
+        @voted="handleVoteSubmitted"
+      />
+    </teleport>
   </div>
 </template>
diff --git a/apps/ui/src/views/Space/Proposals.vue b/apps/ui/src/views/Space/Proposals.vue
index ea1be31f8..e10db8769 100644
--- a/apps/ui/src/views/Space/Proposals.vue
+++ b/apps/ui/src/views/Space/Proposals.vue
@@ -1,22 +1,19 @@
 <script setup lang="ts">
 import ProposalIconStatus from '@/components/ProposalIconStatus.vue';
-import { getNetwork, supportsNullCurrent } from '@/networks';
-import {
-  ProposalsFilter,
-  VotingPower,
-  VotingPowerStatus
-} from '@/networks/types';
+import { ProposalsFilter } from '@/networks/types';
 import { Space } from '@/types';
 
 const props = defineProps<{ space: Space }>();
 
 const { setTitle } = useTitle();
+const {
+  votingPower,
+  fetch: fetchVotingPower,
+  reset: resetVotingPower
+} = useVotingPower();
 const { web3 } = useWeb3();
-const { getCurrent } = useMetaStore();
 const proposalsStore = useProposalsStore();
 
-const votingPowers = ref([] as VotingPower[]);
-const votingPowerStatus = ref<VotingPowerStatus>('loading');
 const state = ref<NonNullable<ProposalsFilter['state']>>('any');
 
 const selectIconBaseProps = {
@@ -24,7 +21,6 @@ const selectIconBaseProps = {
   height: 16
 };
 
-const network = computed(() => getNetwork(props.space.network));
 const proposalsRecord = computed(
   () => proposalsStore.proposals[`${props.space.network}:${props.space.id}`]
 );
@@ -35,34 +31,8 @@ async function handleEndReached() {
   proposalsStore.fetchMore(props.space.id, props.space.network);
 }
 
-async function getVotingPower() {
-  if (!web3.value.account) {
-    votingPowers.value = [];
-    votingPowerStatus.value = 'success';
-    return;
-  }
-
-  votingPowerStatus.value = 'loading';
-  try {
-    votingPowers.value = await network.value.actions.getVotingPower(
-      props.space.id,
-      props.space.strategies,
-      props.space.strategies_params,
-      props.space.strategies_parsed_metadata,
-      web3.value.account,
-      {
-        at: supportsNullCurrent(props.space.network)
-          ? null
-          : getCurrent(props.space.network) || 0,
-        chainId: props.space.snapshot_chain_id
-      }
-    );
-    votingPowerStatus.value = 'success';
-  } catch (e) {
-    console.warn('Failed to load voting power', e);
-    votingPowers.value = [];
-    votingPowerStatus.value = 'error';
-  }
+function handleFetchVotingPower() {
+  fetchVotingPower(props.space);
 }
 
 watch(
@@ -72,17 +42,22 @@ watch(
       proposalsStore.reset(toSpace.id, toSpace.network);
       proposalsStore.fetch(toSpace.id, toSpace.network, toState);
     }
-
-    if (toSpace.id !== fromSpace?.id) {
-      getVotingPower();
-    }
   },
   { immediate: true }
 );
 
 watch(
-  () => web3.value.account,
-  () => getVotingPower()
+  [props.space, () => web3.value.account, () => web3.value.authLoading],
+  ([toSpace, toAccount, toAuthLoading], [, fromAccount]) => {
+    if (fromAccount && toAccount && fromAccount !== toAccount) {
+      resetVotingPower();
+    }
+
+    if (toAuthLoading || !toSpace || !toAccount) return;
+
+    handleFetchVotingPower();
+  },
+  { immediate: true }
 );
 
 watchEffect(() => setTitle(`Proposals - ${props.space.name}`));
@@ -126,10 +101,8 @@ watchEffect(() => setTitle(`Proposals - ${props.space.name}`));
       <div class="flex flex-row p-4 space-x-2">
         <IndicatorVotingPower
           :network-id="space.network"
-          :status="votingPowerStatus"
-          :voting-power-symbol="space.voting_power_symbol"
-          :voting-powers="votingPowers"
-          @get-voting-power="getVotingPower"
+          :voting-power="votingPower"
+          @fetch-voting-power="handleFetchVotingPower"
         />
         <router-link :to="{ name: 'editor' }" tabindex="-1">
           <UiTooltip title="New proposal">
diff --git a/packages/sx.js/src/clients/offchain/ethereum-sig/index.ts b/packages/sx.js/src/clients/offchain/ethereum-sig/index.ts
index 55aca908e..81c0e6f17 100644
--- a/packages/sx.js/src/clients/offchain/ethereum-sig/index.ts
+++ b/packages/sx.js/src/clients/offchain/ethereum-sig/index.ts
@@ -244,7 +244,7 @@ export class EthereumSig {
       space: data.space,
       proposal: data.proposal,
       choice,
-      reason: '',
+      reason: data.reason || '',
       app: '',
       metadata: ''
     };
diff --git a/packages/sx.js/src/clients/offchain/types.ts b/packages/sx.js/src/clients/offchain/types.ts
index c79251b76..63a61ff47 100644
--- a/packages/sx.js/src/clients/offchain/types.ts
+++ b/packages/sx.js/src/clients/offchain/types.ts
@@ -143,6 +143,7 @@ export type Vote = {
   type: string;
   privacy?: Privacy;
   timestamp?: number;
+  reason?: string;
 };
 
 export type Propose = {
diff --git a/packages/sx.js/src/clients/starknet/ethereum-sig/index.ts b/packages/sx.js/src/clients/starknet/ethereum-sig/index.ts
index 5922b5916..d87d3c08b 100644
--- a/packages/sx.js/src/clients/starknet/ethereum-sig/index.ts
+++ b/packages/sx.js/src/clients/starknet/ethereum-sig/index.ts
@@ -176,7 +176,7 @@ export class EthereumSig {
       choice: `0x${data.choice.toString(16)}`,
       userVotingStrategies,
       metadataUri: shortString
-        .splitLongString('')
+        .splitLongString(data.metadataUri)
         .map(str => shortString.encodeShortString(str))
     };
 
diff --git a/packages/sx.js/src/clients/starknet/ethereum-tx/index.ts b/packages/sx.js/src/clients/starknet/ethereum-tx/index.ts
index 27264258f..85fa4c177 100644
--- a/packages/sx.js/src/clients/starknet/ethereum-tx/index.ts
+++ b/packages/sx.js/src/clients/starknet/ethereum-tx/index.ts
@@ -305,7 +305,7 @@ export class EthereumTx {
       data.proposal,
       getChoiceEnum(data.choice),
       userVotingStrategies,
-      shortString.splitLongString('') // metadataUri
+      shortString.splitLongString(data.metadataUri)
     ]);
 
     return `0x${poseidonHashMany(compiled.map(v => BigInt(v))).toString(16)}`;
diff --git a/packages/sx.js/src/clients/starknet/starknet-sig/index.ts b/packages/sx.js/src/clients/starknet/starknet-sig/index.ts
index 9a1bdaebc..8d63194e6 100644
--- a/packages/sx.js/src/clients/starknet/starknet-sig/index.ts
+++ b/packages/sx.js/src/clients/starknet/starknet-sig/index.ts
@@ -212,7 +212,7 @@ export class StarknetSig {
       choice: `0x${data.choice.toString(16)}`,
       userVotingStrategies,
       metadataUri: shortString
-        .splitLongString('')
+        .splitLongString(data.metadataUri)
         .map(str => shortString.encodeShortString(str))
     };
 
diff --git a/packages/sx.js/src/clients/starknet/starknet-tx/index.ts b/packages/sx.js/src/clients/starknet/starknet-tx/index.ts
index 289f615bd..b9eea3e34 100644
--- a/packages/sx.js/src/clients/starknet/starknet-tx/index.ts
+++ b/packages/sx.js/src/clients/starknet/starknet-tx/index.ts
@@ -287,7 +287,7 @@ export class StarknetTx {
       proposalId: envelope.data.proposal,
       choice: envelope.data.choice,
       votingStrategies,
-      metadataUri: ''
+      metadataUri: envelope.data.metadataUri
     });
 
     const maxFee = opts?.nonce
diff --git a/packages/sx.js/src/types/index.ts b/packages/sx.js/src/types/index.ts
index f0e172ab1..4dc706863 100644
--- a/packages/sx.js/src/types/index.ts
+++ b/packages/sx.js/src/types/index.ts
@@ -135,6 +135,7 @@ export type Vote = {
   strategies: StrategyConfig[];
   proposal: number;
   choice: Choice;
+  metadataUri: string;
 };
 
 export type Alias = {
diff --git a/packages/sx.js/test/unit/clients/starknet/ethereum-sig/__snapshots__/index.test.ts.snap b/packages/sx.js/test/unit/clients/starknet/ethereum-sig/__snapshots__/index.test.ts.snap
index 2865e2c0c..34f8b7002 100644
--- a/packages/sx.js/test/unit/clients/starknet/ethereum-sig/__snapshots__/index.test.ts.snap
+++ b/packages/sx.js/test/unit/clients/starknet/ethereum-sig/__snapshots__/index.test.ts.snap
@@ -100,6 +100,7 @@ exports[`EthereumSig > should create vote envelope 1`] = `
   "data": {
     "authenticator": "0x53d98050a9738da0eac7498d909ea03f6eb03d07fb95877b54ff8acf7712276",
     "choice": 1,
+    "metadataUri": "ipfs://QmNrm6xKuib1THtWkiN5CKtBEerQCDpUtmgDqiaU2xDmca",
     "proposal": 1,
     "space": "0x06330d3e48f59f5411c201ee2e9e9ccdc738fb3bb192b0e77e4eda26fa1a22f8",
     "strategies": [
@@ -115,7 +116,10 @@ exports[`EthereumSig > should create vote envelope 1`] = `
       "authenticator": "0x53d98050a9738da0eac7498d909ea03f6eb03d07fb95877b54ff8acf7712276",
       "chainId": "0x534e5f5345504f4c4941",
       "choice": "0x1",
-      "metadataUri": [],
+      "metadataUri": [
+        "0x697066733a2f2f516d4e726d36784b75696231544874576b694e35434b7442",
+        "0x4565725143447055746d6744716961553278446d6361",
+      ],
       "proposalId": "0x1",
       "space": "0x06330d3e48f59f5411c201ee2e9e9ccdc738fb3bb192b0e77e4eda26fa1a22f8",
       "userVotingStrategies": [],
@@ -123,9 +127,9 @@ exports[`EthereumSig > should create vote envelope 1`] = `
     },
     "primaryType": "Vote",
     "signature": [
-      "0x2986292e9bf23c0f9f738fd32556f8096631c883dec6c4d771d2ce65d69649c7",
-      "0x2b068bd532570c93e54ac22b0c1e8683229e26c6677c0a68bc677da1a05668ad",
-      "0x1b",
+      "0x6e565e214090a3845caca4290e4cad24186c45c945faeeb148649139228f6057",
+      "0x6197a3f635219831616276b977718d56e666ed4d2d74b7ba82d8d7c39bd7d29b",
+      "0x1c",
     ],
   },
 }
diff --git a/packages/sx.js/test/unit/clients/starknet/ethereum-sig/index.test.ts b/packages/sx.js/test/unit/clients/starknet/ethereum-sig/index.test.ts
index 0c0ebcfc3..a9549d91a 100644
--- a/packages/sx.js/test/unit/clients/starknet/ethereum-sig/index.test.ts
+++ b/packages/sx.js/test/unit/clients/starknet/ethereum-sig/index.test.ts
@@ -85,6 +85,7 @@ describe('EthereumSig', () => {
             index: 0
           }
         ],
+        metadataUri: 'ipfs://QmNrm6xKuib1THtWkiN5CKtBEerQCDpUtmgDqiaU2xDmca',
         proposal: 1,
         choice: 1
       }
diff --git a/packages/sx.js/test/unit/clients/starknet/ethereum-tx/index.test.ts b/packages/sx.js/test/unit/clients/starknet/ethereum-tx/index.test.ts
index cab36aff5..d0b67ef96 100644
--- a/packages/sx.js/test/unit/clients/starknet/ethereum-tx/index.test.ts
+++ b/packages/sx.js/test/unit/clients/starknet/ethereum-tx/index.test.ts
@@ -56,12 +56,13 @@ describe('EthereumTx', () => {
         }
       ],
       proposal: 32,
-      choice: 1
+      choice: 1,
+      metadataUri: 'ipfs://QmNrm6xKuib1THtWkiN5CKtBEerQCDpUtmgDqiaU2xDmca'
     };
 
     const result = await ethereumTx.getVoteHash(wallet, data);
     expect(result).toEqual(
-      '0x4affc1f0108aecdd06a9c2b8402ffe11ba37e27dfcbb98964ff68f83899367b'
+      '0x15c3ec5ebb1e82803db2d695eb12a902d5bb0d52c63e1536015e6d3debe70'
     );
   });
 
diff --git a/packages/sx.js/test/unit/clients/starknet/starknet-sig/__snapshots__/index.test.ts.snap b/packages/sx.js/test/unit/clients/starknet/starknet-sig/__snapshots__/index.test.ts.snap
index 37b2ba659..f2b85d841 100644
--- a/packages/sx.js/test/unit/clients/starknet/starknet-sig/__snapshots__/index.test.ts.snap
+++ b/packages/sx.js/test/unit/clients/starknet/starknet-sig/__snapshots__/index.test.ts.snap
@@ -231,6 +231,7 @@ exports[`StarknetSig > should create vote envelope 1`] = `
   "data": {
     "authenticator": "0x213bb25044b189ccfda9882999dba32e011781dc11b2a6efa2b3d232824378e",
     "choice": 1,
+    "metadataUri": "ipfs://QmNrm6xKuib1THtWkiN5CKtBEerQCDpUtmgDqiaU2xDmca",
     "proposal": 1,
     "space": "0x06330d3e48f59f5411c201ee2e9e9ccdc738fb3bb192b0e77e4eda26fa1a22f8",
     "strategies": [
@@ -250,7 +251,10 @@ exports[`StarknetSig > should create vote envelope 1`] = `
     },
     "message": {
       "choice": "0x1",
-      "metadataUri": [],
+      "metadataUri": [
+        "0x697066733a2f2f516d4e726d36784b75696231544874576b694e35434b7442",
+        "0x4565725143447055746d6744716961553278446d6361",
+      ],
       "proposalId": {
         "high": "0x0",
         "low": "0x1",
@@ -261,8 +265,8 @@ exports[`StarknetSig > should create vote envelope 1`] = `
     },
     "primaryType": "Vote",
     "signature": [
-      "0x155b32bbfbb261e29f97dfae43b5423f1a205eb1ef26680e7edf1758453d63a",
-      "0x5da6c03b40c281be8686afd2d985db93fc3fc27e4c8a2856ba7c635ebf1b2d6",
+      "0xd64cf8eb4218e6b47ab1756ab850b82b5bb9eec760c8cd0c1b68bb2ea597be",
+      "0x56a47d37a6980a7f095ac54b5ce5108325333c7642234fc677423a59a027e38",
     ],
     "types": {
       "IndexedStrategy": [
diff --git a/packages/sx.js/test/unit/clients/starknet/starknet-sig/index.test.ts b/packages/sx.js/test/unit/clients/starknet/starknet-sig/index.test.ts
index b5c0c2300..3fe3712fa 100644
--- a/packages/sx.js/test/unit/clients/starknet/starknet-sig/index.test.ts
+++ b/packages/sx.js/test/unit/clients/starknet/starknet-sig/index.test.ts
@@ -85,6 +85,7 @@ describe('StarknetSig', () => {
             index: 0
           }
         ],
+        metadataUri: 'ipfs://QmNrm6xKuib1THtWkiN5CKtBEerQCDpUtmgDqiaU2xDmca',
         proposal: 1,
         choice: 1
       }