add paseo, fix UX, whitelist paseo people separatelly (#371)

Closes #370 -> add paseo to UI, + whitelist paseo people separately from common pattern of parity and w3f Closes #365 -> fix UX --------- Co-authored-by: Javier Bullrich <[email protected]>
paritytech · Feb 8, 2024 · a857c92 · a857c92
1 parent c1f195a
commit a857c92
Show file tree

Hide file tree

Showing 15 changed files with 154 additions and 21 deletions.
diff --git a/client/.env b/client/.env
@@ -3,7 +3,7 @@ PUBLIC_CAPTCHA_KEY=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI
 
 PUBLIC_FAUCET_URL=
 # uncomment to direct requests to local instance
-# PUBLIC_FAUCET_URL=http://localhost:5555
+# PUBLIC_FAUCET_URL=http://localhost:5555/drip/web/
 
 PUBLIC_ISSUE_LINK=https://github.com/paritytech/polkadot-testnet-faucet/issues/new/choose
 PUBLIC_FORUM="https://forum.polkadot.network/t/experiencing-trouble-accessing-our-rococo-faucet-please-post-here/2952"
diff --git a/client/src/app.css b/client/src/app.css
@@ -130,4 +130,8 @@ button:focus-visible {
   font-size: 16px;
 }
 
+.dropdown a {
+  color: white;
+}
+
 @tailwind utilities;
diff --git a/client/src/lib/components/Footer.svelte b/client/src/lib/components/Footer.svelte
@@ -4,7 +4,7 @@
 
 <footer class="footer items-center p-4 text-white px-1 md:px-6">
   <div class="items-center grid-flow-col">
-    <p>2023 All rights reserved · Parity Technologies</p>
+    <p>2024 All rights reserved · Parity Technologies</p>
   </div>
   <div class="grid-flow-col gap-4 md:place-self-center md:justify-self-end">
     <b class="questions">Questions?</b>

diff --git a/client/src/lib/components/Form.svelte b/client/src/lib/components/Form.svelte
@@ -38,8 +38,8 @@
 
 <form on:submit|preventDefault={onSubmit} class="w-full">
   <div class="grid md:grid-cols-2 md:gap-x-4">
-    <NetworkInput bind:network />
     <NetworkDropdown currentNetwork={networkData} />
+    <NetworkInput bind:network />
   </div>
 
   <div class="inputs-container">

diff --git a/client/src/lib/components/NetworkDropdown.svelte b/client/src/lib/components/NetworkDropdown.svelte
@@ -8,7 +8,7 @@
 
 <div class="dropdown w-full mb-14">
   <label class="label" for="address">
-    <span class="form-label">Chain</span>
+    <span class="form-label">Network</span>
   </label>
   <div tabindex="-1" class="chain-dropdown w-full" data-testid="network-select">
     <div class="w-full flex justify-between bg-transparent">

diff --git a/client/src/lib/components/NetworkInput.svelte b/client/src/lib/components/NetworkInput.svelte
@@ -34,7 +34,7 @@
 
 <div class="inputs-container">
   <label class="label" for="address">
-    <span class="form-label">Network</span>
+    <span class="form-label">Chain</span>
   </label>
   <input
     type="number"

diff --git a/client/src/lib/utils/networkData.ts b/client/src/lib/utils/networkData.ts
@@ -26,10 +26,11 @@ export const Rococo: NetworkData = {
   networkName: "Rococo",
   currency: "ROC",
   chains: [
-    { name: "Rococo Relay Chain", id: -1 },
-    { name: "Rockmine", id: 1000 },
+    { name: "Rococo Relay", id: -1 },
+    { name: "AssetHub", id: 1000 },
     { name: "Contracts", id: 1002 },
     { name: "Encointer Lietaer", id: 1003 },
+    { name: "Coretime", id: 1005 },
     { name: "Bridgehub", id: 1013 },
   ],
   endpoint: faucetUrl("https://rococo-faucet.parity-testnet.parity.io/drip/web"),
@@ -40,14 +41,24 @@ export const Westend: NetworkData = {
   networkName: "Westend",
   currency: "WND",
   chains: [
-    { name: "Westend Relay Chain", id: -1 },
-    { name: "Westmint", id: 1000 },
+    { name: "Westend Relay", id: -1 },
+    { name: "AssetHub", id: 1000 },
     { name: "Collectives", id: 1001 },
+    { name: "BridgeHub", id: 1002 },
+    { name: "People", id: 1004 },
   ],
   endpoint: faucetUrl("https://westend-faucet.polkadot.io/drip/web"),
   explorer: "https://westend.subscan.io",
 };
 
+export const Paseo: NetworkData = {
+  networkName: "Paseo",
+  currency: "PAS",
+  chains: [{ name: "Paseo Relay", id: -1 }],
+  endpoint: faucetUrl("https://paseo-faucet.parity-testnet.parity.io/drip/web"),
+  explorer: null,
+};
+
 export const Trappist: NetworkData = {
   networkName: "Trappist",
   currency: "HOP",
@@ -58,6 +69,7 @@ export const Trappist: NetworkData = {
 
 export const Networks: { network: NetworkData; url: string }[] = [
   { network: Rococo, url: (base as string) || "/" },
+  { network: Paseo, url: `${base as string}/paseo` },
   { network: Westend, url: `${base as string}/westend` },
   { network: Trappist, url: `${base as string}/trappist` },
 ];

diff --git a/client/src/routes/paseo/+page.svelte b/client/src/routes/paseo/+page.svelte
@@ -0,0 +1,12 @@
+<script lang="ts">
+  import Faucet from "$lib/components/Faucet.svelte";
+  import { Paseo, type NetworkData } from "$lib/utils/networkData";
+  import faqMd from "$lib/assets/FAQ.md?raw";
+
+  let network: NetworkData = Paseo;
+  let faq: string = faqMd
+    .replaceAll("<NETWORK-TOKEN>", network.currency)
+    .replaceAll("<NETWORK-NAME>", network.networkName);
+</script>
+
+<Faucet {network} {faq} />
diff --git a/client/tests/paseo.test.ts b/client/tests/paseo.test.ts
@@ -0,0 +1,6 @@
+import { FaucetTests } from "./faucet.js";
+
+const chains = [{ name: "Paseo Relay", id: -1 }];
+
+const tests = new FaucetTests({ faucetName: "Paseo Faucet", chains, url: "/paseo", expectTransactionLink: false });
+tests.runTests();
diff --git a/client/tests/rococo.test.ts b/client/tests/rococo.test.ts
@@ -1,10 +1,11 @@
 import { FaucetTests } from "./faucet.js";
 
 const chains = [
-  { name: "Relay Chain", id: -1 },
-  { name: "Rockmine", id: 1000 },
+  { name: "Rococo Relay", id: -1 },
+  { name: "AssetHub", id: 1000 },
   { name: "Contracts", id: 1002 },
   { name: "Encointer Lietaer", id: 1003 },
+  { name: "Coretime", id: 1005 },
   { name: "Bridgehub", id: 1013 },
 ];
 

diff --git a/client/tests/westend.test.ts b/client/tests/westend.test.ts
@@ -1,9 +1,11 @@
 import { FaucetTests } from "./faucet.js";
 
 const chains = [
-  { name: "Westend Relay Chain", id: -1 },
-  { name: "Westmint", id: 1000 },
+  { name: "Westend Relay", id: -1 },
+  { name: "AssetHub", id: 1000 },
   { name: "Collectives", id: 1001 },
+  { name: "BridgeHub", id: 1002 },
+  { name: "People", id: 1004 },
 ];
 
 const tests = new FaucetTests({ faucetName: "Westend Faucet", chains, url: "/westend", expectTransactionLink: true });

diff --git a/src/__mocks__/networkData.ts b/src/__mocks__/networkData.ts
@@ -0,0 +1,44 @@
+// eslint-disable-next-line unused-imports/no-unused-vars-ts
+export const getNetworkData = jest.fn((networkName: string) => {
+  if (process.env.SMF_CONFIG_NETWORK == "paseo") {
+    return {
+      balanceCap: 500,
+      chains: [],
+      currency: "PAS",
+      decimals: 10,
+      dripAmount: "100",
+      explorer: null,
+      networkName: "Paseo",
+      rpcEndpoint: "wss://paseo.rpc.amforc.com/",
+      matrixWhitelistPatterns: [
+        /^@erin:parity\.io$/,
+        /^@mak:parity\.io$/,
+        /^@alexbird:parity\.io$/,
+        /^@pierre:parity\.io$/,
+        /^@hectorest06:matrix\.org$/,
+        /^@tbaut:matrix\.org$/,
+        /^@al3mart:matrix\.org$/,
+        /^@purpletentacle:matrix\.org$/,
+        /^@carlosala:matrix\.org$/,
+      ],
+    };
+  } else {
+    return {
+      balanceCap: 1000,
+      chains: [
+        { name: "Rococo Relay Chain", id: -1 },
+        { name: "Rockmine", id: 1000 },
+        { name: "Contracts", id: 1002 },
+        { name: "Encointer Lietaer", id: 1003 },
+        { name: "Bridgehub", id: 1013 },
+      ],
+      currency: "ROC",
+      decimals: 12,
+      dripAmount: "100",
+      explorer: "https://rococo.subscan.io",
+      networkName: "Rococo",
+      rpcEndpoint: "wss://rococo-rpc.polkadot.io/",
+      matrixWhitelistPatterns: [/^.*:parity.io$/, /^.*:web3.foundation$/],
+    };
+  }
+});
diff --git a/src/networkData.ts b/src/networkData.ts
@@ -14,8 +14,11 @@ export interface NetworkData {
   decimals: number;
   dripAmount: string;
   balanceCap: number;
+  matrixWhitelistPatterns: RegExp[];
 }
 
+const parityWhitelist = [/^.*:parity.io$/, /^.*:web3.foundation$/];
+
 const rococo: NetworkData = {
   balanceCap: 1000,
   chains: [
@@ -31,6 +34,7 @@ const rococo: NetworkData = {
   explorer: "https://rococo.subscan.io",
   networkName: "Rococo",
   rpcEndpoint: "wss://rococo-rpc.polkadot.io/",
+  matrixWhitelistPatterns: parityWhitelist,
 };
 
 const westend: NetworkData = {
@@ -46,6 +50,7 @@ const westend: NetworkData = {
   explorer: "https://westend.subscan.io",
   networkName: "Westend",
   rpcEndpoint: "wss://westend-rpc.polkadot.io/",
+  matrixWhitelistPatterns: parityWhitelist,
 };
 
 const versi: NetworkData = {
@@ -57,6 +62,7 @@ const versi: NetworkData = {
   explorer: null,
   networkName: "Versi",
   rpcEndpoint: "wss://versi-rpc-node-0.parity-versi.parity.io/",
+  matrixWhitelistPatterns: parityWhitelist,
 };
 
 const trappist: NetworkData = {
@@ -68,17 +74,29 @@ const trappist: NetworkData = {
   explorer: null,
   networkName: "Trappist",
   rpcEndpoint: "wss://rococo-trappist-rpc.polkadot.io/",
+  matrixWhitelistPatterns: parityWhitelist,
 };
 
 const paseo: NetworkData = {
-  balanceCap: 100,
+  balanceCap: 500,
   chains: [],
   currency: "PAS",
   decimals: 10,
-  dripAmount: "10",
+  dripAmount: "100",
   explorer: null,
   networkName: "Paseo",
   rpcEndpoint: "wss://paseo.rpc.amforc.com/",
+  matrixWhitelistPatterns: [
+    /^@erin:parity\.io$/,
+    /^@mak:parity\.io$/,
+    /^@alexbird:parity\.io$/,
+    /^@pierre:parity\.io$/,
+    /^@hectorest06:matrix\.org$/,
+    /^@tbaut:matrix\.org$/,
+    /^@al3mart:matrix\.org$/,
+    /^@purpletentacle:matrix\.org$/,
+    /^@carlosala:matrix\.org$/,
+  ],
 };
 
 const e2e: NetworkData = {
@@ -90,6 +108,7 @@ const e2e: NetworkData = {
   explorer: null,
   networkName: "Rococo",
   rpcEndpoint: "ws://host.docker.internal:9933/",
+  matrixWhitelistPatterns: parityWhitelist,
 };
 
 export const networks: Record<string, NetworkData> = { rococo, versi, westend, e2e, trappist, paseo };

diff --git a/src/utils.spec.ts b/src/utils.spec.ts
@@ -1,11 +1,15 @@
+import * as process from "process";
+
 import { isAccountPrivileged } from "./utils";
 
-describe("isAccountPrivileged", () => {
-  type DataProvider = {
-    username: string;
-    expected: boolean;
-  };
+type DataProvider = {
+  username: string;
+  expected: boolean;
+};
+
+jest.mock("./networkData");
 
+describe("test rococo", () => {
   const dataProvider: DataProvider[] = [
     { username: "1", expected: false },
     { username: "", expected: false },
@@ -20,3 +24,26 @@ describe("isAccountPrivileged", () => {
     expect(isAccountPrivileged(username)).toBe(expected);
   });
 });
+
+describe("test paseo", () => {
+  beforeAll(() => {
+    process.env.SMF_CONFIG_NETWORK = "paseo";
+    jest.resetModules();
+  });
+
+  const dataProvider: DataProvider[] = [
+    { username: "1", expected: false },
+    { username: "", expected: false },
+    { username: "@username:matrix.org", expected: false },
+    { username: "@1:parity.io", expected: false },
+    { username: "@1:matrix.parity.io", expected: false },
+    { username: "@1:web3.foundation", expected: false },
+    { username: "@1:web3.foundati", expected: false },
+    { username: "@erin:web3.foundation", expected: false },
+    { username: "@erin:parity.io", expected: true },
+  ];
+
+  test.each(dataProvider)("$username, $expect", ({ username, expected }) => {
+    expect(isAccountPrivileged(username)).toBe(expected);
+  });
+});
diff --git a/src/utils.ts b/src/utils.ts
@@ -1,3 +1,9 @@
+import { config } from "src/config";
+import { getNetworkData } from "src/networkData";
+
 export function isAccountPrivileged(sender: string): boolean {
-  return sender.endsWith(":parity.io") || sender.endsWith(":web3.foundation");
+  const networkName = config.Get("NETWORK");
+  const networkData = getNetworkData(networkName);
+
+  return networkData.matrixWhitelistPatterns.some((pattern) => pattern.test(sender));
 }