Merge pull request #125 from tablelandnetwork/dtb/ethers-v6

tablelandnetwork · May 9, 2024 · a5cbf74 · a5cbf74
2 parents 21d7839 + 54b862a
commit a5cbf74
Show file tree

Hide file tree

Showing 26 changed files with 7,017 additions and 4,610 deletions.
diff --git a/.env.example b/.env.example
@@ -0,0 +1 @@
+WALLET_CONNECT_PROJECT_ID=your_project_id
diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
@@ -10,10 +10,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout 🛎️
-        uses: actions/checkout@v2.3.1
+        uses: actions/checkout@v4
 
       - name: Cache 📦
-        uses: actions/cache@v1
+        uses: actions/cache@v4
         with:
           path: ~/.npm # npm cache files are stored in `~/.npm` on Linux/macOS
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
@@ -23,7 +23,7 @@ jobs:
             ${{ runner.os }}-
 
       - name: Setup Node Environment ⬢
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v4
         with:
           node-version: 18
 

diff --git a/.github/workflows/review.yml b/.github/workflows/review.yml
@@ -10,16 +10,21 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
-  lint:
+  review:
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: true
+      matrix:
+        nodejs: [18, 20]
+
     steps:
       - name: Checkout 🛎️
-        uses: actions/checkout@v2.3.1
+        uses: actions/checkout@v4
         with:
           persist-credentials: false
 
       - name: Cache 📦
-        uses: actions/cache@v1
+        uses: actions/cache@v4
         with:
           path: ~/.npm # npm cache files are stored in `~/.npm` on Linux/macOS
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
@@ -29,9 +34,9 @@ jobs:
             ${{ runner.os }}-
 
       - name: Setup Node Environment ⬢
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: ${{ matrix.nodejs }}
 
       - name: Install 🔧
         run: npm install

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -15,16 +15,16 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        nodejs: [16, 18]
+        nodejs: [18, 20]
 
     steps:
       - name: Checkout 🛎️
-        uses: actions/checkout@v2.3.1
+        uses: actions/checkout@v4
         with:
           persist-credentials: false
 
       - name: Cache 📦
-        uses: actions/cache@v1
+        uses: actions/cache@v4
         with:
           path: ~/.npm # npm cache files are stored in `~/.npm` on Linux/macOS
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
@@ -34,7 +34,7 @@ jobs:
             ${{ runner.os }}-
 
       - name: Setup ⬢
-        uses: actions/setup-node@v2-beta
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.nodejs }}
 

diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 /node_modules/
 /public/
