Merge branch 'master' into fix-150-add-support-for-ranked-choice-voting

.changeset/five-gifts-rest.md

@@ -0,0 +1,5 @@
+---
+"@snapshot-labs/sx": patch
+---
+
+change default decimals for remote-vp strategy to 18

apps/ui/package.json

@@ -38,7 +38,6 @@
     "@ethersproject/hash": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
     "@ethersproject/units": "^5.7.0",
-    "@floating-ui/vue": "^1.0.2",
     "@headlessui/vue": "^1.7.16",
     "@openzeppelin/merkle-tree": "^1.0.5",
     "@snapshot-labs/eslint-config-vue": "^0.1.0-beta.13",
@@ -73,6 +72,7 @@
     "util": "^0.12.5",
     "vue": "^3.4.15",
     "vue-router": "^4.2.5",
+    "vue-tippy": "^6.4.1",
     "vuedraggable": "^4.1.0"
   },
   "devDependencies": {

apps/ui/src/components/Ui/Tooltip.vue

@@ -1,74 +1,11 @@
 <script setup lang="ts">
-import { useFloating, autoUpdate, offset, flip, shift, arrow, Placement } from '@floating-ui/vue';
-
-const props = withDefaults(
-  defineProps<{
-    title: string;
-    position?: Placement;
-  }>(),
-  {
-    position: 'top'
-  }
-);
-
-const referenceRef = ref(null);
-const floatingRef = ref(null);
-const arrowRef = ref(null);
-const visible = ref(false);
-
-const { placement, x, y, strategy, middlewareData } = useFloating(referenceRef, floatingRef, {
-  placement: props.position,
-  whileElementsMounted: autoUpdate,
-  middleware: [offset(10), flip(), shift({ padding: 8 }), arrow({ element: arrowRef })]
-});
-
-const arrowStyle = computed(() => {
-  if (!middlewareData.value.arrow) return {};
-
-  const opposedSide = {
-    left: 'right',
-    right: 'left',
-    top: 'bottom',
-    bottom: 'top'
-  }[placement.value.split('-')[0] as Placement];
-
-  const { x, y } = middlewareData.value.arrow;
-
-  return {
-    left: x != null ? `${x}px` : '',
-    top: y != null ? `${y}px` : '',
-    [opposedSide]: '-4px'
-  };
-});
+defineProps<{
+  title: string;
+}>();
 </script>
 
 <template>
-  <div class="inline-block relative">
-    <div
-      ref="referenceRef"
-      class="h-full"
-      @mouseenter="visible = true"
-      @mouseleave="visible = false"
-    >
-      <slot />
-    </div>
-    <div
-      ref="floatingRef"
-      :style="{
-        position: strategy,
-        top: `${y ?? 0}px`,
-        left: `${x ?? 0}px`
-      }"
-      class="bg-skin-border text-skin-link px-[14px] py-2 w-max z-50 rounded text-[17px] leading-5 transition-opacity"
-      :class="[visible ? 'opacity-100' : 'scale-0 opacity-0']"
-    >
-      {{ title }}
-
-      <div
-        ref="arrowRef"
-        :style="arrowStyle"
-        class="absolute bg-skin-border w-[8px] h-[8px] rotate-45"
-      />
-    </div>
+  <div v-tippy="{ content: title }" class="inline-block relative">
+    <slot />
   </div>
 </template>

apps/ui/src/main.ts

@@ -1,3 +1,4 @@
+import VueTippy from 'vue-tippy';
 import { createPinia } from 'pinia';
 import { LockPlugin } from '@snapshot-labs/lock/plugins/vue3';
 import options from '@/helpers/auth';
