snapshot-labs · zzuziak · Oct 29, 2022 · Oct 29, 2022 · Oct 31, 2022 · Oct 31, 2022
diff --git a/.browserslistrc b/.browserslistrc
@@ -0,0 +1,3 @@
+> 1%
+last 2 versions
+not dead
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,12 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = LF
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
diff --git a/.env.example b/.env.example
@@ -0,0 +1,3 @@
+VITE_API_URL=
+VITE_IPFS_GATEWAY=
+SNAPSHOT_WEBHOOK_API=
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -0,0 +1,33 @@
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+    'vue/setup-compiler-macros': true
+  },
+  extends: [
+    'plugin:vue/vue3-recommended',
+    'eslint:recommended',
+    '@vue/typescript/recommended',
+    '@vue/prettier'
+  ],
+  ignorePatterns: ['/node_modules/**/*.*'],
+  parserOptions: {
+    ecmaVersion: 2020
+  },
+  rules: {
+    'no-console': 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/ban-ts-ignore': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    'vue/multi-word-component-names': 'off',
+    'vue/require-default-prop': 'off',
+    'vue/no-v-html': 'off',
+    'prettier/prettier': 'error'
+  },
+  globals: {
+    $ref: 'readonly',
+    defineProps: 'readonly',
+    defineEmits: 'readonly'
+  }
+};
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -0,0 +1,15 @@
+name: Test
+on: [push]
+
+jobs:
+  build-test:
+    runs-on: ubuntu-20.04
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+          cache: 'yarn'
+      - run: yarn --frozen-lockfile
+      - run: yarn lint:nofix
+      - run: yarn test:unit
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,26 @@
+.DS_Store
+node_modules
+/dist
+/coverage
+.yalc
+components.d.ts
+.env
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,7 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "none",
+  "arrowParens": "avoid"
+}
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) Snapshot Labs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ['@vue/cli-plugin-babel/preset']
+};
diff --git a/index.html b/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Snapshot Webhooks</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+<script>var global = global || window;</script>
diff --git a/main.js b/main.js
@@ -0,0 +1,30 @@
+const { app, BrowserWindow } = require('electron');
+const path = require('path');
+
+function createWindow() {
+	const win = new BrowserWindow({
+		width: 400,
+		height: 660,
+		webPreferences: {
+			preload: path.join(__dirname, 'preload.js'),
+		},
+	});
+
+	win.loadFile('dist/index.html');
+}
+
+app.whenReady().then(() => {
+	createWindow();
+
+	app.on('activate', () => {
+		if (BrowserWindow.getAllWindows().length === 0) {
+			createWindow();
+		}
+	});
+});
+
+app.on('window-all-closed', () => {
+	if (process.platform !== 'darwin') {
+		app.quit();
+	}
+});
diff --git a/package.json b/package.json
@@ -0,0 +1,56 @@
+{
+  "name": "webhook-ui",
+  "version": "0.1.0",
+  "license": "MIT",
+  "main": "main.js",
+  "scripts": {
+    "dev": "vite --port=8080",
+    "build": "vite build",
+    "lint:nofix": "eslint \"./src/**/*.{ts,vue,json}\"",
+    "lint": "yarn lint:nofix --fix",
+    "electron:start": "electron ."
+  },
+  "dependencies": {
+    "@apollo/client": "^3.6.2",
+    "@esbuild-plugins/node-globals-polyfill": "^0.1.1",
+    "@ethersproject/providers": "^5.6.4",
+    "@ethersproject/units": "^5.6.1",
+    "@snapshot-labs/lock": "^0.1.97",
+    "@snapshot-labs/snapshot.js": "^0.4.11",
+    "@vueuse/core": "^8.9.4",
+    "@walletconnect/client": "^1.7.8",
+    "ajv": "^8.11.0",
+    "dayjs": "^1.11.2",
+    "electron": "^19.0.3",
+    "graphql": "^16.5.0",
+    "graphql-tag": "^2.12.6",
+    "pinia": "^2.0.22",
+    "rollup-plugin-node-polyfills": "^0.2.1",
+    "scrollmonitor": "^1.2.9",
+    "vue": "^3.2.37",
+    "vue-router": "^4.1.2"
+  },
+  "devDependencies": {
+    "@iconify-json/heroicons-outline": "^1.1.2",
+    "@types/node": "^18.6.1",
+    "@typescript-eslint/eslint-plugin": "^5.30.7",
+    "@typescript-eslint/parser": "^5.30.7",
+    "@vitejs/plugin-vue": "^3.0.1",
+    "@vue/eslint-config-prettier": "^7.0.0",
+    "@vue/eslint-config-typescript": "^10.0.0",
+    "autoprefixer": "^10.4.5",
+    "eslint": "^8.20.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-vue": "^8.7.1",
+    "postcss": "^8.4.13",
+    "prettier": "^2.7.1",
+    "rollup-plugin-visualizer": "^5.7.1",
+    "sass": "^1.54.0",
+    "tailwindcss": "^3.1.6",
+    "typescript": "^4.7.3",
+    "unplugin-icons": "^0.14.3",
+    "unplugin-vue-components": "^0.21.1",
+    "vite": "^3.0.3",
+    "vitest": "^0.19.0"
+  }
+}
diff --git a/postcss.config.js b/postcss.config.js
@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {}
+  }
+}
diff --git a/preload.js b/preload.js
@@ -0,0 +1,10 @@
+window.addEventListener('DOMContentLoaded', () => {
+	const replaceText = (selector, text) => {
+		const element = document.getElementById(selector);
+		if (element) element.innerText = text;
+	};
+
+	for (const type of ['chrome', 'node', 'electron']) {
+		replaceText(`${type}-version`, process.versions[type]);
+	}
+});
diff --git a/src/App.vue b/src/App.vue
@@ -0,0 +1,35 @@
+<script setup>
+import { onMounted, provide, watch } from 'vue';
+import { useModal } from '@/composables/useModal';
+import { useApp } from '@/composables/useApp';
+import { useWeb3 } from '@/composables/useWeb3';
+
+const { modalOpen } = useModal();
+const { init, app } = useApp();
+const { web3 } = useWeb3();
+
+provide('web3', web3);
+
+onMounted(async () => await init());
+
+watch(modalOpen, val => {
+  const el = document.body;
+  el.classList[val ? 'add' : 'remove']('overflow-hidden');
+});
+</script>
+
+<template>
+  <div
+    class="overflow-hidden font-serif text-base min-h-screen bg-skin-bg text-skin-text antialiased"
+  >
+    <UiLoading v-if="app.loading || !app.init" class="overlay big" />
+    <div v-else class="pb-6 flex">
+      <div class="flex-auto w-full">
+        <Topnav />
+        <router-view :key="$route.path" />
+      </div>
+    </div>
+    <div id="modal" />
+  </div>
+  <BaseFlashNotification />
+</template>
diff --git a/src/assets/fonts/Calibre-Medium-Custom.woff2 b/src/assets/fonts/Calibre-Medium-Custom.woff2
diff --git a/src/assets/fonts/Calibre-Semibold-Custom.woff2 b/src/assets/fonts/Calibre-Semibold-Custom.woff2
diff --git a/src/assets/fonts/SpaceMono-Bold.woff2 b/src/assets/fonts/SpaceMono-Bold.woff2
diff --git a/src/assets/fonts/SpaceMono-Regular.woff2 b/src/assets/fonts/SpaceMono-Regular.woff2
diff --git a/src/assets/grid-dark.svg b/src/assets/grid-dark.svg
diff --git a/src/assets/grid-light.svg b/src/assets/grid-light.svg
diff --git a/src/components/BaseFlashNotification.vue b/src/components/BaseFlashNotification.vue
@@ -0,0 +1,25 @@
+<script setup>
+import { useFlashNotification } from '@/composables/useFlashNotification';
+
+const { items } = useFlashNotification();
+</script>
+
+<template>
+  <div
+    class="pointer-events-none fixed left-0 right-0 bottom-0 z-[60] mb-4 flex flex-col items-center space-y-2"
+  >
+    <TransitionGroup name="fade">
+      <div v-for="item in items" :key="item.id" class="pointer-events-auto">
+        <UiButton
+          class="m-5 p-3 flex items-center space-x-2 rounded !bg-red !text-white"
+          :class="`!bg-${item.type}`"
+          @click="item.remove()"
+        >
+          <IH-x v-if="item.type === 'red'" class="text-sm" />
+          <IH-check v-if="item.type === 'green'" class="text-sm" />
+          <span>{{ item.message }}</span>
+        </UiButton>
+      </div>
+    </TransitionGroup>
+  </div>
+</template>
diff --git a/src/components/Container.vue b/src/components/Container.vue
@@ -0,0 +1,8 @@
+<script setup>
+defineProps({ slim: Boolean });
+</script>
+<template>
+  <div :class="slim ? 'px-0 sm:px-4' : 'px-4'" class="max-w-xl mx-auto">
+    <slot />
+  </div>
+</template>