Skip to content

Instantly share code, notes, and snippets.

@sebastinez

sebastinez/formatter.diff

Last active June 9, 2021 01:50
Show Gist options
  • Save sebastinez/f40742b5dfb84ea80d66c1686ec21eb1 to your computer and use it in GitHub Desktop.
Save sebastinez/f40742b5dfb84ea80d66c1686ec21eb1 to your computer and use it in GitHub Desktop.
Download ZIP
Diff after auto formatting
Raw
formatter.diff
diff --git a/.github/workflows/check-format.yml b/.github/workflows/check-format.yml
index 244d4d6..bda8d78 100644
--- a/.github/workflows/check-format.yml
+++ b/.github/workflows/check-format.yml
@@ -9,4 +9,3 @@ jobs:
- uses: actions/setup-node@v1
- run: ./scripts/format
shell: bash
-
diff --git a/prettier.config.js b/prettier.config.js
index e08b9ff..654466a 100644
--- a/prettier.config.js
+++ b/prettier.config.js
@@ -1,11 +1,11 @@
module.exports = {
- "arrowParens": "avoid",
- "tabWidth": 2,
- "semi": true,
- "singleQuote": true,
- "quoteProps": "preserve",
- "trailingComma": "es5",
- "plugins": ["prettier-plugin-svelte"],
- "svelteSortOrder" : "options-scripts-styles-markup",
- "svelteBracketNewLine": false
-}
\ No newline at end of file
+ 'arrowParens': 'avoid',
+ 'tabWidth': 2,
+ 'semi': true,
+ 'singleQuote': true,
+ 'quoteProps': 'preserve',
+ 'trailingComma': 'es5',
+ 'plugins': ['prettier-plugin-svelte'],
+ 'svelteSortOrder': 'options-scripts-styles-markup',
+ 'svelteBracketNewLine': false,
+};
diff --git a/public/index.css b/public/index.css
index 627d184..80e25ea 100644
--- a/public/index.css
+++ b/public/index.css
@@ -1,317 +1,323 @@
@import url(./typography.css);
* {
- outline: none !important;
- box-sizing: border-box;
+ outline: none !important;
+ box-sizing: border-box;
}
:root {
- --color-primary: #ff55ff;
- --color-primary-1: #382847;
- --color-primary-2: #62326d;
- --color-primary-5: #dd44dd;
- --color-primary-6: #ffd4ff;
- --color-primary-faded: #ff55ff77;
- --color-secondary: #5555ff;
- --color-secondary-background: #5555ff11;
- --color-secondary-faded: #5555ff77;
- --color-secondary-1: #212847;
- --color-secondary-2: #2c326d;
- --color-secondary-6: #e3e3ff;
- --color-tertiary: #55ffff;
- --color-tertiary-background: #55ffff11;
- --color-tertiary-1: #214047;
- --color-tertiary-2: #2c326d;
- --color-tertiary-6: #e3e3ff;
- --color-yellow: #ffff99;
- --color-yellow-background: #ffff9911;
- --color-positive: #53db53;
- --color-positive-1: #21402f;
- --color-positive-2: #2c6837;
- --color-positive-6: #e3ffe3;
- --color-caution: #ffc555;
- --color-caution-1: #2f312d;
- --color-caution-2: #524a34;
- --color-caution-6: #ffefcf;
- --color-negative: #ff5555;
- --color-negative-background: #ff555511;
- --color-negative-1: #38282f;
- --color-negative-2: #623237;
- --color-negative-6: #ffd4d4;
- --color-foreground: #ffffff;
- --color-foreground-faded: #777788;
- --color-foreground-background: #77778811;
- --color-foreground-1: #242e38;
- --color-foreground-2: #29343d;
- --color-foreground-3: #333e47;
- --color-foreground-4: #5e6d7a;
- --color-foreground-5: #8594a1;
- --color-foreground-6: #d3dee8;
- --color-background: #0b131a;
- --color-glow: #5555ff22;
- --color-glow-error: #ff555522;
+ --color-primary: #ff55ff;
+ --color-primary-1: #382847;
+ --color-primary-2: #62326d;
+ --color-primary-5: #dd44dd;
+ --color-primary-6: #ffd4ff;
+ --color-primary-faded: #ff55ff77;
+ --color-secondary: #5555ff;
+ --color-secondary-background: #5555ff11;
+ --color-secondary-faded: #5555ff77;
+ --color-secondary-1: #212847;
+ --color-secondary-2: #2c326d;
+ --color-secondary-6: #e3e3ff;
+ --color-tertiary: #55ffff;
+ --color-tertiary-background: #55ffff11;
+ --color-tertiary-1: #214047;
+ --color-tertiary-2: #2c326d;
+ --color-tertiary-6: #e3e3ff;
+ --color-yellow: #ffff99;
+ --color-yellow-background: #ffff9911;
+ --color-positive: #53db53;
+ --color-positive-1: #21402f;
+ --color-positive-2: #2c6837;
+ --color-positive-6: #e3ffe3;
+ --color-caution: #ffc555;
+ --color-caution-1: #2f312d;
+ --color-caution-2: #524a34;
+ --color-caution-6: #ffefcf;
+ --color-negative: #ff5555;
+ --color-negative-background: #ff555511;
+ --color-negative-1: #38282f;
+ --color-negative-2: #623237;
+ --color-negative-6: #ffd4d4;
+ --color-foreground: #ffffff;
+ --color-foreground-faded: #777788;
+ --color-foreground-background: #77778811;
+ --color-foreground-1: #242e38;
+ --color-foreground-2: #29343d;
+ --color-foreground-3: #333e47;
+ --color-foreground-4: #5e6d7a;
+ --color-foreground-5: #8594a1;
+ --color-foreground-6: #d3dee8;
+ --color-background: #0b131a;
+ --color-glow: #5555ff22;
+ --color-glow-error: #ff555522;
- --font-family-sans-serif: Inter, sans-serif;
- --font-family-monospace: monospace;
- --border-radius: 50px;
- --box-shadow-color: var(--color-secondary-2);
+ --font-family-sans-serif: Inter, sans-serif;
+ --font-family-monospace: monospace;
+ --border-radius: 50px;
+ --box-shadow-color: var(--color-secondary-2);
}
-
body {
- font-size: 16px;
- font-weight: 400;
- line-height: 1.5;
- min-width: 580px;
- color: white;
- text-align: left;
- background-color: var(--color-background);
- -webkit-font-smoothing: antialiased;
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ min-width: 580px;
+ color: white;
+ text-align: left;
+ background-color: var(--color-background);
+ -webkit-font-smoothing: antialiased;
}
html {
- font-family: sans-serif;
- line-height: 1.15;
- height: 100%;
- -webkit-text-size-adjust: 100%;
- -ms-text-size-adjust: 100%;
- -ms-overflow-style: scrollbar;
- -webkit-tap-highlight-color: transparent;
+ font-family: sans-serif;
+ line-height: 1.15;
+ height: 100%;
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+ -ms-overflow-style: scrollbar;
+ -webkit-tap-highlight-color: transparent;
}
::-moz-selection {
- background: var(--color-primary);
- color: var(--color-background);
+ background: var(--color-primary);
+ color: var(--color-background);
}
::selection {
- background: var(--color-primary);
- color: var(--color-background);
+ background: var(--color-primary);
+ color: var(--color-background);
}
code {
- font-family: monospace;
- font-size: 0.95rem;
+ font-family: monospace;
+ font-size: 0.95rem;
}
-main, section {
- display: block;
+main,
+section {
+ display: block;
}
-body, input, textarea, button {
- font-family: var(--font-family-sans-serif);
- font-feature-settings: "ss01", "ss02", "cv01", "cv03";
+body,
+input,
+textarea,
+button {
+ font-family: var(--font-family-sans-serif);
+ font-feature-settings: 'ss01', 'ss02', 'cv01', 'cv03';
}
button {
- color: var(--color-foreground-6);
- background: transparent;
- font-size: 1rem;
- padding: 1rem 1.5rem;
- border: 1px solid var(--color-foreground-6);
- border-radius: var(--border-radius);
- cursor: pointer;
- min-width: 8rem;
+ color: var(--color-foreground-6);
+ background: transparent;
+ font-size: 1rem;
+ padding: 1rem 1.5rem;
+ border: 1px solid var(--color-foreground-6);
+ border-radius: var(--border-radius);
+ cursor: pointer;
+ min-width: 8rem;
}
button:not([disabled]):hover {
- color: var(--color-background) !important;
- background-color: var(--color-foreground);
+ color: var(--color-background) !important;
+ background-color: var(--color-foreground);
}
button.waiting {
- cursor: wait;
+ cursor: wait;
}
button.secondary {
- color: var(--color-secondary);
- border-color: var(--color-secondary);
+ color: var(--color-secondary);
+ border-color: var(--color-secondary);
}
button.secondary[disabled] {
- color: var(--color-secondary-faded);
- border-color: var(--color-secondary-faded);
+ color: var(--color-secondary-faded);
+ border-color: var(--color-secondary-faded);
}
button.secondary:not([disabled]):hover {
- background-color: var(--color-secondary);
+ background-color: var(--color-secondary);
}
button.primary {
- color: var(--color-primary);
- border-color: var(--color-primary);
+ color: var(--color-primary);
+ border-color: var(--color-primary);
}
-button.primary:hover, button.primary.active {
- color: var(--color-background);
- background-color: var(--color-primary);
+button.primary:hover,
+button.primary.active {
+ color: var(--color-background);
+ background-color: var(--color-primary);
}
button.primary[disabled] {
- color: var(--color-primary-faded) !important;
- border-color: var(--color-primary-faded) !important;
- background-color: transparent;
+ color: var(--color-primary-faded) !important;
+ border-color: var(--color-primary-faded) !important;
+ background-color: transparent;
}
button[disabled] {
- cursor: not-allowed !important;
- color: var(--color-foreground-faded);
- border-color: var(--color-foreground-faded);
+ cursor: not-allowed !important;
+ color: var(--color-foreground-faded);
+ border-color: var(--color-foreground-faded);
}
button[data-waiting] {
- cursor: wait !important;
+ cursor: wait !important;
}
button.text {
- color: var(--color-foreground-6);
- background-color: transparent;
- border: none;
- min-width: 3rem;
+ color: var(--color-foreground-6);
+ background-color: transparent;
+ border: none;
+ min-width: 3rem;
}
button.text:hover {
- background-color: var(--color-foreground);
+ background-color: var(--color-foreground);
}
button.small {
- padding-top: 0.5rem;
- padding-bottom: 0.5rem;
- min-width: 6rem;
+ padding-top: 0.5rem;
+ padding-bottom: 0.5rem;
+ min-width: 6rem;
}
button.tiny {
- min-width: 0;
- padding: 0 0.75rem;
- height: 2rem;
+ min-width: 0;
+ padding: 0 0.75rem;
+ height: 2rem;
}
a {
- color: #d0d0d0;
- text-decoration: none;
- border-bottom: 1px dashed #444;
+ color: #d0d0d0;
+ text-decoration: none;
+ border-bottom: 1px dashed #444;
}
a:hover {
- color: var(--color-foreground);
- border-bottom-color: var(--color-foreground);
+ color: var(--color-foreground);
+ border-bottom-color: var(--color-foreground);
}
a.primary {
- color: var(--color-primary);
- border-bottom-color: var(--color-primary-faded);
+ color: var(--color-primary);
+ border-bottom-color: var(--color-primary-faded);
}
a.primary:hover {
- color: var(--color-primary-faded);
- border-bottom-color: var(--color-primary-faded);
+ color: var(--color-primary-faded);
+ border-bottom-color: var(--color-primary-faded);
}
a.address {
- border-bottom-color: transparent;
+ border-bottom-color: transparent;
}
-input[type="text"], button {
- line-height: 1.5em;
-}
-input[type="text"] {
- outline: none;
- border: none;
- font-size: 1rem;
- color: var(--color-foreground);
- background: transparent;
- border: 1px solid var(--color-secondary);
- border-radius: var(--border-radius);
- padding: 1rem 1.5rem;
- margin: 1rem;
-}
-input[type="text"]::placeholder {
- color: var(--color-secondary);
+input[type='text'],
+button {
+ line-height: 1.5em;
+}
+input[type='text'] {
+ outline: none;
+ border: none;
+ font-size: 1rem;
+ color: var(--color-foreground);
+ background: transparent;
+ border: 1px solid var(--color-secondary);
+ border-radius: var(--border-radius);
+ padding: 1rem 1.5rem;
+ margin: 1rem;
+}
+input[type='text']::placeholder {
+ color: var(--color-secondary);
}
input.wide {
- width: 44ch;
+ width: 44ch;
}
.modal-actions button {
- margin-right: 1rem;
+ margin-right: 1rem;
}
.modal-actions button:last-child {
- margin-right: 0;
+ margin-right: 0;
}
.modal.error .modal-title {
- color: var(--color-negative);
+ color: var(--color-negative);
}
.modal.error .modal-actions button {
- color: var(--color-negative);
- border-color: var(--color-negative);
+ color: var(--color-negative);
+ border-color: var(--color-negative);
}
.modal.error .modal-actions button:hover {
- background-color: var(--color-negative);
+ background-color: var(--color-negative);
}
.error {
- color: var(--color-negative) !important;
- border-color: var(--color-negative) !important;
- --box-shadow-color: var(--color-negative-2) !important;
+ color: var(--color-negative) !important;
+ border-color: var(--color-negative) !important;
+ --box-shadow-color: var(--color-negative-2) !important;
}
.highlight {
- color: var(--color-secondary);
+ color: var(--color-secondary);
}
.subtle {
- color: var(--color-foreground-faded);
- font-style: italic;
+ color: var(--color-foreground-faded);
+ font-style: italic;
}
.faded {
- color: var(--color-foreground-faded);
+ color: var(--color-foreground-faded);
}
.label {
- color: var(--color-secondary);
+ color: var(--color-secondary);
}
.bold {
- font-weight: bold !important;
+ font-weight: bold !important;
}
.badge {
- color: var(--color-foreground-faded);
- background: var(--color-foreground-background);
- border-radius: var(--border-radius);
- padding: 0.125rem 0.5rem;
- margin: 0 0.5rem;
- font-size: 0.75rem;
- line-height: 1.5;
+ color: var(--color-foreground-faded);
+ background: var(--color-foreground-background);
+ border-radius: var(--border-radius);
+ padding: 0.125rem 0.5rem;
+ margin: 0 0.5rem;
+ font-size: 0.75rem;
+ line-height: 1.5;
}
.badge.tertiary {
- color: var(--color-tertiary);
- background: var(--color-tertiary-background);
+ color: var(--color-tertiary);
+ background: var(--color-tertiary-background);
}
.badge.safe {
- color: var(--color-yellow);
- background: var(--color-yellow-background);
+ color: var(--color-yellow);
+ background: var(--color-yellow-background);
}
span.small {
- font-size: 0.75rem;
+ font-size: 0.75rem;
}
button.error:hover {
- background-color: var(--color-negative);
+ background-color: var(--color-negative);
}
table {
- table-layout: fixed;
- border-collapse: separate;
- border-spacing: 2rem 0;
+ table-layout: fixed;
+ border-collapse: separate;
+ border-spacing: 2rem 0;
}
td {
- text-align: left;
- text-overflow: ellipsis;
+ text-align: left;
+ text-overflow: ellipsis;
}
td strong {
- font-weight: 600;
+ font-weight: 600;
}
-h1, .title {
- font-size: 1.75rem;
- font-weight: normal;
- color: var(--color-secondary);
- text-align: left;
- text-overflow: ellipsis;
- overflow-x: hidden;
+h1,
+.title {
+ font-size: 1.75rem;
+ font-weight: normal;
+ color: var(--color-secondary);
+ text-align: left;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
}
h1 {
- margin-bottom: 2rem;
+ margin-bottom: 2rem;
}
h2 {
- margin: 1.5rem 0;
+ margin: 1.5rem 0;
}
h3 {
- margin: 1rem 0;
+ margin: 1rem 0;
}
p {
- margin: 1rem 0;
+ margin: 1rem 0;
}
diff --git a/public/index.html b/public/index.html
index cedb991..032020b 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,12 +4,22 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Interact with Radicle" />
- <meta name="theme-color" content="#0e171f">
+ <meta name="theme-color" content="#0e171f" />
<link rel="stylesheet" type="text/css" href="/index.css" />
- <link rel="icon" href="/favicon.ico">
- <link rel="icon" href="/favicon.svg" type="image/svg+xml">
- <link rel="preload" href="/fonts/Inter-Regular.woff" as="font" type="font/woff">
- <link rel="preload" href="/fonts/Inter-SemiBold.otf" as="font" type="font/otf">
+ <link rel="icon" href="/favicon.ico" />
+ <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+ <link
+ rel="preload"
+ href="/fonts/Inter-Regular.woff"
+ as="font"
+ type="font/woff"
+ />
+ <link
+ rel="preload"
+ href="/fonts/Inter-SemiBold.otf"
+ as="font"
+ type="font/otf"
+ />
<title>Radicle Interface</title>
</head>
diff --git a/public/typography.css b/public/typography.css
index 6f13040..5ecb1be 100644
--- a/public/typography.css
+++ b/public/typography.css
@@ -1,42 +1,42 @@
@font-face {
- font-family: "Inter";
- font-style: normal;
- font-weight: 400;
- font-display: swap;
- src: url("fonts/Inter-Regular.woff");
+ font-family: 'Inter';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: url('fonts/Inter-Regular.woff');
}
@font-face {
- font-family: "Inter";
- font-style: bold;
- font-weight: 600;
- font-display: swap;
- src: url("fonts/Inter-SemiBold.otf");
+ font-family: 'Inter';
+ font-style: bold;
+ font-weight: 600;
+ font-display: swap;
+ src: url('fonts/Inter-SemiBold.otf');
}
@font-face {
- font-family: "Inter";
- font-style: bold;
- font-weight: 700;
- font-display: swap;
- src: url("fonts/Inter-Bold.otf");
+ font-family: 'Inter';
+ font-style: bold;
+ font-weight: 700;
+ font-display: swap;
+ src: url('fonts/Inter-Bold.otf');
}
@font-face {
- font-family: "Source Code Pro";
- font-style: bold;
- font-weight: 600;
- src: url("fonts/SourceCodePro-Semibold.otf");
+ font-family: 'Source Code Pro';
+ font-style: bold;
+ font-weight: 600;
+ src: url('fonts/SourceCodePro-Semibold.otf');
}
@font-face {
- font-family: "Source Code Pro";
- font-style: bold;
- font-weight: 700;
- src: url("fonts/SourceCodePro-Bold.otf");
+ font-family: 'Source Code Pro';
+ font-style: bold;
+ font-weight: 700;
+ src: url('fonts/SourceCodePro-Bold.otf');
}
:root {
- --typeface: "Inter";
- --typeface-mono: "Source Code Pro";
+ --typeface: 'Inter';
+ --typeface-mono: 'Source Code Pro';
}
diff --git a/snowpack.config.js b/snowpack.config.js
index 8f16a88..a147e14 100644
--- a/snowpack.config.js
+++ b/snowpack.config.js
@@ -10,24 +10,21 @@ module.exports = {
alias: {
'@app': './src',
},
- plugins: [
- '@snowpack/plugin-svelte',
- '@snowpack/plugin-typescript',
- ],
+ plugins: ['@snowpack/plugin-svelte', '@snowpack/plugin-typescript'],
routes: [
/* Enable an SPA Fallback in development: */
- {"match": "routes", "src": ".*", "dest": "/index.html"},
+ { 'match': 'routes', 'src': '.*', 'dest': '/index.html' },
],
optimize: {
/* Setting `bundle: true` breaks .json imports in snowpack 3.5.0 */
- "bundle": false,
+ 'bundle': false,
},
packageOptions: {
polyfillNode: true,
},
devOptions: {
- open: "none",
- output: "dashboard"
+ open: 'none',
+ output: 'dashboard',
},
buildOptions: {
/* ... */
diff --git a/src/Address.svelte b/src/Address.svelte
index 2571c5f..bf3824c 100644
--- a/src/Address.svelte
+++ b/src/Address.svelte
@@ -17,9 +17,9 @@
let addressName: string | null = null;
onMount(() => {
- identifyAddress(address, config).then(typ => addressType = typ);
+ identifyAddress(address, config).then(typ => (addressType = typ));
if (resolve) {
- config.provider.lookupAddress(address).then(name => addressName = name);
+ config.provider.lookupAddress(address).then(name => (addressName = name));
}
});
@@ -49,7 +49,7 @@
</style>
<div class="address">
- <span class="icon"><Blockies address={address} /></span>
+ <span class="icon"><Blockies {address} /></span>
{#if addressType === AddressType.Org}
<a use:link href={`/orgs/${address}`}>{addressLabel}</a>
<span class="badge">org</span>
diff --git a/src/App.svelte b/src/App.svelte
index 8b5858b..42a4136 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,5 +1,5 @@
<script lang="typescript">
- import { Router, Route } from "svelte-routing";
+ import { Router, Route } from 'svelte-routing';
import { getConfig } from '@app/config';
import { session } from '@app/session';
@@ -14,8 +14,11 @@
function handleKeydown(event: KeyboardEvent) {
if (event.key === 'Enter') {
- let elems = document.querySelectorAll('button.primary') as NodeListOf<HTMLElement>;
- if (elems.length == 1) { // We only allow this when there's one primary button.
+ let elems = document.querySelectorAll(
+ 'button.primary'
+ ) as NodeListOf<HTMLElement>;
+ if (elems.length == 1) {
+ // We only allow this when there's one primary button.
elems[0].click();
}
}
diff --git a/src/Blockies.svelte b/src/Blockies.svelte
index be1c12e..3917846 100644
--- a/src/Blockies.svelte
+++ b/src/Blockies.svelte
@@ -33,4 +33,4 @@
}
</style>
-<div class="icon" bind:this={container} class:glowOnHover></div>
+<div class="icon" bind:this={container} class:glowOnHover />
diff --git a/src/Connect.svelte b/src/Connect.svelte
index 5c827c5..f7fc637 100644
--- a/src/Connect.svelte
+++ b/src/Connect.svelte
@@ -1,12 +1,12 @@
<script lang="typescript">
- import { Connection } from "@app/session";
+ import { Connection } from '@app/session';
import { state } from '@app/session';
import type { Config } from '@app/config';
export let config: Config;
- export let caption = "Connect";
- export let className = "";
- export let style = "";
+ export let caption = 'Connect';
+ export let className = '';
+ export let style = '';
let walletUnavailable = !window.ethereum;
@@ -21,8 +21,7 @@
{style}
class="connect {className}"
disabled={connecting || walletUnavailable}
- data-waiting={connecting || null}
->
+ data-waiting={connecting || null}>
{#if connecting}
Connecting...
{:else}
diff --git a/src/Error.svelte b/src/Error.svelte
index c898143..6ec5092 100644
--- a/src/Error.svelte
+++ b/src/Error.svelte
@@ -6,13 +6,13 @@
const dispatch = createEventDispatcher();
export let error: Err | null = null;
- export let title = "Error";
- export let subtitle: string = "";
- export let message: string = "";
+ export let title = 'Error';
+ export let subtitle: string = '';
+ export let message: string = '';
export let floating = false;
export let subtle = false;
- let body = message || (error && error.message) || "";
+ let body = message || (error && error.message) || '';
</script>
<Modal on:close error {floating} {subtle}>
@@ -26,13 +26,12 @@
<span slot="body">
<slot>
- <strong>Error:</strong> {body}
+ <strong>Error:</strong>
+ {body}
</slot>
</span>
<span slot="actions">
- <button on:click={() => dispatch('close')}>
- Back
- </button>
+ <button on:click={() => dispatch('close')}> Back </button>
</span>
</Modal>
diff --git a/src/Form.svelte b/src/Form.svelte
index 6f7e0b7..4e2059c 100644
--- a/src/Form.svelte
+++ b/src/Form.svelte
@@ -1,10 +1,10 @@
<script context="module" lang="typescript">
export interface Field {
- name: string
- value: string | null
- label?: string
- placeholder?: string
- editable: boolean
+ name: string;
+ value: string | null;
+ label?: string;
+ placeholder?: string;
+ editable: boolean;
}
</script>
@@ -87,13 +87,18 @@
</div>
<div>
{#if field.editable && editable}
- <input name={field.name} class="field" placeholder={field.placeholder}
- bind:value={field.value} type="text" {disabled} />
+ <input
+ name={field.name}
+ class="field"
+ placeholder={field.placeholder}
+ bind:value={field.value}
+ type="text"
+ {disabled} />
{:else}
<span class="field">
{#if field.value}
{#if isUrl(field.value)}
- <a href="{field.value}" target="_blank">{field.value}</a>
+ <a href={field.value} target="_blank">{field.value}</a>
{:else if isAddress(field.value)}
<Address address={field.value} {config} />
{:else}
@@ -109,10 +114,6 @@
</div>
<div class="actions" class:editable>
- <button on:click={cancel} {disabled} class="small">
- Cancel
- </button>
- <button on:click={save} {disabled} class="small primary">
- Save
- </button>
+ <button on:click={cancel} {disabled} class="small"> Cancel </button>
+ <button on:click={save} {disabled} class="small primary"> Save </button>
</div>
diff --git a/src/Header.svelte b/src/Header.svelte
index 5980cc0..707e6cf 100644
--- a/src/Header.svelte
+++ b/src/Header.svelte
@@ -1,9 +1,9 @@
<script lang="typescript">
// TODO: Shorten tx hash
- import { link } from "svelte-routing";
- import { formatBalance, formatAddress } from "@app/utils";
+ import { link } from 'svelte-routing';
+ import { formatBalance, formatAddress } from '@app/utils';
import { error, Failure } from '@app/error';
- import { disconnectWallet } from "@app/session";
+ import { disconnectWallet } from '@app/session';
import type { Session } from '@app/session';
import Logo from './Logo.svelte';
import Connect from './Connect.svelte';
@@ -45,7 +45,8 @@
header .nav a:hover {
color: var(--color-foreground);
}
- header .left, header .right {
+ header .left,
+ header .right {
display: flex;
align-items: center;
}
@@ -90,12 +91,12 @@
margin-left: 2rem;
}
- @media(max-width: 800px) {
+ @media (max-width: 800px) {
.balance {
display: none;
}
}
- @media(max-width: 720px) {
+ @media (max-width: 720px) {
.network {
display: none;
}
@@ -108,7 +109,8 @@
{#if $error.message}
<strong>Error:</strong> {$error.message}
{:else if $error.txHash}
- <strong>Error:</strong> Transaction <a href="https://etherscan.io/tx/{$error.txHash}">{$error.txHash}</a> failed.
+ <strong>Error:</strong> Transaction
+ <a href="https://etherscan.io/tx/{$error.txHash}">{$error.txHash}</a> failed.
{/if}
</div>
{/if}
@@ -140,11 +142,12 @@
{formatBalance(tokenBalance)} <strong>RAD</strong>
</span>
- <button class="address outline small" bind:this={sessionButton}
+ <button
+ class="address outline small"
+ bind:this={sessionButton}
on:click={disconnectWallet}
- on:mouseover={() => sessionButtonHover = true}
- on:mouseout={() => sessionButtonHover = false}
- >
+ on:mouseover={() => (sessionButtonHover = true)}
+ on:mouseout={() => (sessionButtonHover = false)}>
{#if sessionButtonHover}
Disconnect
{:else}
diff --git a/src/Icon.svelte b/src/Icon.svelte
index 260d56a..311570a 100644
--- a/src/Icon.svelte
+++ b/src/Icon.svelte
@@ -5,15 +5,15 @@
const icons = [
{
- name: "twitter",
+ name: 'twitter',
size: 24,
- data: `<path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>`
+ data: `<path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>`,
},
{
- name: "github",
+ name: 'github',
size: 24,
- data: `<path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>`
- }
+ data: `<path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>`,
+ },
];
const svg = icons.find(e => e.name === name);
</script>
@@ -25,10 +25,12 @@
</style>
{#if svg}
- <svg role="img" class={$$props.class}
- width={width || "1rem"}
- height={height || "1rem"}
- viewBox="0 0 {svg.size} {svg.size}">
+ <svg
+ role="img"
+ class={$$props.class}
+ width={width || '1rem'}
+ height={height || '1rem'}
+ viewBox="0 0 {svg.size} {svg.size}">
{@html svg.data}
</svg>
{/if}
diff --git a/src/Link.svelte b/src/Link.svelte
index 8e6818f..4e2c442 100644
--- a/src/Link.svelte
+++ b/src/Link.svelte
@@ -1,17 +1,17 @@
<script lang="typescript">
- import { Link } from "svelte-routing";
+ import { Link } from 'svelte-routing';
export let to: string;
export let primary = false;
function getProps(_props: any) {
if (primary) {
- return { "class": "primary" };
+ return { 'class': 'primary' };
}
return {};
}
</script>
-<Link to="{to}" getProps="{getProps}">
+<Link {to} {getProps}>
<slot />
</Link>
diff --git a/src/Loading.svelte b/src/Loading.svelte
index c21ee51..8357122 100644
--- a/src/Loading.svelte
+++ b/src/Loading.svelte
@@ -1,6 +1,6 @@
<script lang="typescript">
export let small = false;
- export let color = "secondary";
+ export let color = 'secondary';
export let center = false;
export let fadeIn = false;
</script>
@@ -47,17 +47,26 @@
}
@-webkit-keyframes sk-bouncedelay {
- 0%, 80%, 100% { -webkit-transform: scale(0) }
- 40% { -webkit-transform: scale(1.0) }
+ 0%,
+ 80%,
+ 100% {
+ -webkit-transform: scale(0);
+ }
+ 40% {
+ -webkit-transform: scale(1);
+ }
}
@keyframes sk-bouncedelay {
- 0%, 80%, 100% {
+ 0%,
+ 80%,
+ 100% {
-webkit-transform: scale(0);
transform: scale(0);
- } 40% {
- -webkit-transform: scale(1.0);
- transform: scale(1.0);
+ }
+ 40% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
}
@@ -69,17 +78,25 @@
}
@keyframes fadeIn {
- 0% { opacity: 0 }
- 100% { opacity: 1 }
+ 0% {
+ opacity: 0;
+ }
+ 100% {
+ opacity: 1;
+ }
}
@-webkit-keyframes fadeIn {
- 0% { opacity: 0 }
- 100% { opacity: 1 }
+ 0% {
+ opacity: 0;
+ }
+ 100% {
+ opacity: 1;
+ }
}
</style>
<div class="spinner" class:fade-in={fadeIn} class:small class:center>
- <div class="bounce1" style="background-color: var(--color-{color})"></div>
- <div class="bounce2" style="background-color: var(--color-{color})"></div>
- <div class="bounce3" style="background-color: var(--color-{color})"></div>
+ <div class="bounce1" style="background-color: var(--color-{color})" />
+ <div class="bounce2" style="background-color: var(--color-{color})" />
+ <div class="bounce3" style="background-color: var(--color-{color})" />
</div>
diff --git a/src/Logo.svelte b/src/Logo.svelte
index cfc324c..b5b6f77 100644
--- a/src/Logo.svelte
+++ b/src/Logo.svelte
@@ -1,16 +1,33 @@
<script lang="typescript">
- export let style = "";
+ export let style = '';
</script>
<style>
</style>
-<svg {style} width="36" height="34" viewBox="0 0 36 34" fill="none" xmlns="http://www.w3.org/2000/svg">
- <path fill-rule="evenodd" clip-rule="evenodd" d="M18.5687 19.0417C18.8572 18.2253 19.1389 17.3905 19.4228 16.5491C21.8513 9.35112 24.4399 1.67842 32.8537 1.04244C33.2252 1.01436 33.608 0.999997 34.0027 1C33.8296 1.23078 33.6991 1.57621 33.5907 2.00565C33.4423 2.59325 33.3351 3.33814 33.2167 4.16182C32.9561 5.97456 32.6405 8.16891 31.7092 9.90809C29.8743 13.3345 24.8285 15.024 22.3056 14.4765C19.91 17.0735 19.3178 22.4338 19.6913 26.411C19.7597 27.1398 19.9076 27.8537 20.0495 28.5387C20.2456 29.4852 20.4302 30.3765 20.3779 31.1756C20.2485 33.6081 15.8912 33.6081 15.7618 31.1756C15.7095 30.3765 15.8941 29.4852 16.0902 28.5387C16.2321 27.8537 16.38 27.1398 16.4484 26.411C16.4675 26.2077 16.4867 26.0074 16.5057 25.8098C16.851 22.2059 17.1059 19.5453 14.9571 17.3278C14.7314 17.095 14.4792 16.867 14.1979 16.6433C14.0258 16.9617 13.8419 17.2404 13.65 17.4841C12.3774 19.0998 10.747 19.1773 9.79299 19.0722C7.61437 18.8321 6.17 17.0674 4.7655 15.3513C4.19335 14.6522 3.62781 13.9612 3.02196 13.3847C2.73293 13.1097 2.43473 12.8607 2.12225 12.6493C2.50137 12.4981 2.88393 12.3708 3.26863 12.2664C8.84538 10.7528 14.8744 14.0475 17.488 19.1056C17.7066 19.5286 17.9013 19.964 18.0699 20.4099C18.2394 19.9612 18.4052 19.5044 18.5687 19.0417ZM17.9276 17.8531C18.1082 17.3281 18.2871 16.7974 18.4681 16.2608C18.7688 15.3688 19.0751 14.4605 19.4034 13.5352C20.1931 11.3094 21.0827 9.07249 22.24 7.08373C23.3997 5.09089 24.849 3.31009 26.777 2.02993C28.7159 0.742458 31.0812 -2.21724e-05 34.0028 4.96602e-10L36 1.51401e-05L34.7986 1.60152C34.7172 1.71 34.5923 2.01783 34.4627 2.67346C34.3703 3.14034 34.2933 3.67532 34.2058 4.28372C34.1774 4.48175 34.1477 4.68756 34.1161 4.90133C33.8683 6.5769 33.5108 8.656 32.5867 10.3815C31.5278 12.359 29.5921 13.7639 27.6601 14.6007C25.9891 15.3244 24.1674 15.6886 22.7093 15.5483C21.8724 16.6529 21.2826 18.2584 20.9395 20.1091C20.5575 22.1692 20.504 24.4096 20.6831 26.3172C20.7459 26.9858 20.8806 27.6368 21.0222 28.3216C21.05 28.4558 21.078 28.5913 21.1058 28.7285C21.2666 29.5219 21.4262 30.3985 21.3724 31.2354C21.3203 32.1765 20.8453 32.8995 20.1952 33.3606C19.5677 33.8056 18.7957 34 18.0699 34C17.344 34 16.572 33.8056 15.9446 33.3606C15.2944 32.8995 14.8193 32.1764 14.7673 31.2353C14.7135 30.3984 14.8731 29.5219 15.0339 28.7285C15.0617 28.5913 15.0897 28.4558 15.1175 28.3216C15.2591 27.6368 15.3938 26.9858 15.4566 26.3172C15.475 26.1207 15.4933 25.9286 15.5113 25.7404C15.6955 23.8092 15.8394 22.3004 15.6535 20.9804C15.5062 19.9343 15.1504 19.0223 14.3789 18.1701C13.7456 18.9517 13.02 19.4494 12.2823 19.7434C11.2786 20.1434 10.3271 20.1371 9.68428 20.0662C7.5339 19.8293 6.04107 18.3873 4.8627 17.0257C4.56533 16.6821 4.2767 16.3294 3.9997 15.991L3.99119 15.9806C3.70843 15.6351 3.4379 15.3048 3.16528 14.9905C2.61589 14.3573 2.10048 13.8405 1.56544 13.4785L0 12.4195L1.75443 11.7199C7.89421 9.27172 14.7119 12.5328 17.9276 17.8531Z" fill="url(#paint0_radial)" fill-opacity="0.84"/>
+<svg
+ {style}
+ width="36"
+ height="34"
+ viewBox="0 0 36 34"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg">
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="M18.5687 19.0417C18.8572 18.2253 19.1389 17.3905 19.4228 16.5491C21.8513 9.35112 24.4399 1.67842 32.8537 1.04244C33.2252 1.01436 33.608 0.999997 34.0027 1C33.8296 1.23078 33.6991 1.57621 33.5907 2.00565C33.4423 2.59325 33.3351 3.33814 33.2167 4.16182C32.9561 5.97456 32.6405 8.16891 31.7092 9.90809C29.8743 13.3345 24.8285 15.024 22.3056 14.4765C19.91 17.0735 19.3178 22.4338 19.6913 26.411C19.7597 27.1398 19.9076 27.8537 20.0495 28.5387C20.2456 29.4852 20.4302 30.3765 20.3779 31.1756C20.2485 33.6081 15.8912 33.6081 15.7618 31.1756C15.7095 30.3765 15.8941 29.4852 16.0902 28.5387C16.2321 27.8537 16.38 27.1398 16.4484 26.411C16.4675 26.2077 16.4867 26.0074 16.5057 25.8098C16.851 22.2059 17.1059 19.5453 14.9571 17.3278C14.7314 17.095 14.4792 16.867 14.1979 16.6433C14.0258 16.9617 13.8419 17.2404 13.65 17.4841C12.3774 19.0998 10.747 19.1773 9.79299 19.0722C7.61437 18.8321 6.17 17.0674 4.7655 15.3513C4.19335 14.6522 3.62781 13.9612 3.02196 13.3847C2.73293 13.1097 2.43473 12.8607 2.12225 12.6493C2.50137 12.4981 2.88393 12.3708 3.26863 12.2664C8.84538 10.7528 14.8744 14.0475 17.488 19.1056C17.7066 19.5286 17.9013 19.964 18.0699 20.4099C18.2394 19.9612 18.4052 19.5044 18.5687 19.0417ZM17.9276 17.8531C18.1082 17.3281 18.2871 16.7974 18.4681 16.2608C18.7688 15.3688 19.0751 14.4605 19.4034 13.5352C20.1931 11.3094 21.0827 9.07249 22.24 7.08373C23.3997 5.09089 24.849 3.31009 26.777 2.02993C28.7159 0.742458 31.0812 -2.21724e-05 34.0028 4.96602e-10L36 1.51401e-05L34.7986 1.60152C34.7172 1.71 34.5923 2.01783 34.4627 2.67346C34.3703 3.14034 34.2933 3.67532 34.2058 4.28372C34.1774 4.48175 34.1477 4.68756 34.1161 4.90133C33.8683 6.5769 33.5108 8.656 32.5867 10.3815C31.5278 12.359 29.5921 13.7639 27.6601 14.6007C25.9891 15.3244 24.1674 15.6886 22.7093 15.5483C21.8724 16.6529 21.2826 18.2584 20.9395 20.1091C20.5575 22.1692 20.504 24.4096 20.6831 26.3172C20.7459 26.9858 20.8806 27.6368 21.0222 28.3216C21.05 28.4558 21.078 28.5913 21.1058 28.7285C21.2666 29.5219 21.4262 30.3985 21.3724 31.2354C21.3203 32.1765 20.8453 32.8995 20.1952 33.3606C19.5677 33.8056 18.7957 34 18.0699 34C17.344 34 16.572 33.8056 15.9446 33.3606C15.2944 32.8995 14.8193 32.1764 14.7673 31.2353C14.7135 30.3984 14.8731 29.5219 15.0339 28.7285C15.0617 28.5913 15.0897 28.4558 15.1175 28.3216C15.2591 27.6368 15.3938 26.9858 15.4566 26.3172C15.475 26.1207 15.4933 25.9286 15.5113 25.7404C15.6955 23.8092 15.8394 22.3004 15.6535 20.9804C15.5062 19.9343 15.1504 19.0223 14.3789 18.1701C13.7456 18.9517 13.02 19.4494 12.2823 19.7434C11.2786 20.1434 10.3271 20.1371 9.68428 20.0662C7.5339 19.8293 6.04107 18.3873 4.8627 17.0257C4.56533 16.6821 4.2767 16.3294 3.9997 15.991L3.99119 15.9806C3.70843 15.6351 3.4379 15.3048 3.16528 14.9905C2.61589 14.3573 2.10048 13.8405 1.56544 13.4785L0 12.4195L1.75443 11.7199C7.89421 9.27172 14.7119 12.5328 17.9276 17.8531Z"
+ fill="url(#paint0_radial)"
+ fill-opacity="0.84" />
<defs>
- <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(14.6116 21.5361) rotate(67.3618) scale(26.8971 26.8264)">
- <stop stop-color="#5555FF"/>
- <stop offset="1" stop-color="#FF55FF"/>
+ <radialGradient
+ id="paint0_radial"
+ cx="0"
+ cy="0"
+ r="1"
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="translate(14.6116 21.5361) rotate(67.3618) scale(26.8971 26.8264)">
+ <stop stop-color="#5555FF" />
+ <stop offset="1" stop-color="#FF55FF" />
</radialGradient>
</defs>
</svg>
diff --git a/src/Modal.svelte b/src/Modal.svelte
index 682740d..065bbe3 100644
--- a/src/Modal.svelte
+++ b/src/Modal.svelte
@@ -6,7 +6,8 @@
</script>
<style>
- .modal-floating, .modal-overlay {
+ .modal-floating,
+ .modal-overlay {
position: fixed;
top: 0;
left: 0;
@@ -22,7 +23,7 @@
}
.modal-overlay {
z-index: 200;
- background-color: rgba(0, 0, 0, .75);
+ background-color: rgba(0, 0, 0, 0.75);
}
.modal {
padding: 2rem 3rem;
@@ -36,16 +37,10 @@
.modal.modal-subtle {
border: none;
box-shadow: none;
- background: radial-gradient(
- var(--color-glow) 0%,
- transparent 70%
- );
+ background: radial-gradient(var(--color-glow) 0%, transparent 70%);
}
.modal.modal-subtle.error {
- background: radial-gradient(
- var(--color-glow-error) 0%,
- transparent 70%
- );
+ background: radial-gradient(var(--color-glow-error) 0%, transparent 70%);
}
.modal-title {
font-size: 1.25rem;
@@ -78,24 +73,28 @@
</style>
{#if floating}
- <div class="modal-overlay"></div>
+ <div class="modal-overlay" />
{/if}
<div class:modal-floating={floating}>
- <div class="modal" class:error class:modal-subtle={subtle} class:modal-small={small}>
+ <div
+ class="modal"
+ class:error
+ class:modal-subtle={subtle}
+ class:modal-small={small}>
<div class="modal-title">
- <slot name="title"></slot>
+ <slot name="title" />
</div>
<div class="modal-subtitle">
- <slot name="subtitle"></slot>
+ <slot name="subtitle" />
</div>
{#if $$slots.body && !small}
<div class="modal-body">
- <slot name="body"></slot>
+ <slot name="body" />
</div>
{/if}
<div class="modal-actions">
- <slot name="actions"></slot>
+ <slot name="actions" />
</div>
</div>
</div>
diff --git a/src/Options.svelte b/src/Options.svelte
index 658b1a1..cbf5f80 100644
--- a/src/Options.svelte
+++ b/src/Options.svelte
@@ -1,9 +1,9 @@
<script lang="typescript">
import { createEventDispatcher } from 'svelte';
- export let options: { label: string, value: string }[];
+ export let options: { label: string; value: string }[];
export let name: string;
- export let selected: string = "";
+ export let selected: string = '';
export let disabled = false;
const dispatch = createEventDispatcher();
@@ -26,7 +26,8 @@
.options label:last-child {
margin-bottom: 0.5rem;
}
- .options label, .options input {
+ .options label,
+ .options input {
cursor: pointer;
}
.options input {
@@ -38,10 +39,15 @@
<main>
<div class="options">
{#each options as option}
- <label for="{option.value}">
- <input type="radio" {disabled} checked={selected === option.value} {name}
- id="{option.value}" value="{option.value}"
- on:click={() => dispatch('changed', option.value)}>
+ <label for={option.value}>
+ <input
+ type="radio"
+ {disabled}
+ checked={selected === option.value}
+ {name}
+ id={option.value}
+ value={option.value}
+ on:click={() => dispatch('changed', option.value)} />
{option.label}
</label>
{/each}
diff --git a/src/base/home/Index.svelte b/src/base/home/Index.svelte
index ed0474e..50346ef 100644
--- a/src/base/home/Index.svelte
+++ b/src/base/home/Index.svelte
@@ -1,17 +1,17 @@
<script lang="typescript">
import { navigate } from 'svelte-routing';
- let input: string = "";
+ let input: string = '';
const search = () => {
- navigate(`/resolver/query?${
- new URLSearchParams({ q: input })
- }`);
+ navigate(`/resolver/query?${new URLSearchParams({ q: input })}`);
};
</script>
<main>
- <input size="40" type="text" bind:value={input} placeholder="Enter a name, address or domain..." />
- <button class="primary" on:click={search} disabled={!input}>
- Search
- </button>
+ <input
+ size="40"
+ type="text"
+ bind:value={input}
+ placeholder="Enter a name, address or domain..." />
+ <button class="primary" on:click={search} disabled={!input}> Search </button>
</main>
diff --git a/src/base/orgs/Create.svelte b/src/base/orgs/Create.svelte
index 3c29d93..8dd40b8 100644
--- a/src/base/orgs/Create.svelte
+++ b/src/base/orgs/Create.svelte
@@ -20,13 +20,13 @@
}
enum Governance {
- BDFL = "bdfl",
- Quorum = "quorum",
+ BDFL = 'bdfl',
+ Quorum = 'quorum',
}
const orgTypes = [
- { label: "Single signer", value: Governance.BDFL },
- { label: "Quorum", value: Governance.Quorum },
+ { label: 'Single signer', value: Governance.BDFL },
+ { label: 'Quorum', value: Governance.Quorum },
];
let state = State.Idle;
@@ -39,9 +39,10 @@
state = State.Signing;
try {
- let tx = governance === Governance.Quorum
- ? await Org.createMultiSig([owner], 1, config)
- : await Org.create(owner, config);
+ let tx =
+ governance === Governance.Quorum
+ ? await Org.createMultiSig([owner], 1, config)
+ : await Org.create(owner, config);
state = State.Pending;
@@ -58,19 +59,22 @@
const onGovernanceChanged = (event: { detail: string }) => {
switch (event.detail) {
- case "bdfl": governance = Governance.BDFL; break;
- case "quorum": governance = Governance.Quorum; break;
+ case 'bdfl':
+ governance = Governance.BDFL;
+ break;
+ case 'quorum':
+ governance = Governance.Quorum;
+ break;
}
};
</script>
{#if error}
<Error {error} floating on:close />
-{:else if org} <!-- Org created -->
+{:else if org}
+ <!-- Org created -->
<Modal floating on:close>
- <span slot="title">
- 🎉
- </span>
+ <span slot="title"> 🎉 </span>
<span slot="subtitle">
<strong>Your org was successfully created.</strong>
@@ -84,12 +88,11 @@
</span>
<span slot="actions">
- <button on:click={() => navigate(`/orgs/${org?.address}`)}>
- Done
- </button>
+ <button on:click={() => navigate(`/orgs/${org?.address}`)}> Done </button>
</span>
</Modal>
-{:else} <!-- Org creation flow -->
+{:else}
+ <!-- Org creation flow -->
<Modal floating on:close>
<span slot="title">
<div>🎪</div>
@@ -108,9 +111,12 @@
<span slot="body">
{#if state === State.Idle}
- <Options name="governance" disabled={state !== State.Idle}
- selected="{governance}" options={orgTypes}
- on:changed={onGovernanceChanged} />
+ <Options
+ name="governance"
+ disabled={state !== State.Idle}
+ selected={governance}
+ options={orgTypes}
+ on:changed={onGovernanceChanged} />
{:else}
<Loading center small />
{/if}
@@ -122,14 +128,11 @@
on:click={createOrg}
class="primary"
data-waiting={[State.Signing, State.Pending].includes(state) || null}
- disabled={state !== State.Idle}
- >
+ disabled={state !== State.Idle}>
Create
</button>
- <button on:click={() => dispatch('close')} class="text">
- Close
- </button>
+ <button on:click={() => dispatch('close')} class="text"> Close </button>
{/if}
</span>
</Modal>
diff --git a/src/base/orgs/Index.svelte b/src/base/orgs/Index.svelte
index cf99256..1cddd86 100644
--- a/src/base/orgs/Index.svelte
+++ b/src/base/orgs/Index.svelte
@@ -10,7 +10,7 @@
export let config: Config;
- const onCreate = () => modal = Create;
+ const onCreate = () => (modal = Create);
let modal: typeof SvelteComponent | null = null;
@@ -51,7 +51,10 @@
{:then orgs}
<header>
<span><strong>Orgs</strong> on the Radicle network.</span>
- <button class="create small secondary" on:click={onCreate} disabled={!account}>
+ <button
+ class="create small secondary"
+ on:click={onCreate}
+ disabled={!account}>
Create
</button>
</header>
@@ -65,4 +68,8 @@
{/await}
</main>
-<svelte:component this={modal} owner={account} {config} on:close={() => modal = null} />
+<svelte:component
+ this={modal}
+ owner={account}
+ {config}
+ on:close={() => (modal = null)} />
diff --git a/src/base/orgs/Org.ts b/src/base/orgs/Org.ts
index 96dd46a..38b5523 100644
--- a/src/base/orgs/Org.ts
+++ b/src/base/orgs/Org.ts
@@ -1,5 +1,8 @@
import * as ethers from 'ethers';
-import type { TransactionReceipt, TransactionResponse } from '@ethersproject/providers';
+import type {
+ TransactionReceipt,
+ TransactionResponse,
+} from '@ethersproject/providers';
import type { ContractReceipt } from '@ethersproject/contracts';
import { assert } from '@app/error';
import * as utils from '@app/utils';
@@ -29,11 +32,11 @@ const GetOrgs = `
`;
export class Org {
- address: string
- owner: string
+ address: string;
+ owner: string;
constructor(address: string, owner: string) {
- assert(ethers.utils.isAddress(address), "address must be valid");
+ assert(ethers.utils.isAddress(address), 'address must be valid');
this.address = address.toLowerCase(); // Don't store address checksum.
this.owner = owner;
@@ -51,11 +54,15 @@ export class Org {
config.abi.org,
config.signer
);
- return org.setName(name, config.provider.network.ensAddress,
- { gasLimit: 200_000 });
+ return org.setName(name, config.provider.network.ensAddress, {
+ gasLimit: 200_000,
+ });
}
- async setOwner(address: string, config: Config): Promise<TransactionResponse> {
+ async setOwner(
+ address: string,
+ config: Config
+ ): Promise<TransactionResponse> {
assert(config.signer);
const org = new ethers.Contract(
@@ -75,7 +82,11 @@ export class Org {
}
async getProjects(config: Config): Promise<Array<Project>> {
- const result = await utils.querySubgraph(GetProjects, { org: this.address }, config);
+ const result = await utils.querySubgraph(
+ GetProjects,
+ { org: this.address },
+ config
+ );
let projects: Project[] = [];
for (let p of result.projects) {
@@ -119,15 +130,8 @@ export class Org {
return null;
}
- static async get(
- address: string,
- config: Config,
- ): Promise<Org | null> {
- const org = new ethers.Contract(
- address,
- config.abi.org,
- config.provider
- );
+ static async get(address: string, config: Config): Promise<Org | null> {
+ const org = new ethers.Contract(address, config.abi.org, config.provider);
try {
const owner = await org.owner();
@@ -142,7 +146,7 @@ export class Org {
static async createMultiSig(
owners: [string],
threshold: number,
- config: Config,
+ config: Config
): Promise<TransactionResponse> {
assert(config.signer);
@@ -153,13 +157,13 @@ export class Org {
);
return orgFactory['createOrg(address[],uint256)'](owners, threshold, {
- gasLimit: config.gasLimits.createOrg
+ gasLimit: config.gasLimits.createOrg,
});
}
static async create(
owner: string,
- config: Config,
+ config: Config
): Promise<TransactionResponse> {
assert(config.signer);
@@ -170,7 +174,7 @@ export class Org {
);
return orgFactory['createOrg(address)'](owner, {
- gasLimit: config.gasLimits.createOrg
+ gasLimit: config.gasLimits.createOrg,
});
}
}
diff --git a/src/base/orgs/Routes.svelte b/src/base/orgs/Routes.svelte
index 02f596d..068382e 100644
--- a/src/base/orgs/Routes.svelte
+++ b/src/base/orgs/Routes.svelte
@@ -1,5 +1,5 @@
<script lang="typescript">
- import { Route } from "svelte-routing";
+ import { Route } from 'svelte-routing';
import Index from '@app/base/orgs/Index.svelte';
import View from '@app/base/orgs/View.svelte';
import type { Config } from '@app/config';
diff --git a/src/base/orgs/TransferOwnership.svelte b/src/base/orgs/TransferOwnership.svelte
index 4ebb182..611e7d2 100644
--- a/src/base/orgs/TransferOwnership.svelte
+++ b/src/base/orgs/TransferOwnership.svelte
@@ -38,7 +38,7 @@
const onSubmit = async () => {
assert(newOwner);
- if (! utils.isAddress(newOwner)) {
+ if (!utils.isAddress(newOwner)) {
state = State.Failed;
error = `"${newOwner}" is not a valid Ethereum address.`;
return;
@@ -60,9 +60,7 @@
{#if state === State.Success}
<Modal floating small>
- <div slot="title">
- ✅
- </div>
+ <div slot="title">✅</div>
<div slot="subtitle">
The ownership of <strong>{formatAddress(org.address)}</strong> was
@@ -70,9 +68,7 @@
</div>
<div slot="actions">
- <button class="small" on:click={() => dispatch('close')}>
- Done
- </button>
+ <button class="small" on:click={() => dispatch('close')}> Done </button>
</div>
</Modal>
{:else}
@@ -88,7 +84,8 @@
{:else if state == State.Pending}
Transaction is being processed by the network...
{:else if state == State.Idle}
- Transfer the ownership of Org <strong>{formatAddress(org.address)}</strong> to a new address.
+ Transfer the ownership of Org <strong
+ >{formatAddress(org.address)}</strong> to a new address.
{:else if state == State.Failed}
<div class="error">
{error}
@@ -98,7 +95,12 @@
<div slot="body">
{#if state == State.Idle}
- <input type="text" size="40" disabled={state !== State.Idle} bind:this={input} bind:value={newOwner} />
+ <input
+ type="text"
+ size="40"
+ disabled={state !== State.Idle}
+ bind:this={input}
+ bind:value={newOwner} />
{:else if state == State.Pending || state == State.Signing}
<Loading small center />
{:else if state == State.Failed}
@@ -116,11 +118,12 @@
Close
</button>
{:else if state == State.Failed}
- <button class="small" on:click={resetForm}>
- Back
- </button>
+ <button class="small" on:click={resetForm}> Back </button>
{:else}
- <button class="primary" on:click={onSubmit} disabled={!newOwner || state !== State.Idle}>
+ <button
+ class="primary"
+ on:click={onSubmit}
+ disabled={!newOwner || state !== State.Idle}>
Submit
</button>
diff --git a/src/base/orgs/View.svelte b/src/base/orgs/View.svelte
index e87e930..291ba06 100644
--- a/src/base/orgs/View.svelte
+++ b/src/base/orgs/View.svelte
@@ -160,7 +160,7 @@
<!-- Address -->
<div class="label">Address</div>
<div><Address {config} address={org.address} /></div>
- <div></div>
+ <div />
<!-- Owner -->
<div class="label">Owner</div>
<div><Address resolve {config} address={org.owner} /></div>
@@ -186,9 +186,7 @@
</div>
<div>
{#if isOwner(org)}
- <button class="tiny secondary" on:click={setName}>
- Set
- </button>
+ <button class="tiny secondary" on:click={setName}> Set </button>
{/if}
</div>
</div>
@@ -202,7 +200,10 @@
<div class="member-icon">
<Blockies {address} />
</div>
- <a href={explorerLink(address, config)} target="_blank" class="member">
+ <a
+ href={explorerLink(address, config)}
+ target="_blank"
+ class="member">
{utils.formatAddress(address)}
</a>
</div>
@@ -234,20 +235,27 @@
<p>Sorry, there is no Org at this address.</p>
{#if utils.isAddress(address)}
<p>
- <a href={explorerLink(address, config)} target="_blank">View in explorer</a>
+ <a href={explorerLink(address, config)} target="_blank"
+ >View in explorer</a>
<span class="faded">↗</span>
</p>
{/if}
</span>
<span slot="actions">
- <button on:click={back}>
- Back
- </button>
+ <button on:click={back}> Back </button>
</span>
</Modal>
{/if}
- <svelte:component this={setNameForm} {org} {config} on:close={() => setNameForm = null} />
- <svelte:component this={transferOwnerForm} {org} {config} on:close={() => transferOwnerForm = null} />
+ <svelte:component
+ this={setNameForm}
+ {org}
+ {config}
+ on:close={() => (setNameForm = null)} />
+ <svelte:component
+ this={transferOwnerForm}
+ {org}
+ {config}
+ on:close={() => (transferOwnerForm = null)} />
{:catch err}
<Error error={err} />
{/await}
diff --git a/src/base/projects/Project.ts b/src/base/projects/Project.ts
index 03ed14f..ee13827 100644
--- a/src/base/projects/Project.ts
+++ b/src/base/projects/Project.ts
@@ -1,33 +1,36 @@
import type { Config } from '@app/config';
export interface Project {
- id: string
+ id: string;
anchor: {
- stateHash: string
- stateHashFormat: string
- }
+ stateHash: string;
+ stateHashFormat: string;
+ };
}
export interface User {
- urn: string
- avatar: { emoji: string, background: { r: number, g: number, b: number } }
+ urn: string;
+ avatar: { emoji: string; background: { r: number; g: number; b: number } };
}
export interface Meta {
- name: string
- description: string
- maintainers: User[]
+ name: string;
+ description: string;
+ maintainers: User[];
}
-export async function getMetadata(urn: string, config: Config): Promise<Meta | null> {
+export async function getMetadata(
+ urn: string,
+ config: Config
+): Promise<Meta | null> {
const response = await fetch(`${config.seed.url}/projects/${urn}`, {
method: 'GET',
headers: {
'Accept': 'application/json',
- }
+ },
});
- if (! response.ok) {
+ if (!response.ok) {
return null;
}
diff --git a/src/base/projects/Widget.svelte b/src/base/projects/Widget.svelte
index 0c5208e..99dfa34 100644
--- a/src/base/projects/Widget.svelte
+++ b/src/base/projects/Widget.svelte
@@ -7,12 +7,16 @@
import { getMetadata } from './Project';
import type { Project, Meta } from './Project';
- enum Status { Loading, Loaded, Error }
+ enum Status {
+ Loading,
+ Loaded,
+ Error,
+ }
type State =
- { status: Status.Loading }
+ | { status: Status.Loading }
| { status: Status.Loaded }
- | { status: Status.Error, error: string };
+ | { status: Status.Error; error: string };
export let project: Project;
export let config: Config;
@@ -50,7 +54,8 @@
font-size: 0.75rem;
font-family: var(--font-family-monospace);
}
- article .id, article .anchor {
+ article .id,
+ article .anchor {
display: flex;
justify-content: space-between;
}
diff --git a/src/base/registrations/Index.svelte b/src/base/registrations/Index.svelte
index 2eac05a..dbce64d 100644
--- a/src/base/registrations/Index.svelte
+++ b/src/base/registrations/Index.svelte
@@ -1,5 +1,5 @@
<script lang="typescript">
- import { navigate } from "svelte-routing";
+ import { navigate } from 'svelte-routing';
import type { Config } from '@app/config';
import DomainInput from '@app/ens/DomainInput.svelte';
@@ -47,8 +47,7 @@
bind:value={label}
autofocus
placeholder=""
- root={config.registrar.domain}
- />
+ root={config.registrar.domain} />
</span>
<button disabled={!label} class="primary register" on:click={register}>
diff --git a/src/base/registrations/New.svelte b/src/base/registrations/New.svelte
index 3f35354..8de30af 100644
--- a/src/base/registrations/New.svelte
+++ b/src/base/registrations/New.svelte
@@ -25,9 +25,13 @@
$: registrationOwner = owner || ($session && $session.address);
function begin() {
- navigate(`/registrations/${subdomain}/submit?${
- registrationOwner ? new URLSearchParams({ owner: registrationOwner }) : ''
- }`);
+ navigate(
+ `/registrations/${subdomain}/submit?${
+ registrationOwner
+ ? new URLSearchParams({ owner: registrationOwner })
+ : ''
+ }`
+ );
}
onMount(async () => {
@@ -47,8 +51,9 @@
<span slot="body">
{#if state === State.NameAvailable}
{#if registrationOwner}
- The name <span class="highlight">{subdomain}</span> is available for registration
- under account <span class="highlight">{formatAddress(registrationOwner)}</span>.
+ The name <span class="highlight">{subdomain}</span> is available for
+ registration under account
+ <span class="highlight">{formatAddress(registrationOwner)}</span>.
{:else}
The name <span class="highlight">{subdomain}</span> is available for registration.
{/if}
@@ -69,11 +74,11 @@
<Connect caption="Connect to register" className="primary" {config} />
{/if}
- <button on:click={() => navigate("/registrations")} class="text">
+ <button on:click={() => navigate('/registrations')} class="text">
Cancel
</button>
{:else if state === State.NameUnavailable}
- <button on:click={() => navigate("/registrations")} class="">
+ <button on:click={() => navigate('/registrations')} class="">
Back
</button>
{/if}
diff --git a/src/base/registrations/Routes.svelte b/src/base/registrations/Routes.svelte
index 654af94..75f56b1 100644
--- a/src/base/registrations/Routes.svelte
+++ b/src/base/registrations/Routes.svelte
@@ -1,5 +1,5 @@
<script lang="typescript">
- import { Route, navigate } from "svelte-routing";
+ import { Route, navigate } from 'svelte-routing';
import Index from '@app/base/registrations/Index.svelte';
import New from '@app/base/registrations/New.svelte';
import Submit from '@app/base/registrations/Submit.svelte';
@@ -18,17 +18,23 @@
</Route>
<Route path="registrations/:name/form" let:params let:location>
- <New {config} subdomain={params.name} owner={getSearchParam("owner", location)} />
+ <New
+ {config}
+ subdomain={params.name}
+ owner={getSearchParam('owner', location)} />
</Route>
<Route path="registrations/:name/submit" let:params let:location>
{#if session}
- <Submit {config} subdomain={params.name} owner={getSearchParam("owner", location)} {session} />
+ <Submit
+ {config}
+ subdomain={params.name}
+ owner={getSearchParam('owner', location)}
+ {session} />
{:else}
<Error
- message={"You must connect your wallet to register"}
- on:close={() => navigate("/registrations")}
- />
+ message={'You must connect your wallet to register'}
+ on:close={() => navigate('/registrations')} />
{/if}
</Route>
diff --git a/src/base/registrations/Submit.svelte b/src/base/registrations/Submit.svelte
index 03fc20e..6b5d0c9 100644
--- a/src/base/registrations/Submit.svelte
+++ b/src/base/registrations/Submit.svelte
@@ -19,13 +19,13 @@
let error: Error | null = null;
let registrationOwner = owner || session.address;
- const view = () => navigate(`/registrations/${subdomain}`)
+ const view = () => navigate(`/registrations/${subdomain}`);
onMount(async () => {
try {
await registerName(subdomain, registrationOwner, config);
} catch (e) {
- console.error("Error", e);
+ console.error('Error', e);
state.set(State.Failed);
error = e;
@@ -39,8 +39,7 @@
<Err
title="Transaction failed"
message={error.message}
- on:close={() => navigate('/registrations')}
- />
+ on:close={() => navigate('/registrations')} />
{:else}
<Modal>
<span slot="title">
@@ -73,9 +72,7 @@
<span slot="actions">
{#if $state === State.Registered}
- <button on:click={view} class="register">
- View
- </button>
+ <button on:click={view} class="register"> View </button>
{/if}
</span>
</Modal>
diff --git a/src/base/registrations/Update.svelte b/src/base/registrations/Update.svelte
index b5cceb0..850de33 100644
--- a/src/base/registrations/Update.svelte
+++ b/src/base/registrations/Update.svelte
@@ -15,10 +15,10 @@
}
type State =
- { status: Status.Signing }
+ | { status: Status.Signing }
| { status: Status.Pending }
| { status: Status.Success }
- | { status: Status.Failed, error: string };
+ | { status: Status.Failed; error: string };
export let subdomain: string;
export let config: Config;
@@ -28,12 +28,20 @@
const dispatch = createEventDispatcher();
/* let state: State = { status: Status.Signing }; */
- let state: State = { status: Status.Failed, error: "Error registering, something happened." };
+ let state: State = {
+ status: Status.Failed,
+ error: 'Error registering, something happened.',
+ };
onMount(async () => {
try {
state.status = Status.Signing;
- const tx = await setRecords(subdomain, records, registration.resolver, config);
+ const tx = await setRecords(
+ subdomain,
+ records,
+ registration.resolver,
+ config
+ );
state.status = Status.Pending;
await tx.wait();
state.status = Status.Success;
@@ -67,7 +75,8 @@
<p>Your registration was successfully updated.</p>
{:else if state.status === Status.Failed}
<p class="error">
- <strong>Error:</strong> {state.error}
+ <strong>Error:</strong>
+ {state.error}
</p>
{/if}
</span>
@@ -75,13 +84,9 @@
{#if [Status.Signing, Status.Pending].includes(state.status)}
<Loading center small />
{:else if state.status === Status.Success}
- <button on:click={onDone}>
- Done
- </button>
+ <button on:click={onDone}> Done </button>
{:else if state.status === Status.Failed}
- <button on:click={onClose}>
- Close
- </button>
+ <button on:click={onClose}> Close </button>
{/if}
</span>
</Modal>
diff --git a/src/base/registrations/View.svelte b/src/base/registrations/View.svelte
index 6d8d155..4db8d6a 100644
--- a/src/base/registrations/View.svelte
+++ b/src/base/registrations/View.svelte
@@ -24,10 +24,10 @@
}
type State =
- { status: Status.Loading }
+ | { status: Status.Loading }
| { status: Status.NotFound }
- | { status: Status.Found, registration: Registration }
- | { status: Status.Failed, error: string };
+ | { status: Status.Found; registration: Registration }
+ | { status: Status.Failed; error: string };
export let subdomain: string;
export let config: Config;
@@ -43,37 +43,58 @@
.then(r => {
if (r) {
fields = [
- { name: "owner", placeholder: "",
- value: r.owner, editable: false },
- { name: "address", placeholder: "Not set",
- value: r.address, editable: true },
- { name: "url", label: "URL", placeholder: "Not set",
- value: r.url, editable: true },
- { name: "avatar", placeholder: "Not set",
- value: r.avatar, editable: true },
- { name: "twitter", placeholder: "Not set",
- value: r.twitter, editable: true },
- { name: "github", placeholder: "Not set",
- value: r.github, editable: true },
+ { name: 'owner', placeholder: '', value: r.owner, editable: false },
+ {
+ name: 'address',
+ placeholder: 'Not set',
+ value: r.address,
+ editable: true,
+ },
+ {
+ name: 'url',
+ label: 'URL',
+ placeholder: 'Not set',
+ value: r.url,
+ editable: true,
+ },
+ {
+ name: 'avatar',
+ placeholder: 'Not set',
+ value: r.avatar,
+ editable: true,
+ },
+ {
+ name: 'twitter',
+ placeholder: 'Not set',
+ value: r.twitter,
+ editable: true,
+ },
+ {
+ name: 'github',
+ placeholder: 'Not set',
+ value: r.github,
+ editable: true,
+ },
];
state = { status: Status.Found, registration: r };
} else {
state = { status: Status.NotFound };
}
return r;
- }).catch(err => {
+ })
+ .catch(err => {
state = { status: Status.Failed, error: err };
});
- });
+ });
const onSave = async (event: { detail: Field[] }) => {
- assert(state.status === Status.Found, "registration must be found");
+ assert(state.status === Status.Found, 'registration must be found');
updateRecords = event.detail
.filter(r => r.editable && r.value !== null)
.map(f => {
assert(f.value !== null);
- return { name: f.name, value: f.value }
+ return { name: f.name, value: f.value };
});
};
@@ -97,7 +118,9 @@
{#if state.status === Status.Loading}
<Loading />
{:else if state.status === Status.Failed}
- <Error title="Registration could not be loaded" on:close={() => navigate('/registrations')}>
+ <Error
+ title="Registration could not be loaded"
+ on:close={() => navigate('/registrations')}>
{state.error}
</Error>
{:else if state.status === Status.NotFound}
@@ -111,7 +134,8 @@
</span>
<span slot="actions">
- <Link to={`/registrations/${subdomain}/form`} primary>Register &rarr;</Link>
+ <Link to={`/registrations/${subdomain}/form`} primary
+ >Register &rarr;</Link>
</span>
</Modal>
{:else if state.status === Status.Found}
@@ -119,19 +143,28 @@
<header>
<h1 class="bold">{subdomain}.{config.registrar.domain}</h1>
<button
- class="tiny primary" class:active={editable} disabled={!isOwner(state.registration)}
- on:click={() => editable = !editable}>
- Edit
- </button>
- <button class="tiny secondary" disabled>
- Transfer
+ class="tiny primary"
+ class:active={editable}
+ disabled={!isOwner(state.registration)}
+ on:click={() => (editable = !editable)}>
+ Edit
</button>
+ <button class="tiny secondary" disabled> Transfer </button>
</header>
- <Form {config} {editable} {fields} on:save={onSave} on:cancel={() => editable = false} />
+ <Form
+ {config}
+ {editable}
+ {fields}
+ on:save={onSave}
+ on:cancel={() => (editable = false)} />
</main>
{#if updateRecords}
- <Update {config} {subdomain} on:close={() => updateRecords = null}
- registration={state.registration} records={updateRecords} />
+ <Update
+ {config}
+ {subdomain}
+ on:close={() => (updateRecords = null)}
+ registration={state.registration}
+ records={updateRecords} />
{/if}
{/if}
diff --git a/src/base/registrations/registrar.ts b/src/base/registrations/registrar.ts
index f0cd08f..ed0109f 100644
--- a/src/base/registrations/registrar.ts
+++ b/src/base/registrations/registrar.ts
@@ -11,14 +11,14 @@ import { unixTime } from '@app/utils';
import { assert } from '@app/error';
export interface Registration {
- name: string
- owner: string
- address: string | null
- url: string | null
- avatar: string | null
- twitter: string | null
- github: string | null
- resolver: EnsResolver
+ name: string;
+ owner: string;
+ address: string | null;
+ url: string | null;
+ avatar: string | null;
+ twitter: string | null;
+ github: string | null;
+ resolver: EnsResolver;
}
export enum State {
@@ -35,12 +35,15 @@ export const state = writable(State.Connecting);
window.registrarState = state;
state.subscribe((s: State) => {
- console.log("regiter.state", s);
+ console.log('regiter.state', s);
});
-export async function getRegistration(name: string, config: Config): Promise<Registration | null> {
+export async function getRegistration(
+ name: string,
+ config: Config
+): Promise<Registration | null> {
const resolver = await config.provider.getResolver(name);
- if (! resolver) {
+ if (!resolver) {
return null;
}
@@ -64,17 +67,25 @@ export async function getRegistration(name: string, config: Config): Promise<Reg
}
export function registrar(config: Config) {
- return new ethers.Contract(config.registrar.address, config.abi.registrar, config.provider);
+ return new ethers.Contract(
+ config.registrar.address,
+ config.abi.registrar,
+ config.provider
+ );
}
export async function registrationFee(config: Config) {
return await registrar(config).registrationFeeRad();
}
-export async function registerName(name: string, owner: string, config: Config) {
+export async function registerName(
+ name: string,
+ owner: string,
+ config: Config
+) {
assert(config.signer);
- if (! name) return;
+ if (!name) return;
let commitmentJson = window.localStorage.getItem('commitment');
let commitment = commitmentJson && JSON.parse(commitmentJson);
@@ -87,7 +98,11 @@ export async function registerName(name: string, owner: string, config: Config)
await commitAndRegister(name, owner, config);
}
} catch (e) {
- throw { type: Failure.TransactionFailed, message: e.message, txHash: e.txHash };
+ throw {
+ type: Failure.TransactionFailed,
+ message: e.message,
+ txHash: e.txHash,
+ };
}
}
@@ -99,16 +114,24 @@ async function commitAndRegister(name: string, owner: string, config: Config) {
await commit(makeCommitment(name, owner, salt), fee, minAge, config);
// Save commitment in local storage in case the user refreshes or closes
// the page.
- window.localStorage.setItem('commitment', JSON.stringify({
- name: name,
- owner: owner,
- salt: ethers.utils.hexlify(salt)
- }));
+ window.localStorage.setItem(
+ 'commitment',
+ JSON.stringify({
+ name: name,
+ owner: owner,
+ salt: ethers.utils.hexlify(salt),
+ })
+ );
await register(name, owner, salt, config);
}
-async function commit(commitment: string, fee: BigNumber, minAge: number, config: Config) {
+async function commit(
+ commitment: string,
+ fee: BigNumber,
+ minAge: number,
+ config: Config
+) {
assert(config.signer);
state.set(State.Committing);
@@ -129,7 +152,8 @@ async function commit(commitment: string, fee: BigNumber, minAge: number, config
signature.v,
signature.r,
signature.s,
- { gasLimit: 150000 })
+ { gasLimit: 150000 }
+ )
.catch((e: Error) => console.error(e));
await tx.wait(1);
@@ -144,7 +168,7 @@ async function permitSignature(
token: ethers.Contract,
spenderAddr: string,
value: ethers.BigNumberish,
- deadline: ethers.BigNumberish,
+ deadline: ethers.BigNumberish
): Promise<ethers.Signature> {
assert(owner.provider);
@@ -159,33 +183,38 @@ async function permitSignature(
};
const types = {
Permit: [
- { "name": "owner", "type": "address" },
- { "name": "spender", "type": "address" },
- { "name": "value", "type": "uint256" },
- { "name": "nonce", "type": "uint256" },
- { "name": "deadline", "type": "uint256" }
- ]
+ { 'name': 'owner', 'type': 'address' },
+ { 'name': 'spender', 'type': 'address' },
+ { 'name': 'value', 'type': 'uint256' },
+ { 'name': 'nonce', 'type': 'uint256' },
+ { 'name': 'deadline', 'type': 'uint256' },
+ ],
};
const values = {
- "owner": ownerAddr,
- "spender": spenderAddr,
- "value": value,
- "nonce": nonce,
- "deadline": deadline
+ 'owner': ownerAddr,
+ 'spender': spenderAddr,
+ 'value': value,
+ 'nonce': nonce,
+ 'deadline': deadline,
};
const sig = await owner._signTypedData(domain, types, values);
return ethers.utils.splitSignature(sig);
}
-async function register(name: string, owner: string, salt: Uint8Array, config: Config) {
+async function register(
+ name: string,
+ owner: string,
+ salt: Uint8Array,
+ config: Config
+) {
assert(config.signer);
state.set(State.Registering);
- const tx = await registrar(config).connect(config.signer).register(
- name, owner, ethers.BigNumber.from(salt), { gasLimit: 150000 }
- );
- console.log("Sent", tx);
+ const tx = await registrar(config)
+ .connect(config.signer)
+ .register(name, owner, ethers.BigNumber.from(salt), { gasLimit: 150000 });
+ console.log('Sent', tx);
await tx.wait();
window.localStorage.clear();
@@ -203,8 +232,8 @@ function makeCommitment(name: string, owner: string, salt: Uint8Array): string {
async function getOwner(name: string, config: Config): Promise<string> {
let ensAddr = config.provider.network.ensAddress;
- if (! ensAddr) {
- throw new Error("ENS address is not defined");
+ if (!ensAddr) {
+ throw new Error('ENS address is not defined');
}
let registry = new ethers.Contract(ensAddr, config.abi.ens, config.provider);
diff --git a/src/base/registrations/resolver.ts b/src/base/registrations/resolver.ts
index 99add0e..fc963e5 100644
--- a/src/base/registrations/resolver.ts
+++ b/src/base/registrations/resolver.ts
@@ -4,12 +4,21 @@ import { ethers } from 'ethers';
import type { Config } from '@app/config';
import { assert } from '@app/error';
-export type EnsRecord = { name: string, value: string };
+export type EnsRecord = { name: string; value: string };
-export async function setRecords(name: string, records: EnsRecord[], resolver: EnsResolver, config: Config): Promise<TransactionResponse> {
+export async function setRecords(
+ name: string,
+ records: EnsRecord[],
+ resolver: EnsResolver,
+ config: Config
+): Promise<TransactionResponse> {
assert(config.signer);
- const resolverContract = new ethers.Contract(resolver.address, config.abi.resolver, config.signer);
+ const resolverContract = new ethers.Contract(
+ resolver.address,
+ config.abi.resolver,
+ config.signer
+ );
const node = ethers.utils.namehash(`${name}.${config.registrar.domain}`);
let calls = [];
@@ -17,21 +26,19 @@ export async function setRecords(name: string, records: EnsRecord[], resolver: E
for (let r of records) {
switch (r.name) {
- case "address":
- calls.push(
- iface.encodeFunctionData("setAddr", [node, r.value])
- );
+ case 'address':
+ calls.push(iface.encodeFunctionData('setAddr', [node, r.value]));
break;
- case "url":
- case "avatar":
+ case 'url':
+ case 'avatar':
calls.push(
- iface.encodeFunctionData("setText", [node, r.name, r.value])
+ iface.encodeFunctionData('setText', [node, r.name, r.value])
);
break;
- case "github":
- case "twitter":
+ case 'github':
+ case 'twitter':
calls.push(
- iface.encodeFunctionData("setText", [node, "vnd." + r.name, r.value])
+ iface.encodeFunctionData('setText', [node, 'vnd.' + r.name, r.value])
);
break;
default:
diff --git a/src/base/resolver/Query.svelte b/src/base/resolver/Query.svelte
index 6f9ce15..bc6d916 100644
--- a/src/base/resolver/Query.svelte
+++ b/src/base/resolver/Query.svelte
@@ -18,16 +18,20 @@
navigate(`/orgs/${query}`, { replace: true });
} else if (utils.isRadicleId(query)) {
// Go to Radicle entity.
- alert("Radicle IDs are not yet supported");
+ alert('Radicle IDs are not yet supported');
} else {
let label = utils.parseEnsLabel(query, config);
- if (label.includes(".")) {
+ if (label.includes('.')) {
error = true;
} else {
// Jump straight to org, if the ENS entry points to an org. Otherwise just go to the
// registration.
const address = await utils.resolveLabel(label, config);
- if (address && await utils.identifyAddress(address, config) === utils.AddressType.Org) {
+ if (
+ address &&
+ (await utils.identifyAddress(address, config)) ===
+ utils.AddressType.Org
+ ) {
navigate(`/orgs/${address}`, { replace: true });
} else {
navigate(`/registrations/${label}`, { replace: true });
diff --git a/src/base/resolver/Routes.svelte b/src/base/resolver/Routes.svelte
index 38c6651..f21b0de 100644
--- a/src/base/resolver/Routes.svelte
+++ b/src/base/resolver/Routes.svelte
@@ -1,5 +1,5 @@
<script lang="typescript">
- import { Route } from "svelte-routing";
+ import { Route } from 'svelte-routing';
import Resolve from '@app/base/resolver/Query.svelte';
import type { Config } from '@app/config';
import * as utils from '@app/utils';
@@ -8,5 +8,5 @@
</script>
<Route path="/resolver/query" let:location>
- <Resolve {config} query={utils.getSearchParam("q", location)} />
+ <Resolve {config} query={utils.getSearchParam('q', location)} />
</Route>
diff --git a/src/base/vesting/Index.svelte b/src/base/vesting/Index.svelte
index bf0d6ed..d29cc59 100644
--- a/src/base/vesting/Index.svelte
+++ b/src/base/vesting/Index.svelte
@@ -17,7 +17,7 @@
export let config: Config;
export let session: Session | null;
- let contractAddress = "";
+ let contractAddress = '';
let info: VestingInfo | null = null;
async function loadContract(config: Config) {
@@ -31,7 +31,7 @@
state.set(State.Idle);
}
- $: isBeneficiary = info && session && (info.beneficiary === session.address);
+ $: isBeneficiary = info && session && info.beneficiary === session.address;
</script>
<style>
@@ -63,10 +63,21 @@
Tokens successfully withdrawn to {formatAddress(info.beneficiary)}.
{:else}
<table>
- <tr><td class="label">Beneficiary</td><td>{info.beneficiary}</td></tr>
- <tr><td class="label">Allocation</td><td>{info.totalVesting} <strong>{info.symbol}</strong></td></tr>
- <tr><td class="label">Withdrawn</td><td>{info.withdrawn} <strong>{info.symbol}</strong></td></tr>
- <tr><td class="label">Withdrawable</td><td>{info.withdrawableBalance} <strong>{info.symbol}</strong></td></tr>
+ <tr
+ ><td class="label">Beneficiary</td><td>{info.beneficiary}</td
+ ></tr>
+ <tr
+ ><td class="label">Allocation</td><td
+ >{info.totalVesting} <strong>{info.symbol}</strong></td
+ ></tr>
+ <tr
+ ><td class="label">Withdrawn</td><td
+ >{info.withdrawn} <strong>{info.symbol}</strong></td
+ ></tr>
+ <tr
+ ><td class="label">Withdrawable</td><td
+ >{info.withdrawableBalance} <strong>{info.symbol}</strong></td
+ ></tr>
</table>
{/if}
</span>
@@ -81,14 +92,14 @@
Withdrawing...
</button>
{:else if $state === State.Idle}
- <button on:click={() => withdrawVested(contractAddress, config)} class="primary small">
+ <button
+ on:click={() => withdrawVested(contractAddress, config)}
+ class="primary small">
Withdraw
</button>
{/if}
{/if}
- <button on:click={reset} class="small">
- Back
- </button>
+ <button on:click={reset} class="small"> Back </button>
</span>
</Modal>
{:else}
@@ -105,16 +116,14 @@
disabled={$state === State.Loading}
type="text"
bind:this={input}
- bind:value={contractAddress}
- />
+ bind:value={contractAddress} />
</div>
</span>
<button
on:click={() => loadContract(config)}
class="primary"
data-waiting={$state === State.Loading || null}
- disabled={$state === State.Loading}
- >
+ disabled={$state === State.Loading}>
Load
</button>
</div>
diff --git a/src/base/vesting/state.ts b/src/base/vesting/state.ts
index 1dde8db..60c9ceb 100644
--- a/src/base/vesting/state.ts
+++ b/src/base/vesting/state.ts
@@ -1,4 +1,4 @@
-import { derived, writable } from "svelte/store";
+import { derived, writable } from 'svelte/store';
export enum State {
Error = -1,
@@ -9,10 +9,10 @@ export enum State {
WithdrawingSign = 4,
Withdrawing = 5,
Withdrawn = 6,
-};
+}
export const state = writable(State.Idle);
state.subscribe(s => {
- console.log("State", s);
+ console.log('State', s);
});
diff --git a/src/base/vesting/vesting.ts b/src/base/vesting/vesting.ts
index 10ac1dd..a315c4c 100644
--- a/src/base/vesting/vesting.ts
+++ b/src/base/vesting/vesting.ts
@@ -1,21 +1,24 @@
-import { ethers } from "ethers";
-import { formatBalance } from "@app/utils";
-import * as session from "@app/session";
-import { State, state } from "./state";
-import type { Config } from "@app/config";
-
+import { ethers } from 'ethers';
+import { formatBalance } from '@app/utils';
+import * as session from '@app/session';
+import { State, state } from './state';
+import type { Config } from '@app/config';
export interface VestingInfo {
- token: string,
- symbol: string,
- beneficiary: string,
- totalVesting: string,
- withdrawableBalance: string,
- withdrawn: string
+ token: string;
+ symbol: string;
+ beneficiary: string;
+ totalVesting: string;
+ withdrawableBalance: string;
+ withdrawn: string;
}
export async function withdrawVested(address: string, config: Config) {
- const contract = new ethers.Contract(address, config.abi.vesting, config.provider);
+ const contract = new ethers.Contract(
+ address,
+ config.abi.vesting,
+ config.provider
+ );
const signer = config.provider.getSigner();
state.set(State.WithdrawingSign);
@@ -28,8 +31,15 @@ export async function withdrawVested(address: string, config: Config) {
state.set(State.Withdrawn);
}
-export async function getInfo(address: string, config: Config): Promise<VestingInfo> {
- const contract = new ethers.Contract(address, config.abi.vesting, config.provider);
+export async function getInfo(
+ address: string,
+ config: Config
+): Promise<VestingInfo> {
+ const contract = new ethers.Contract(
+ address,
+ config.abi.vesting,
+ config.provider
+ );
const signer = config.provider.getSigner();
const token = await contract.token();
@@ -38,7 +48,11 @@ export async function getInfo(address: string, config: Config): Promise<VestingI
const withdrawn = await contract.withdrawn();
const total = await contract.totalVestingAmount();
- const tokenContract = new ethers.Contract(token, config.abi.token, config.provider);
+ const tokenContract = new ethers.Contract(
+ token,
+ config.abi.token,
+ config.provider
+ );
const symbol = await tokenContract.symbol();
return {
@@ -50,4 +64,3 @@ export async function getInfo(address: string, config: Config): Promise<VestingI
withdrawn: formatBalance(withdrawn),
};
}
-
diff --git a/src/blockies.ts b/src/blockies.ts
index a103939..121028c 100644
--- a/src/blockies.ts
+++ b/src/blockies.ts
@@ -1,7 +1,7 @@
// Copyright (c) 2019, Ethereum Name Service
// The random number is a js implementation of the Xorshift PRNG
-let randseed = new Array(4) // Xorshift: [x, y, z, w] 32 bit values
+let randseed = new Array(4); // Xorshift: [x, y, z, w] 32 bit values
function seedrand(seed: string) {
for (let i = 0; i < randseed.length; i++) {
@@ -15,14 +15,14 @@ function seedrand(seed: string) {
function rand(): number {
// Based on Java's String.hashCode(), expanded to 4 32bit values.
- let t = randseed[0] ^ (randseed[0] << 11)
+ let t = randseed[0] ^ (randseed[0] << 11);
- randseed[0] = randseed[1]
- randseed[1] = randseed[2]
- randseed[2] = randseed[3]
- randseed[3] = randseed[3] ^ (randseed[3] >> 19) ^ t ^ (t >> 8)
+ randseed[0] = randseed[1];
+ randseed[1] = randseed[2];
+ randseed[2] = randseed[3];
+ randseed[3] = randseed[3] ^ (randseed[3] >> 19) ^ t ^ (t >> 8);
- return (randseed[3] >>> 0) / ((1 << 31) >>> 0)
+ return (randseed[3] >>> 0) / ((1 << 31) >>> 0);
}
function createColor(): string {
@@ -76,7 +76,7 @@ function createCanvas(
let cc = c.getContext('2d');
- if (! cc) throw new Error("Can't get 2D context");
+ if (!cc) throw new Error("Can't get 2D context");
cc.fillStyle = bgcolor;
cc.fillRect(0, 0, c.width, c.height);
@@ -98,12 +98,12 @@ function createCanvas(
}
export interface Options {
- seed: string
- size: number
- scale: number
- color?: string
- bgcolor?: string
- spotcolor?: string
+ seed: string;
+ size: number;
+ scale: number;
+ color?: string;
+ bgcolor?: string;
+ spotcolor?: string;
}
export function createIcon(opts: Options) {
diff --git a/src/config.ts b/src/config.ts
index aa7748c..541321e 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -1,6 +1,6 @@
-import { ethers } from "ethers";
+import { ethers } from 'ethers';
import type { TypedDataSigner } from '@ethersproject/abstract-signer';
-import config from "@app/config.json";
+import config from '@app/config.json';
declare global {
interface Window {
@@ -10,32 +10,32 @@ declare global {
interface ImportMeta {
env: {
- RADICLE_ALCHEMY_API_KEY: string | null,
- }
+ RADICLE_ALCHEMY_API_KEY: string | null;
+ };
}
}
export class Config {
- network: { name: string, chainId: number };
- registrar: { address: string, domain: string };
+ network: { name: string; chainId: number };
+ registrar: { address: string; domain: string };
radToken: { address: string };
orgFactory: { address: string };
- orgs: { subgraph: string, contractHash: string };
+ orgs: { subgraph: string; contractHash: string };
gasLimits: { createOrg: number };
provider: ethers.providers.JsonRpcProvider;
- signer: ethers.Signer & TypedDataSigner | null;
+ signer: (ethers.Signer & TypedDataSigner) | null;
seed: { url: string };
- safe: { api: string | null, viewer: string | null };
- abi: { [contract: string]: string[] }
+ safe: { api: string | null; viewer: string | null };
+ abi: { [contract: string]: string[] };
tokens: string[];
constructor(
- network: { name: string, chainId: number },
+ network: { name: string; chainId: number },
provider: ethers.providers.JsonRpcProvider,
- signer: ethers.Signer & TypedDataSigner | null,
+ signer: (ethers.Signer & TypedDataSigner) | null
) {
- let cfg = (<Record<string, any>> config)[network.name];
-
+ let cfg = (<Record<string, any>>config)[network.name];
+
if (!cfg) {
throw `Network ${network.name} is not supported`;
}
@@ -74,16 +74,19 @@ export async function getConfig(): Promise<Config> {
// as the provider.
const metamask = new ethers.providers.Web3Provider(window.ethereum);
const network = await metamask.ready;
- const provider = alchemyApiKey ?
- new ethers.providers.AlchemyProvider(network.name, alchemyApiKey)
+ const provider = alchemyApiKey
+ ? new ethers.providers.AlchemyProvider(network.name, alchemyApiKey)
: metamask;
config = new Config(network, provider, metamask.getSigner());
} else {
// If we don't have Metamask, we use Alchemy as the provider, and we don't
// provide a signer. We default to Homestead.
- const network = { name: "homestead", chainId: 1 };
- const provider = new ethers.providers.AlchemyProvider(network.name, alchemyApiKey);
+ const network = { name: 'homestead', chainId: 1 };
+ const provider = new ethers.providers.AlchemyProvider(
+ network.name,
+ alchemyApiKey
+ );
config = new Config(network, provider, null);
}
diff --git a/src/ens/DomainInput.svelte b/src/ens/DomainInput.svelte
index 23f661b..354a692 100644
--- a/src/ens/DomainInput.svelte
+++ b/src/ens/DomainInput.svelte
@@ -2,9 +2,9 @@
import { onMount } from 'svelte';
export let root: string;
- export let placeholder = "";
+ export let placeholder = '';
export let disabled = false;
- export let value = "";
+ export let value = '';
export let autofocus = false;
let element: HTMLInputElement;
@@ -22,7 +22,7 @@
margin: 1rem;
margin-left: 0;
margin-right: 0;
- padding: 1rem 2rem;
+ padding: 1rem 2rem;
color: var(--color-secondary);
border-radius: 0 var(--border-radius) var(--border-radius) 0;
border: 1px solid var(--color-secondary);
@@ -53,9 +53,8 @@
{disabled}
{placeholder}
bind:this={element}
- bind:value={value}
+ bind:value
on:input
- on:click
- />
+ on:click />
<span class="root">.{root}</span>
</main>
diff --git a/src/ens/SetName.svelte b/src/ens/SetName.svelte
index fed7c43..db216b2 100644
--- a/src/ens/SetName.svelte
+++ b/src/ens/SetName.svelte
@@ -21,7 +21,7 @@
Failed,
}
- let name: string = "";
+ let name: string = '';
let state = State.Idle;
let mismatchError = false; // Set if the name entered does not resolve to the address.
@@ -51,9 +51,7 @@
{#if state === State.Success}
<Modal floating>
- <div slot="title">
- ✅
- </div>
+ <div slot="title">✅</div>
<div slot="subtitle">
The ENS name for {org.address} was set to
@@ -61,9 +59,7 @@
</div>
<div slot="actions">
- <button class="small" on:click={() => dispatch('close')}>
- Done
- </button>
+ <button class="small" on:click={() => dispatch('close')}> Done </button>
</div>
</Modal>
{:else}
@@ -80,9 +76,9 @@
{#if mismatchError}
<div class="error">
The name <strong>{name}.{config.registrar.domain}</strong> does not
- resolve to <strong>{formatAddress(org.address)}</strong>. Please update
- The ENS record for {name}.{config.registrar.domain} to
- point to the correct address.
+ resolve to <strong>{formatAddress(org.address)}</strong>. Please
+ update The ENS record for {name}.{config.registrar.domain} to point to
+ the correct address.
</div>
{:else if state == State.Signing}
Please confirm the transaction in your wallet.
@@ -95,8 +91,12 @@
<div slot="body">
{#if state === State.Idle || state === State.Checking}
- <DomainInput root={config.registrar.domain} on:input={() => mismatchError = false}
- autofocus disabled={state !== State.Idle} bind:value={name} />
+ <DomainInput
+ root={config.registrar.domain}
+ on:input={() => (mismatchError = false)}
+ autofocus
+ disabled={state !== State.Idle}
+ bind:value={name} />
{:else}
<Loading small center />
{/if}
@@ -112,7 +112,10 @@
Close
</button>
{:else}
- <button class="primary" on:click={onSubmit} disabled={!name || state !== State.Idle}>
+ <button
+ class="primary"
+ on:click={onSubmit}
+ disabled={!name || state !== State.Idle}>
{#if state === State.Checking}
Checking...
{:else}
diff --git a/src/error.ts b/src/error.ts
index 9ef3dad..abfd6c2 100644
--- a/src/error.ts
+++ b/src/error.ts
@@ -1,9 +1,9 @@
-import { writable } from "svelte/store";
+import { writable } from 'svelte/store';
export interface Err {
- type: Failure,
- txHash?: string,
- message?: string,
+ type: Failure;
+ txHash?: string;
+ message?: string;
}
export enum Failure {
@@ -34,13 +34,15 @@ class AssertionError extends Error {
}
export function assert(value: any, message?: string): asserts value {
- if (! value) {
+ if (!value) {
throw new AssertionError(message);
}
}
export function assertEq(actual: any, expected: any, message?: string) {
if (actual !== expected) {
- throw new AssertionError(`assertion failed: expected '${expected}', got '${actual}'`);
+ throw new AssertionError(
+ `assertion failed: expected '${expected}', got '${actual}'`
+ );
}
}
diff --git a/src/index.ts b/src/index.ts
index fcba472..3acf410 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,4 +1,4 @@
-import App from "./App.svelte";
+import App from './App.svelte';
declare global {
// Taken from svelte-routing, since it's not exported.
diff --git a/src/session.ts b/src/session.ts
index ac01bfa..9f5ea1a 100644
--- a/src/session.ts
+++ b/src/session.ts
@@ -1,36 +1,45 @@
-import { get, writable, derived, Writable } from "svelte/store";
-import { ethers } from "ethers";
+import { get, writable, derived, Writable } from 'svelte/store';
+import { ethers } from 'ethers';
import type { BigNumber } from 'ethers';
-import type { TransactionReceipt, TransactionResponse } from '@ethersproject/providers';
-import type { Config } from "@app/config";
-import { Unreachable, assert, assertEq } from "@app/error";
+import type {
+ TransactionReceipt,
+ TransactionResponse,
+} from '@ethersproject/providers';
+import type { Config } from '@app/config';
+import { Unreachable, assert, assertEq } from '@app/error';
export enum Connection {
Disconnected,
Connecting,
- Connected
+ Connected,
}
export type TxState =
- { state: 'signing' }
- | { state: 'pending', hash: string }
- | { state: 'success', hash: string, blockHash: string, blockNumber: number }
- | { state: 'fail', hash: string, blockHash: string, blockNumber: number, error: string }
+ | { state: 'signing' }
+ | { state: 'pending'; hash: string }
+ | { state: 'success'; hash: string; blockHash: string; blockNumber: number }
+ | {
+ state: 'fail';
+ hash: string;
+ blockHash: string;
+ blockNumber: number;
+ error: string;
+ }
| null;
export type State =
- { connection: Connection.Disconnected }
+ | { connection: Connection.Disconnected }
| { connection: Connection.Connecting }
- | { connection: Connection.Connected, session: Session };
+ | { connection: Connection.Connected; session: Session };
export interface Session {
- address: string
- tokenBalance: any
- tx: TxState
+ address: string;
+ tokenBalance: any;
+ tx: TxState;
}
export const createState = (initial: State) => {
- const store = writable<State>(initial)
+ const store = writable<State>(initial);
return {
subscribe: store.subscribe,
@@ -42,12 +51,18 @@ export const createState = (initial: State) => {
// TODO: This hangs on Brave, if you have to unlock your wallet..
try {
- let accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
+ let accounts = await window.ethereum.request({
+ method: 'eth_requestAccounts',
+ });
} catch (e) {
console.error(e);
}
- const token = new ethers.Contract(config.radToken.address, config.abi.token, config.provider);
+ const token = new ethers.Contract(
+ config.radToken.address,
+ config.abi.token,
+ config.provider
+ );
const signer = config.provider.getSigner();
const address = await signer.getAddress();
@@ -55,7 +70,7 @@ export const createState = (initial: State) => {
const tokenBalance = await token.balanceOf(address);
store.set({
connection: Connection.Connected,
- session: { address, tokenBalance, tx: null }
+ session: { address, tokenBalance, tx: null },
});
} catch (e) {
console.error(e);
@@ -63,7 +78,7 @@ export const createState = (initial: State) => {
},
updateBalance: (n: BigNumber) => {
- store.update((s) => {
+ store.update(s => {
assert(s.connection === Connection.Connected);
s.session.tokenBalance = s.session.tokenBalance.add(n);
return s;
@@ -76,7 +91,11 @@ export const createState = (initial: State) => {
const addr = state.session.address;
try {
- const token = new ethers.Contract(config.radToken.address, config.abi.token, config.provider);
+ const token = new ethers.Contract(
+ config.radToken.address,
+ config.abi.token,
+ config.provider
+ );
const tokenBalance = await token.balanceOf(addr);
state.session.tokenBalance = tokenBalance;
@@ -125,7 +144,7 @@ export const createState = (initial: State) => {
state: 'success',
hash: s.session.tx.hash,
blockHash: tx.blockHash,
- blockNumber: tx.blockNumber
+ blockNumber: tx.blockNumber,
};
} else {
s.session.tx = {
@@ -133,7 +152,7 @@ export const createState = (initial: State) => {
hash: s.session.tx.hash,
blockHash: tx.blockHash,
blockNumber: tx.blockNumber,
- error: "Failed"
+ error: 'Failed',
};
}
return s;
@@ -146,13 +165,13 @@ export const createState = (initial: State) => {
store.update(s => {
switch (s.connection) {
case Connection.Connected:
- s.session.address = address;
+ s.session.address = address;
return s;
default:
return s;
}
- })
- }
+ });
+ },
};
};
@@ -167,14 +186,22 @@ export const session = derived(state, s => {
window.ethereum?.on('chainChanged', () => location.reload());
// Updates state when user changes accounts
-window.ethereum?.on("accountsChanged", state.setChangedAccount);
+window.ethereum?.on('accountsChanged', state.setChangedAccount);
state.subscribe(s => {
- console.log("session.state", s);
+ console.log('session.state', s);
});
-export async function approveSpender(spender: string, amount: BigNumber, config: Config) {
- const token = new ethers.Contract(config.radToken.address, config.abi.token, config.provider);
+export async function approveSpender(
+ spender: string,
+ amount: BigNumber,
+ config: Config
+) {
+ const token = new ethers.Contract(
+ config.radToken.address,
+ config.abi.token,
+ config.provider
+ );
const signer = config.provider.getSigner();
const addr = await signer.getAddress();
@@ -187,7 +214,11 @@ export async function approveSpender(spender: string, amount: BigNumber, config:
}
export function token(config: Config): ethers.Contract {
- return new ethers.Contract(config.radToken.address, config.abi.token, config.provider);
+ return new ethers.Contract(
+ config.radToken.address,
+ config.abi.token,
+ config.provider
+ );
}
export function disconnectWallet() {
diff --git a/src/utils.ts b/src/utils.ts
index 4e85542..970bd0f 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -1,5 +1,5 @@
-import { ethers } from "ethers";
-import type { BigNumber } from "ethers";
+import { ethers } from 'ethers';
+import type { BigNumber } from 'ethers';
import multibase from 'multibase';
import type { Config } from '@app/config';
import { assert } from '@app/error';
@@ -12,13 +12,15 @@ export enum AddressType {
}
export interface Safe {
- address: string
- owners: string[]
- threshold: number
+ address: string;
+ owners: string[];
+ threshold: number;
}
export function formatBalance(n: BigNumber) {
- return ethers.utils.commify(parseFloat(ethers.utils.formatUnits(n)).toFixed(2));
+ return ethers.utils.commify(
+ parseFloat(ethers.utils.formatUnits(n)).toFixed(2)
+ );
}
export function formatAddress(addr: string) {
@@ -26,21 +28,21 @@ export function formatAddress(addr: string) {
}
export function formatHash(hash: string) {
- return hash.substring(0, 6)
- + '...'
- + hash.substring(hash.length - 4, hash.length);
+ return (
+ hash.substring(0, 6) + '...' + hash.substring(hash.length - 4, hash.length)
+ );
}
export function capitalize(s: string) {
- if (s === "") return s;
+ if (s === '') return s;
return s[0].toUpperCase() + s.substr(1);
}
// Takes a domain name, eg. 'cloudhead.radicle.eth' and
// returns the label, eg. 'cloudhead', otherwise `null`.
export function parseEnsLabel(name: string, config: Config): string {
- let domain = config.registrar.domain.replace(".", "\\.");
- let label = name.replace(new RegExp(`\\.${domain}$`), "");
+ let domain = config.registrar.domain.replace('.', '\\.');
+ let label = name.replace(new RegExp(`\\.${domain}$`), '');
return label;
}
@@ -66,16 +68,19 @@ export function isAddress(input: string): boolean {
}
// Get search parameters from location.
-export function getSearchParam(key: string, location: RouteLocation): string | null {
+export function getSearchParam(
+ key: string,
+ location: RouteLocation
+): string | null {
let params = new URLSearchParams(location.search);
return params.get(key);
}
// Get the explorer link of an address, eg. Etherscan.
export function explorerLink(addr: string, config: Config): string {
- if (config.network.name == "ropsten") {
+ if (config.network.name == 'ropsten') {
return `https://ropsten.etherscan.io/address/${addr}`;
- } else if (config.network.name == "rinkeby") {
+ } else if (config.network.name == 'rinkeby') {
return `https://rinkeby.etherscan.io/address/${addr}`;
}
return `https://etherscan.io/address/${addr}`;
@@ -103,13 +108,13 @@ export async function querySubgraph(
body: JSON.stringify({
query,
variables,
- })
+ }),
});
const json = await response.json();
if (json.errors) {
for (let e of json.errors) {
- console.error("querySubgraph:", e.message);
+ console.error('querySubgraph:', e.message);
}
return null;
}
@@ -125,14 +130,14 @@ export function formatRadicleId(hash: Uint8Array): string {
// Create a multihash by adding prefix 17 for SHA-1 and 20 for the hash length.
const multihash = new Uint8Array([17, 20, ...suffix]);
- const payload = multibase.encode("base32z", multihash);
+ const payload = multibase.encode('base32z', multihash);
return `rad:git:${new TextDecoder().decode(payload)}`;
}
// Create a project hash from a hash and format.
export function formatProjectHash(hash: Uint8Array, format: number): string {
- assert(format === 0x0, "Only SHA1 commit hashes are supported");
+ assert(format === 0x0, 'Only SHA1 commit hashes are supported');
// Remove any zero-padding from the byte array. SHA1 is 20 bytes long.
const sha1Bytes = 20;
@@ -141,7 +146,10 @@ export function formatProjectHash(hash: Uint8Array, format: number): string {
}
// Identify an address by checking whether it's a contract or an externally-owned address.
-export async function identifyAddress(address: string, config: Config): Promise<AddressType> {
+export async function identifyAddress(
+ address: string,
+ config: Config
+): Promise<AddressType> {
let safe = await getSafe(address, config);
if (safe) {
return AddressType.Safe;
@@ -160,22 +168,28 @@ export async function identifyAddress(address: string, config: Config): Promise<
}
// Resolve a label under the radicle domain.
-export async function resolveLabel(label: string, config: Config): Promise<string | null> {
+export async function resolveLabel(
+ label: string,
+ config: Config
+): Promise<string | null> {
return config.provider.resolveName(`${label}.${config.registrar.domain}`);
}
// Get a Gnosis Safe at an address.
-export async function getSafe(address: string, config: Config): Promise<Safe | null> {
- if (! config.safe.api) return null;
+export async function getSafe(
+ address: string,
+ config: Config
+): Promise<Safe | null> {
+ if (!config.safe.api) return null;
const response = await fetch(`${config.safe.api}/safes/${address}`, {
method: 'GET',
headers: {
'Accept': 'application/json',
- }
+ },
});
- if (! response.ok) {
+ if (!response.ok) {
return null;
}
const json = await response.json();
@@ -183,15 +197,19 @@ export async function getSafe(address: string, config: Config): Promise<Safe | n
return {
address: json.address,
owners: json.owners,
- threshold: json.threshold
+ threshold: json.threshold,
};
}
// Get token balances for an address.
-export async function getTokens(address: string, config: Config):
- Promise<Array<{ tokenName: string, tokenLogo: string }>>
-{
- const result = await config.provider.send("alchemy_getTokenBalances", [address, config.tokens]);
+export async function getTokens(
+ address: string,
+ config: Config
+): Promise<Array<{ tokenName: string; tokenLogo: string }>> {
+ const result = await config.provider.send('alchemy_getTokenBalances', [
+ address,
+ config.tokens,
+ ]);
// TODO
return [];
diff --git a/tsconfig.json b/tsconfig.json
index 8764a99..61bd33d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,18 +1,11 @@
{
"extends": "@tsconfig/svelte/tsconfig.json",
- "include": [
- "src",
- "types"
- ],
- "exclude": [
- "node_modules/*"
- ],
+ "include": ["src", "types"],
+ "exclude": ["node_modules/*"],
"compilerOptions": {
"target": "es2020",
"module": "es2020",
- "types": [
- "svelte"
- ],
+ "types": ["svelte"],
"moduleResolution": "node",
"strict": true,
"resolveJsonModule": true,
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment