fix: fix wrong test button color on custom domain (snapshot-labs#4561)

* fix: button primary color to black and white * fix: prevent invalid transactions being submitted with osnap plugin (snapshot-labs#4552) * disable publish if osnap tx invalid * set state upstream even if invalid, better input logic * don't allow empty transaction array * clear form when changing type * clone safe on mount * better validation, state setting for nft trasnfer & token transfer * keep validation logic in components, emit isValid flag * check contract interaction params * enforce positive value for sending tokens * remove top level valid flag * handle value validation * set invalid method params for validation * validate raw tx inputs * disable publish if osnap tx invalid * set state upstream even if invalid, better input logic * don't allow empty transaction array * clear form when changing type * clone safe on mount * better validation, state setting for nft trasnfer & token transfer * keep validation logic in components, emit isValid flag * check contract interaction params * enforce positive value for sending tokens * remove top level valid flag * handle value validation * set invalid method params for validation * validate raw tx inputs * remove error message for decimal values * pad bytes32 * clean up --------- Co-authored-by: Gerhard Steenkamp <[email protected]> * fix: fix wrong test button color on custom domain --------- Co-authored-by: Sam <[email protected]> Co-authored-by: David A <[email protected]> Co-authored-by: Gerhard Steenkamp <[email protected]>
iotexproject · Feb 17, 2024 · 41b394b · 41b394b
1 parent c6f727a
commit 41b394b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/src/components/Tune/TuneButton.vue b/src/components/Tune/TuneButton.vue
@@ -16,7 +16,12 @@ withDefaults(
   }
 );
 
+const skin = ref<string | null>(null);
+
 const { domain } = useApp();
+const { getSkin } = useSkin();
+
+onMounted(async () => await getSkin(domain));
 </script>
 
 <template>
@@ -28,7 +33,7 @@ const { domain } = useApp();
         primary: primary,
         danger: variant === 'danger',
         disabled: disabled,
-        '!text-skin-bg': !domain && primary
+        '!text-skin-bg': !skin && primary
       }
     ]"
     :disabled="disabled || loading"

diff --git a/src/composables/useSkin.ts b/src/composables/useSkin.ts
@@ -27,7 +27,7 @@ const skinClass = ref('default');
 export function useSkin() {
   const { apolloQuery } = useApolloQuery();
 
-  async function getSkin(domain: string) {
+  async function getSkin(domain: string): Promise<string | null> {
     if (domain) {
       const space = await apolloQuery(
         {
@@ -41,8 +41,12 @@ export function useSkin() {
       if (space?.skin) {
         skinClass.value = space.skin;
         document.body.classList.add(skinClass.value);
+
+        return space.skin;
       }
     }
+
+    return null;
   }
 
   const getThemeIcon = () => (theme.value === LIGHT ? 'moon' : 'sun');