Fix eslint errors

Concordium · Apr 8, 2024 · c775f6f · c775f6f
1 parent 041f220
commit c775f6f
Show file tree

Hide file tree

Showing 10 changed files with 152 additions and 150 deletions.
diff --git a/trackAndTrace/frontend/global.d.ts b/trackAndTrace/frontend/global.d.ts
@@ -18,7 +18,7 @@ declare namespace NodeJS {
 /**
  * The configuration built into the application when served from the backend API
  */
-type Config = {
+interface Config {
     /** The URL of the node. Must have grpc-web enabled. */
     node: string;
     /** The contract address of the track and trace instance used. */
@@ -27,7 +27,7 @@ type Config = {
     network: TargetNetwork;
     /** The URL of the sponsored transaction backend API. */
     sponsoredTransactionBackend: string;
-};
+}
 
 /** The configuration built into the application when served from the backend API */
 declare const CONFIG: Config;
diff --git a/trackAndTrace/frontend/package.json b/trackAndTrace/frontend/package.json
@@ -6,7 +6,7 @@
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",
-        "lint": "eslint",
+        "lint": "eslint . --cache --max-warnings 0 --ext .ts,.tsx",
         "lint-fix": "yarn lint --fix",
         "fmt-check": "prettier --check .",
         "fmt": "prettier --write .",

diff --git a/trackAndTrace/frontend/src/App.tsx b/trackAndTrace/frontend/src/App.tsx
@@ -0,0 +1,124 @@
+import { useEffect } from 'react';
+import { BrowserRouter as Router, Route, Routes, Link } from 'react-router-dom';
+import { Button } from 'react-bootstrap';
+
+import { WalletConnectionProps, useConnection, useConnect } from '@concordium/react-components';
+
+import './styles.scss';
+import { AdminCreateItem } from './components/AdminCreateItem';
+import { AdminChangeRoles } from './components/AdminChangeRoles';
+import { ChangeItemStatus } from './components/ChangeItemStatus';
+import { Explorer } from './components/Explorer';
+import { AddTransitionRule } from './components/AddTransitionRule';
+import * as constants from './constants';
+import { version } from '../package.json';
+
+export const App = (props: WalletConnectionProps) => {
+    const { setActiveConnectorType, activeConnectorError, activeConnector, connectedAccounts, genesisHashes } = props;
+
+    const { connection, setConnection, account } = useConnection(connectedAccounts, genesisHashes);
+    const { connect } = useConnect(activeConnector, setConnection);
+
+    useEffect(() => {
+        setActiveConnectorType(constants.BROWSER_WALLET);
+    }, [setActiveConnectorType]);
+
+    return (
+        <Router>
+            <div className="navbar">
+                <div>
+                    Track And Trace:{' '}
+                    <a
+                        target="_blank"
+                        rel="noreferrer"
+                        href={`https://github.com/Concordium/concordium-dapp-examples/tree/main/trackAndTrace`}
+                    >
+                        Version {version}
+                    </a>
+                    <br />
+                    Contract:{' '}
+                    <a
+                        target="_blank"
+                        rel="noreferrer"
+                        href={`https://${constants.NETWORK.name}.ccdscan.io/?dcount=1&dentity=contract&dcontractAddressIndex=${constants.CONTRACT_ADDRESS.index}&dcontractAddressSubIndex=${constants.CONTRACT_ADDRESS.subindex}`}
+                    >
+                        &lt;{Number(constants.CONTRACT_ADDRESS.index)},{Number(constants.CONTRACT_ADDRESS.subindex)}
+                        &gt;
+                    </a>
+                </div>
+                <Link className="secondary" to="/explorer">
+                    Explorer
+                </Link>
+                <Link className="secondary" to="/changeItemStatus">
+                    Admin1
+                </Link>
+                <Link className="secondary" to="/adminCreateItem">
+                    Admin2
+                </Link>
+                <Link className="secondary" to="/adminChangeRoles">
+                    Admin3
+                </Link>
+                <Link className="secondary" to="/addTransitionRule">
+                    Admin4
+                </Link>
+                <Button
+                    variant="primary"
+                    id="account"
+                    disabled={activeConnector && !account ? false : true}
+                    onClick={connect}
+                >
+                    {account
+                        ? account.slice(0, 5) + '...' + account.slice(-5)
+                        : activeConnector
+                          ? 'Connect Wallet'
+                          : 'Loading...'}
+                </Button>
+            </div>
+
+            <Routes>
+                <Route path="/explorer" element={<Explorer />} />
+                <Route
+                    path="/adminCreateItem"
+                    element={
+                        <AdminCreateItem
+                            activeConnectorError={activeConnectorError}
+                            connection={connection}
+                            accountAddress={account}
+                        />
+                    }
+                />
+                <Route
+                    path="/adminChangeRoles"
+                    element={
+                        <AdminChangeRoles
+                            activeConnectorError={activeConnectorError}
+                            connection={connection}
+                            accountAddress={account}
+                        />
+                    }
+                />
+                <Route
+                    path="/changeItemStatus"
+                    element={
+                        <ChangeItemStatus
+                            activeConnectorError={activeConnectorError}
+                            connection={connection}
+                            accountAddress={account}
+                        />
+                    }
+                />
+                <Route
+                    path="/addTransitionRule"
+                    element={
+                        <AddTransitionRule
+                            activeConnectorError={activeConnectorError}
+                            connection={connection}
+                            accountAddress={account}
+                        />
+                    }
+                />
+                <Route path="/" element={<div></div>} />
+            </Routes>
+        </Router>
+    );
+};
diff --git a/trackAndTrace/frontend/src/components/AddTransitionRule.tsx b/trackAndTrace/frontend/src/components/AddTransitionRule.tsx
@@ -28,12 +28,12 @@ const STATE_OPTIONS = [
 export function AddTransitionRule(props: Props) {
     const { connection, accountAddress, activeConnectorError } = props;
 
-    type FormType = {
+    interface FormType {
         address: string | undefined;
         fromStatus: 'Produced' | 'InTransit' | 'InStore' | 'Sold' | undefined;
         toStatus: 'Produced' | 'InTransit' | 'InStore' | 'Sold' | undefined;
         isUpdateAdd: boolean;
-    };
+    }
     const { control, register, formState, handleSubmit } = useForm<FormType>({ mode: 'all' });
 
     const [isUpdateAdd, fromStatus, toStatus, address] = useWatch({

diff --git a/trackAndTrace/frontend/src/components/AdminChangeRoles.tsx b/trackAndTrace/frontend/src/components/AdminChangeRoles.tsx
@@ -20,10 +20,10 @@ interface Props {
 export function AdminChangeRoles(props: Props) {
     const { connection, accountAddress, activeConnectorError } = props;
 
-    type FormType = {
+    interface FormType {
         address: string | undefined;
         addAdmin: boolean;
-    };
+    }
     const { control, register, formState, handleSubmit } = useForm<FormType>({ mode: 'all' });
 
     const [addAdmin, address] = useWatch({

diff --git a/trackAndTrace/frontend/src/components/AdminCreateItem.tsx b/trackAndTrace/frontend/src/components/AdminCreateItem.tsx
@@ -23,16 +23,16 @@ interface Props {
     activeConnectorError: string | undefined;
 }
 
-type PartialItemCreatedEvent = {
+interface PartialItemCreatedEvent {
     item_id: number | bigint;
-};
+}
 
 export function AdminCreateItem(props: Props) {
     const { connection, accountAddress, activeConnectorError } = props;
 
-    type FormType = {
+    interface FormType {
         url: string | undefined;
-    };
+    }
     const { control, register, formState, handleSubmit } = useForm<FormType>({ mode: 'all' });
 
     const [url] = useWatch({

diff --git a/trackAndTrace/frontend/src/components/ChangeItemStatus.tsx b/trackAndTrace/frontend/src/components/ChangeItemStatus.tsx
@@ -27,7 +27,7 @@ const NEW_STATUS_OPTIONS = [
     { label: 'Sold', value: 'Sold' },
 ];
 
-async function generateMessage(
+function generateMessage(
     newStatus: 'Produced' | 'InTransit' | 'InStore' | 'Sold' | undefined,
     itemID: bigint,
     expiryTimeSignature: Date,
@@ -70,10 +70,10 @@ async function generateMessage(
 export function ChangeItemStatus(props: Props) {
     const { connection, accountAddress, activeConnectorError } = props;
 
-    type FormType = {
+    interface FormType {
         itemID: bigint | undefined;
         newStatus: 'Produced' | 'InTransit' | 'InStore' | 'Sold' | undefined;
-    };
+    }
     const { control, register, formState, handleSubmit } = useForm<FormType>({ mode: 'all' });
 
     const [newStatus, itemID] = useWatch({
@@ -134,12 +134,7 @@ export function ChangeItemStatus(props: Props) {
 
         if (connection && accountAddress) {
             try {
-                const [payload, serializedMessage] = await generateMessage(
-                    newStatus,
-                    itemID,
-                    expiryTimeSignature,
-                    nextNonce,
-                );
+                const [payload, serializedMessage] = generateMessage(newStatus, itemID, expiryTimeSignature, nextNonce);
 
                 const permitSignature = await connection.signMessage(accountAddress, {
                     type: 'BinaryMessage',

diff --git a/trackAndTrace/frontend/src/components/Explorer.tsx b/trackAndTrace/frontend/src/components/Explorer.tsx
@@ -3,20 +3,20 @@ import { Alert, Button, Form } from 'react-bootstrap';
 import { useForm, useWatch } from 'react-hook-form';
 import * as constants from '../constants';
 
-type ChangeItem = {
+interface ChangeItem {
     block_time: string;
     transaction_hash: string;
     new_status: string;
-    additional_data: { bytes: Array<number> };
+    additional_data: { bytes: number[] };
     event_index: number;
     item_id: number;
-};
+}
 
-type CreateItem = {
+interface CreateItem {
     block_time: string;
     transaction_hash: string;
     event_index: number;
-};
+}
 
 /**
  * This function gets the historical ItemStatusChangedEvents for a given itemID.
@@ -29,7 +29,7 @@ async function getItemStatusChangedEvents(itemID: number, setItemChanged: Dispat
     const response = await fetch(`api/getItemStatusChangedEvents`, {
         method: 'POST',
         headers: new Headers({ 'content-type': 'application/json' }),
-        body:    JSON.stringify({
+        body: JSON.stringify({
             item_id: Number(itemID),
             limit: 30,
             offset: 0,
@@ -79,9 +79,9 @@ async function getItemCreatedEvent(itemID: number, setItemCreated: Dispatch<Crea
 }
 
 export function Explorer() {
-    type FormType = {
+    interface FormType {
         itemID: number | undefined;
-    };
+    }
     const { control, register, formState, handleSubmit } = useForm<FormType>({ mode: 'all' });
 
     const [itemID] = useWatch({