@@ -21,7 +22,14 @@ if (window !== window.parent && !knownHosts.includes(parentHost)) {
 const pinia = createPinia();
 const app = createApp({ render: () => h(App) })
   .use(router)
-  .use(LockPlugin, options);
+  .use(LockPlugin, options)
+  .use(VueTippy, {
+    defaultProps: {
+      delay: [0, null],
+      theme: 'sx',
+      animation: false
+    }
+  });
 
 app.use(pinia);
 

apps/ui/src/networks/offchain/actions.ts

@@ -184,7 +184,7 @@ export function createActions(
 
       return result.map((value: bigint, index: number) => {
         const strategy = strategiesOrValidationParams[index];
-        const decimals = parseInt(strategy.params.decimals || 0);
+        const decimals = parseInt(strategy.params.decimals || 18);
 
         return {
           address: strategy.name,

apps/ui/src/style.scss

@@ -302,3 +302,21 @@ input {
 .s-dialog {
   z-index: 41 !important;
 }
+
+// Vue tippy
+
+@import 'tippy.js/dist/tippy.css';
+@import 'tippy.js/dist/border.css';
+@import 'tippy.js/dist/svg-arrow.css';
+
+.tippy-box[data-theme~='sx'] {
+  @apply bg-skin-border text-skin-link px-[14px] py-2 w-max z-50 rounded text-[17px] leading-5 transition-opacity;
+
+  .tippy-content {
+    @apply p-0;
+  }
+
+  .tippy-arrow {
+    color: rgba(var(--border));
+  }
+}

packages/sx.js/src/strategies/offchain/remote-vp.ts

@@ -20,9 +20,9 @@ export default function createRemoteVpStrategy(): Strategy {
 
       return result.vp_by_strategy.map((vp: number, i: number) => {
         const strategy = params[i];
-        const decimals = parseInt(strategy.params.decimals || 0);
+        const decimals = parseInt(strategy.params.decimals || 18);
 
-        return BigInt(vp * 10 ** decimals);
+        return BigInt(Math.floor(vp * 10 ** decimals));
       });
     }
   };

yarn.lock

@@ -1220,35 +1220,6 @@
     graphql-import-node "^0.0.5"
     js-yaml "^4.1.0"
 
-"@floating-ui/core@^1.6.0":
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.6.0.tgz#fa41b87812a16bf123122bf945946bae3fdf7fc1"
-  integrity sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==
-  dependencies:
-    "@floating-ui/utils" "^0.2.1"
-
-"@floating-ui/dom@^1.6.1":
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.6.1.tgz#d552e8444f77f2d88534372369b3771dc3a2fa5d"
-  integrity sha512-iA8qE43/H5iGozC3W0YSnVSW42Vh522yyM1gj+BqRwVsTNOyr231PsXDaV04yT39PsO0QL2QpbI/M0ZaLUQgRQ==
-  dependencies:
-    "@floating-ui/core" "^1.6.0"
-    "@floating-ui/utils" "^0.2.1"
-
-"@floating-ui/utils@^0.2.1":
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2"
-  integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==
-
-"@floating-ui/vue@^1.0.2":
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/@floating-ui/vue/-/vue-1.0.6.tgz#31860a12f1135d19554c232d99c5bab631c5c576"
-  integrity sha512-EdrOljjkpkkqZnrpqUcPoz9NvHxuTjUtSInh6GMv3+Mcy+giY2cE2pHh9rpacRcZ2eMSCxel9jWkWXTjLmY55w==
-  dependencies:
-    "@floating-ui/dom" "^1.6.1"
-    "@floating-ui/utils" "^0.2.1"
-    vue-demi ">=0.13.0"
-
 "@graphprotocol/[email protected]":
   version "0.68.0"
   resolved "https://registry.yarnpkg.com/@graphprotocol/graph-cli/-/graph-cli-0.68.0.tgz#30464a75b7341d6c468f7ff3dba01259efff6b78"
@@ -2140,6 +2111,11 @@
   resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.24.tgz#58601079e11784d20f82d0585865bb42305c4df3"
   integrity sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==
 
+"@popperjs/core@^2.9.0":
+  version "2.11.8"
+  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.8.tgz#6b79032e760a0899cd4204710beede972a3a185f"
+  integrity sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==
+
 "@portis/web3@^4.0.6":
   version "4.0.7"
   resolved "https://registry.yarnpkg.com/@portis/web3/-/web3-4.0.7.tgz#4700e79ef35c12736ade82a31dc71c045b97209d"
@@ -12367,6 +12343,13 @@ tinyspy@^2.2.0:
   resolved "https://registry.yarnpkg.com/tinyspy/-/tinyspy-2.2.0.tgz#9dc04b072746520b432f77ea2c2d17933de5d6ce"
   integrity sha512-d2eda04AN/cPOR89F7Xv5bK/jrQEhmcLFe6HFldoeO9AJtps+fqEnh486vnT/8y4bw38pSyxDcTCAq+Ks2aJTg==
 
+tippy.js@^6.3.7:
+  version "6.3.7"
+  resolved "https://registry.yarnpkg.com/tippy.js/-/tippy.js-6.3.7.tgz#8ccfb651d642010ed9a32ff29b0e9e19c5b8c61c"
+  integrity sha512-E1d3oP2emgJ9dRQZdf3Kkn0qJgI6ZLpyS5z6ZkY1DF3kaQaBsGZsndEpHwx+eC+tYM41HaSNvNtLx8tU57FzTQ==
+  dependencies:
+    "@popperjs/core" "^2.9.0"
+
 [email protected]:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/tmp-promise/-/tmp-promise-3.0.3.tgz#60a1a1cc98c988674fcbfd23b6e3367bdeac4ce7"
@@ -13138,7 +13121,7 @@ vitest@^1.2.2:
     vite-node "1.2.2"
     why-is-node-running "^2.2.2"
 
-vue-demi@>=0.13.0, vue-demi@>=0.14.5, vue-demi@>=0.14.6:
+vue-demi@>=0.14.5, vue-demi@>=0.14.6:
   version "0.14.7"
   resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.7.tgz#8317536b3ef74c5b09f268f7782e70194567d8f2"
   integrity sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==
@@ -13171,6 +13154,13 @@ vue-template-compiler@^2.7.14:
     de-indent "^1.0.2"
     he "^1.2.0"
 
+vue-tippy@^6.4.1:
+  version "6.4.1"
+  resolved "https://registry.yarnpkg.com/vue-tippy/-/vue-tippy-6.4.1.tgz#b14b72b765ddca5e1ae9875510420374d5e08f5d"
+  integrity sha512-PEAKdioZjUvYWz4euxHFSXKJbL6kIKO29/LtQaCBbnd5Vg0U5kL8iLuqRshB2I31pXPSQS0qJsWx56178eS2QA==
+  dependencies:
+    tippy.js "^6.3.7"
+
 vue-tsc@^1.8.27:
   version "1.8.27"
   resolved "https://registry.yarnpkg.com/vue-tsc/-/vue-tsc-1.8.27.tgz#feb2bb1eef9be28017bb9e95e2bbd1ebdd48481c"