+.env
diff --git a/api/findColor.js b/api/findColor.js
@@ -8,23 +8,42 @@ const colors = [
   "#C15261",
   "#D65963",
   "#EA6064",
-  "#FF6766"
+  "#FF6766",
 ];
 
 export default function findColor(rows) {
   let i;
-  switch(true) {
-    case (rows < 9 * 3):      i = 0; break;
-    case (rows < 20 * 3):     i = 1; break;
-    case (rows < 50 * 3):     i = 2; break;
-    case (rows < 100 * 3):    i = 3; break;
-    case (rows < 200 * 3):    i = 4; break;
-    case (rows < 500 * 3):    i = 5; break;
-    case (rows < 1000 * 3):   i = 6; break;
-    case (rows < 5000 * 3):   i = 7; break;
-    case (rows < 20000 * 3):  i = 8; break;
-    case (rows >= 20000 * 3): i = 9; break;   
-
+  switch (true) {
+    case rows < 9 * 3:
+      i = 0;
+      break;
+    case rows < 20 * 3:
+      i = 1;
+      break;
+    case rows < 50 * 3:
+      i = 2;
+      break;
+    case rows < 100 * 3:
+      i = 3;
+      break;
+    case rows < 200 * 3:
+      i = 4;
+      break;
+    case rows < 500 * 3:
+      i = 5;
+      break;
+    case rows < 1000 * 3:
+      i = 6;
+      break;
+    case rows < 5000 * 3:
+      i = 7;
+      break;
+    case rows < 20000 * 3:
+      i = 8;
+      break;
+    case rows >= 20000 * 3:
+      i = 9;
+      break;
   }
   return colors[i];
 }
diff --git a/app/app.tsx b/app/app.tsx
@@ -1,16 +1,9 @@
-import React from 'react';
-import reactDom from 'react-dom/client';
+import React from "react";
+import reactDom from "react-dom/client";
 import init from "@tableland/sqlparser";
-import App from './components/Renderer';
-
+import App from "./components/Renderer";
 
 document.addEventListener("DOMContentLoaded", async () => {
   await init();
-  reactDom
-    .createRoot(document.getElementById("app"))
-    .render(
-      (
-        <App />
-      )
-    );
+  reactDom.createRoot(document.getElementById("app")).render(<App />);
 });
diff --git a/app/components/Code.tsx b/app/components/Code.tsx
@@ -1,41 +1,45 @@
-import React from 'react';
-import { setQuery } from '../store/query';
-import CustomConnectButton from './CustomConnectButton';
-import { RootState } from '../store/store';
-import { useDispatch, useSelector } from 'react-redux';
-import { useAccount} from 'wagmi';
-import CodeHighlighter from './CodeHighlighter';
-import { queryTableland } from '../store/queryTableland';
-import { findType } from '../store/type';
-import Logo from './Logo';
-
+import React from "react";
+import { setQuery } from "../store/query";
+import CustomConnectButton from "./CustomConnectButton";
+import { RootState } from "../store/store";
+import { useDispatch, useSelector } from "react-redux";
+import { useAccount } from "wagmi";
+import CodeHighlighter from "./CodeHighlighter";
+import { queryTableland } from "../store/queryTableland";
+import { findType } from "../store/type";
+import Logo from "./Logo";
 
 function CodeEditor(props) {
-
   const { isConnected } = useAccount();
 
   const dispatch = useDispatch();
-  const {
-    loading,
-    query,
-    typeOfQuery
-  } = useSelector((store: RootState) => store);
+  const { loading, query, typeOfQuery } = useSelector(
+    (store: RootState) => store
+  );
 
   return (
-    <div className="editor-wrapper">        
-      <CodeHighlighter code={query} placeholder="// SQL QUERY HERE" onChange={(val) => {
-        dispatch(setQuery(val));
-        dispatch(findType({query:val}) as any);
-      }} />
-      <div className='footer'>
+    <div className="editor-wrapper">
+      <CodeHighlighter
+        code={query}
+        placeholder="// SQL QUERY HERE"
+        onChange={(val) => {
+          dispatch(setQuery(val));
+          dispatch(findType({ query: val }) as any);
+        }}
+      />
+      <div className="footer">
         <Logo />
-        {(isConnected || typeOfQuery==="read") ? (
-        <button className="secondary" disabled={loading} onClick={e => {
-          if(loading) return;
-          dispatch(queryTableland({query}) as any);
-        }}>
-          {typeOfQuery==="read" ? "Query" : "Write"}
-        </button>
+        {isConnected || typeOfQuery === "read" ? (
+          <button
+            className="secondary"
+            disabled={loading}
+            onClick={(e) => {
+              if (loading) return;
+              dispatch(queryTableland({ query }) as any);
+            }}
+          >
+            {typeOfQuery === "read" ? "Query" : "Write"}
+          </button>
         ) : (
           <CustomConnectButton />
         )}
@@ -45,4 +49,3 @@ function CodeEditor(props) {
 }
 
 export default CodeEditor;
-
diff --git a/app/components/CodeHighlighter.tsx b/app/components/CodeHighlighter.tsx
@@ -4,29 +4,36 @@ import { highlight, languages } from "prismjs/components/prism-core";
 import "prismjs/components/prism-clike";
 import "prismjs/components/prism-sql";
 
-
-const hightlightWithLineNumbers = (input, language, hideLineNumbers) =>
+const highlightWithLineNumbers = (input, language, hideLineNumbers) =>
   highlight(input, language)
     .split("\n")
-    .map((line, i) => `${hideLineNumbers ? "" : `<span class='editorLineNumber'>${i + 1}</span>`}${line}`)
+    .map(
+      (line, i) =>
+        `${
+          hideLineNumbers
+            ? ""
+            : `<span class='editorLineNumber'>${i + 1}</span>`
+        }${line}`
+    )
     .join("\n");
 
 function CodeHighlighter(props) {
-
   return (
     <div className="code-editor-wrapper">
       <Editor
         preClassName="language-sql"
         value={props.code}
         onValueChange={props.onChange}
-        highlight={(code) => hightlightWithLineNumbers(code, languages.sql, props.hideLineNumbers)}
+        highlight={(code) =>
+          highlightWithLineNumbers(code, languages.sql, props.hideLineNumbers)
+        }
         padding={10}
-        textareaId={props.hideLineNumbers ? "codeViewer":"codeEditor"}
+        textareaId={props.hideLineNumbers ? "codeViewer" : "codeEditor"}
         className="editor language-sql"
         style={{
           fontFamily: '"Fira code", "Fira Mono", monospace',
           fontSize: 18,
-          outline: 0
+          outline: 0,
         }}
       />
     </div>