From 3b21bddf191fad9fe4aaedbb03a723cc0337c26d Mon Sep 17 00:00:00 2001 From: Georges KABBOUCHI Date: Tue, 7 Sep 2021 01:36:09 +0300 Subject: [PATCH] switch to ssr mode --- components/modal/web3/Web3Modal.vue | 2 +- composables/useCookies.ts | 25 +++++++++++++++++++++++++ composables/useDSA.ts | 4 ---- composables/useEagerConnect.ts | 2 +- composables/useNetwork.ts | 18 ++++++++++++------ composables/useStrategy.ts | 6 ------ nuxt.config.js | 4 +--- package.json | 1 + yarn.lock | 18 ++++++++++++++++++ 9 files changed, 59 insertions(+), 21 deletions(-) create mode 100644 composables/useCookies.ts diff --git a/components/modal/web3/Web3Modal.vue b/components/modal/web3/Web3Modal.vue index 9bc7ebd..707e93c 100644 --- a/components/modal/web3/Web3Modal.vue +++ b/components/modal/web3/Web3Modal.vue @@ -93,7 +93,7 @@ export default defineComponent({ close() } - const isMetamask = computed(() => window.ethereum && window.ethereum.isMetaMask) + const isMetamask = computed(() => process.server ? false : window.ethereum && window.ethereum.isMetaMask) const wallets = computed(() => Object.keys(SUPPORTED_WALLETS).map((key) => { const wallet = SUPPORTED_WALLETS[key] diff --git a/composables/useCookies.ts b/composables/useCookies.ts new file mode 100644 index 0000000..38c650a --- /dev/null +++ b/composables/useCookies.ts @@ -0,0 +1,25 @@ +import { useContext } from "@nuxtjs/composition-api"; +import Cookies from "universal-cookie"; + +export function useCookies() { + const { ssrContext } = useContext(); + + const cookies = new Cookies( + ssrContext ? ssrContext.req.headers.cookie : null + ); + + function get(key: string) { + return cookies.get(key); + } + + function set(key: string, value: any) { + return cookies.set(key, value, { + path: "/" + }); + } + + return { + get, + set + }; +} diff --git a/composables/useDSA.ts b/composables/useDSA.ts index 4b8f551..e222579 100644 --- a/composables/useDSA.ts +++ b/composables/useDSA.ts @@ -25,8 +25,6 @@ export function useDSA() { watch(active, () => { - console.log("here"); - if (library.value) { dsa.value = new DSA(library.value, chainId.value); } @@ -52,8 +50,6 @@ export function useDSA() { if (dsa.value) { refreshAccounts() } - //@ts-ignore - window.dsa = dsa.value; }); watch( diff --git a/composables/useEagerConnect.ts b/composables/useEagerConnect.ts index a93a600..a91c7e1 100644 --- a/composables/useEagerConnect.ts +++ b/composables/useEagerConnect.ts @@ -9,7 +9,7 @@ export function useEagerConnect() { const tried = ref(false); watchEffect(() => { - if (triedToConnectToSafe.value && !active.value) { + if (triedToConnectToSafe.value && !active.value && !tried.value) { injected.isAuthorized().then((isAuthorized: boolean) => { if (isAuthorized) { activate(injected, undefined, true).catch(() => { diff --git a/composables/useNetwork.ts b/composables/useNetwork.ts index 6100bb7..f06e238 100644 --- a/composables/useNetwork.ts +++ b/composables/useNetwork.ts @@ -1,11 +1,11 @@ -import { computed, onMounted, ref, watch } from "@nuxtjs/composition-api"; -import { useLocalStorage } from "vue-composable"; +import { computed, watchEffect, ref, watch } from "@nuxtjs/composition-api"; import MainnetSVG from "~/assets/icons/mainnet.svg?inline"; import PolygonSVG from "~/assets/icons/polygon.svg?inline"; import { useModal } from "./useModal"; import { useNotification } from "./useNotification"; import { useWeb3 } from "@instadapp/vue-web3"; +import { useCookies } from "./useCookies"; export enum Network { Mainnet = "mainnet", @@ -26,6 +26,7 @@ export function useNetwork() { const { showWarning } = useNotification(); const { account, chainId } = useWeb3(); const { showNetworksMismatchDialog } = useModal(); + const { get: getCookie, set: setCookie } = useCookies(); const networkMismatch = computed( () => chainId.value != activeNetwork.value?.chainId @@ -107,16 +108,21 @@ export function useNetwork() { } watch(activeNetworkId, () => { - localStorage.setItem("network", activeNetworkId.value); + setCookie("network", activeNetworkId.value); }); - onMounted(() => { + watchEffect(() => { if (activeNetworkId.value) { return; } - //@ts-ignore - activeNetworkId.value = localStorage.getItem("network") || "mainnet"; + const savedNetwork = getCookie("network"); + + if ((Object.values(Network) as any[]).includes(savedNetwork)) { + activeNetworkId.value = savedNetwork as Network; + } else { + activeNetworkId.value = Network.Mainnet; + } // refreshWeb3() }); diff --git a/composables/useStrategy.ts b/composables/useStrategy.ts index 3e8c48e..2341d5c 100644 --- a/composables/useStrategy.ts +++ b/composables/useStrategy.ts @@ -143,12 +143,6 @@ export function useStrategy(defineStrategy: DefineStrategy) { { immediate: true } ); - // testing - onMounted(() => { - //@ts-ignore - window.strategy = strategy; - }); - return { strategy, components, diff --git a/nuxt.config.js b/nuxt.config.js index fbaa8b1..6ebb310 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -1,7 +1,5 @@ export default { - // Target: https://go.nuxtjs.dev/config-target - target: 'static', - + ssr: !process.env.VERCEL, // Global page headers: https://go.nuxtjs.dev/config-head head: { title: 'Assembly', diff --git a/package.json b/package.json index a438659..11a30e7 100644 --- a/package.json +++ b/package.json @@ -33,6 +33,7 @@ "qrcode": "^1.4.4", "slugify": "^1.6.0", "tiny-emitter": "^2.1.0", + "universal-cookie": "^4.0.4", "v-click-outside": "^3.1.2", "v-tooltip": "^2.1.3", "vue-clipboard2": "^0.3.1", diff --git a/yarn.lock b/yarn.lock index ba64d91..1c16909 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1912,6 +1912,11 @@ dependencies: "@types/node" "*" +"@types/cookie@^0.3.3": + version "0.3.3" + resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.3.3.tgz#85bc74ba782fb7aa3a514d11767832b0e3bc6803" + integrity sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow== + "@types/etag@1.8.0": version "1.8.0" resolved "https://registry.yarnpkg.com/@types/etag/-/etag-1.8.0.tgz#37f0b1f3ea46da7ae319bbedb607e375b4c99f7e" @@ -4746,6 +4751,11 @@ cookie@^0.3.1: resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb" integrity sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s= +cookie@^0.4.0: + version "0.4.1" + resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.1.tgz#afd713fe26ebd21ba95ceb61f9a8116e50a537d1" + integrity sha512-ZwrFkGJxUR3EIoXtO+yVE69Eb7KlixbaeAWfBQB9vVsNn/o+Yw69gBWSSDK825hQNdN+wF8zELf3dFNl/kxkUA== + cookiejar@^2.1.1: version "2.1.2" resolved "https://registry.yarnpkg.com/cookiejar/-/cookiejar-2.1.2.tgz#dd8a235530752f988f9a0844f3fc589e3111125c" @@ -12580,6 +12590,14 @@ unique-slug@^2.0.0: dependencies: imurmurhash "^0.1.4" +universal-cookie@^4.0.4: + version "4.0.4" + resolved "https://registry.yarnpkg.com/universal-cookie/-/universal-cookie-4.0.4.tgz#06e8b3625bf9af049569ef97109b4bb226ad798d" + integrity sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw== + dependencies: + "@types/cookie" "^0.3.3" + cookie "^0.4.0" + universalify@^0.1.0: version "0.1.2" resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"