[explorer] Fixes High Priority Dependabot Security Alerts

.github/workflows/explorer-client-prs.yml

@@ -27,17 +27,17 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: '16'
-          cache: 'npm'
-          cache-dependency-path: ./explorer/client/package-lock.json
-      - name: Install npm dependencies
+          cache: 'yarn'
+          cache-dependency-path: ./explorer/client/yarn.lock
+      - name: Install yarn dependencies
         working-directory: ./explorer/client
-        run: npm ci
+        run: yarn install 
       - name: Lint
         working-directory: ./explorer/client
-        run: npm run lint
+        run: yarn lint
       - name: Test
         working-directory: ./explorer/client
-        run: npm run test
+        run: yarn test
       - name: Build
         working-directory: ./explorer/client
-        run: npm run build
+        run: yarn build

explorer/client/README.md

@@ -6,61 +6,61 @@
 
 In the project directory, run:
 
-### `npm i`
+### `yarn install`
 
-Before running any of the following scripts `npm i` must run in order to install the necessary dependencies.
+Before running any of the following scripts `yarn install` must run in order to install the necessary dependencies.
 
 # How to Switch Environment
 
 The purpose of the SuiExplorer Client is to present data extracted from a real or theoretical Sui Network.
 
 What the 'Sui Network' is varies according to the environment variable `REACT_APP_DATA`.
 
-When running most of the below npm commands, the SuiExplorer Client will extract and present data from the Sui Network connected to the URL https://demo-rpc.sui.io.
+When running most of the below yarn commands, the SuiExplorer Client will extract and present data from the Sui Network connected to the URL https://demo-rpc.sui.io.
 
 If the environment variable `REACT_APP_DATA` is set to `static`, then the SuiExplorer will instead pull data from a local, static JSON dataset that can be found at `./src/utils/static/mock_data.json`.
 
 For example, suppose we wish to locally run the website using the static JSON dataset and not the API, then we would run the following:
 
 ```bash
-REACT_APP_DATA=static npm start
+REACT_APP_DATA=static yarn start
 ```
 
-Note that the command `npm run test` is the exception. Here the SuiExplorer will instead use the static JSON dataset. The tests have been written to specifically check the UI and not the API connection.
+Note that the command `yarn test` is the exception. Here the SuiExplorer will instead use the static JSON dataset. The tests have been written to specifically check the UI and not the API connection.
 
-## NPM Commands and what they do
+## Yarn Commands and what they do
 
-### `npm start`
+### `yarn start`
 
 Runs the app in the development mode.
 
 Open http://localhost:3000 to view it in the browser.
 
 The page will reload if you make edits. You will also see any lint errors in the console.
 
-### `npm run start:dev`
+### `yarn start:dev`
 
-Same as `npm start` but runs `prettier:fix:watch` to format the files.
+Same as `yarn start` but runs `prettier:fix:watch` to format the files.
 
-### `npm test`
+### `yarn test`
 
 Launches the test runner in the interactive watch mode.
 
-### `npm run build`
+### `yarn build`
 
 Builds the app for production to the `build` folder.
 
 It bundles React in production mode and optimizes the build for the best performance.
 
-### `npm run lint`
+### `yarn lint`
 
 Run linting check (prettier/eslint/stylelint).
 
-### `npm run lint:fix`
+### `yarn lint:fix`
 
 Run linting check but also try to fix any issues.
 
-### `npm run prettier:fix:watch`
+### `yarn prettier:fix:watch`
 
 Run prettier in watch mode and format any file that changes. (Also runs prettier once in the beginning for all the files)\
 It can be useful during development to format automatically all the files that change.