Merge pull request #1765 from trilitech/migrate-to-pnpm

Migrate to pnpm from yarn

.github/workflows/deploy-to-github-pages.yaml

@@ -13,21 +13,21 @@ jobs:
     steps:
       - uses: actions/checkout@v4
 
-      - name: Setup yarn
-        run: |
-          corepack enable
-          yarn set version stable
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9.7.1
 
       - uses: actions/setup-node@v4
         with:
           node-version: 20.x
-          cache: "yarn"
+          cache: "pnpm"
 
       - name: Install packages
-        run: yarn install --immutable
+        run: pnpm install
 
       - name: Build
-        run: yarn build
+        run: pnpm build
 
       - name: Deploy Github Pages
         uses: peaceiris/actions-gh-pages@v4

.github/workflows/e2e.yaml

@@ -17,22 +17,22 @@ jobs:
       - name: Pull docker images
         run: docker compose pull --quiet &
 
-      - name: Setup yarn
-        run: |
-          corepack enable
-          yarn set version stable
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9.7.1
 
       - uses: actions/setup-node@v4
         with:
           node-version: 20.x
-          cache: "yarn"
+          cache: "pnpm"
 
-      - run: yarn install --immutable
+      - run: pnpm install
 
       - name: Install Playwright browser
-        run: yarn workspace @umami/desktop-e2e playwright install chromium --with-deps
+        run: pnpm --filter=./apps/desktop-e2e exec playwright install chromium --with-deps
 
-      - run: yarn test:e2e
+      - run: pnpm test:e2e
 
       - name: Cucumber Report to Annotations
         uses: deblockt/[email protected]

.github/workflows/test.yaml

@@ -22,21 +22,21 @@ jobs:
       - uses: jwalton/gh-find-current-pr@v1
         id: findPr
 
-      - name: Setup yarn
-        run: |
-          corepack enable
-          yarn set version stable
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9.7.1
 
       - uses: actions/setup-node@v4
         with:
           node-version: 20.x
-          cache: "yarn"
+          cache: "pnpm"
 
-      - run: yarn install --immutable
+      - run: pnpm install
 
-      - run: yarn ci
+      - run: pnpm run ci
 
-      - run: yarn test --concurrency 1
+      - run: pnpm run test --concurrency 1
 
       - name: Post Jest Coverage Comment
         uses: MishaKav/jest-coverage-comment@main

.gitignore

@@ -5,11 +5,6 @@ node_modules/
 .pnp/
 .pnp.*
 .yarn/*
-!.yarn/patches
-!.yarn/plugins
-!.yarn/releases
-!.yarn/sdks
-!.yarn/versions
 
 # testing
 coverage/

README.md

@@ -20,10 +20,10 @@ This is a monorepo which contains all the packages related to Umami.
 ## Initial setup
 
 - Node.js version is 20.x, you can use [NVM](https://github.com/nvm-sh/nvm) to install it and select for this project.
-- Yarn 4.x should be used, you can find the installation guide [here](https://yarnpkg.com/getting-started/install).
-- `yarn install` to install all the dependencies
+- pnpm should be used, you can find the installation guide [here](https://pnpm.io/installation).
+- `pnpm install` to install all the dependencies
 - `npm install turbo --global` to be able to use the [turborepo](https://turbo.build/repo/docs) tooling
-- `yarn playwright install --with-deps chromium` to be able to run e2e tests
+- `pnpm playwright install --with-deps chromium` to be able to run e2e tests
 
 ## Dev workflow
 
@@ -32,7 +32,7 @@ Here's a [guide](https://turbo.build/repo/docs/crafting-your-repository/running-
 
 ## Testing
 
-In order to run all tests in all projects it's enough to run `yarn test` or `turbo test` in the root directory. But, inside the packages
-you should use `turbo test`. It will bundle all the dependencies and only then will run the tests whilst `yarn test` will only attempt to run the tests.
+In order to run all tests in all projects it's enough to run `pnpm test` or `turbo test` in the root directory. But, inside the packages
+you should use `turbo test`. It will bundle all the dependencies and only then will run the tests whilst `pnpm test` will only attempt to run the tests.
 
 Coverage info will be provided in several formats, including HTML at `<package_name>/coverage/lcov-report`.

apps/desktop-e2e/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@umami/desktop-e2e",
-  "packageManager": "[email protected].1",
+  "packageManager": "[email protected].1",
   "scripts": {
     "clean": "rimraf dist .turbo",
     "check-circular-deps": "madge --extensions ts --circular src/*",
-    "check-types:watch": "yarn check-types --watch",
+    "check-types:watch": "pnpm check-types --watch",
     "check-types": "tsc",
     "format:ci": "prettier --ignore-path ../../.gitignore --check .",
     "format": "prettier --ignore-path ../../.gitignore --write .",
@@ -14,6 +14,7 @@
     "test:e2e": "start-server-and-test \"turbo preview --filter=@umami/desktop\" http://127.0.0.1:3000 cucumber-js"
   },
   "devDependencies": {
+    "@types/jest": "^29.5.12",
     "@types/lodash": "^4",
     "@types/node": "20.14.11",
     "@umami/eslint-config": "workspace:^",

apps/desktop/README.md

@@ -6,53 +6,53 @@ Umami Desktop is an Electron-based wallet.
 
 In the project directory, you can run:
 
-### `yarn dev`
+### `pnpm dev`
 
 Runs the app in the development mode.\
 Open [http://127.0.0.1:3000](http://127.0.0.1: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.
 
-### `yarn test`
+### `pnpm test`
 
 Launches the test runner in the interactive watch mode.\
 We use [jest](https://jestjs.io/) as the test runner.
 
-### `yarn test:e2e`
+### `pnpm test:e2e`
 
 This will run the e2e tests for you. Please make sure that you have docker & docker-compose [installed](https://docs.docker.com/desktop/install/mac-install/).
 
-Note: the test runner expects the server with the app running at localhost:3000. You can use the dev server (`yarn dev`) for that.
+Note: the test runner expects the server with the app running at localhost:3000. You can use the dev server (`pnpm dev`) for that.
 On CI we build the app and serve the production build on the same port (check `.github/workflows/e2e.yaml` for details).
 
-When you're working on a specific scenario, you can mark it with a `@focus` tag and use `yarn test:e2e:focus` to run it exclusively.
+When you're working on a specific scenario, you can mark it with a `@focus` tag and use `pnpm test:e2e:focus` to run it exclusively.
 
-### `yarn build`
+### `pnpm build`
 
 Builds the app for production to the `build` folder.\
 It correctly bundles React in production mode and optimizes the build for the best performance.
 
-### `yarn electron:start`
+### `pnpm electron:start`
 
 Runs the electron app in the development mode.
 In order to get the dev tools work please make sure to set the `devTools` to `true` in the `webPreferences` in `public/electron.js`
-Note: you still have to have your `yarn dev` running in a separate terminal
+Note: you still have to have your `pnpm dev` running in a separate terminal
 
-### `yarn electron:package:(mac|win|linux)`
+### `pnpm electron:package:(mac|win|linux)`
 
-Build electron app for desired platform (don't forget to run `yarn build` before running this one)
+Build electron app for desired platform (don't forget to run `pnpm build` before running this one)
 
 For the mac build you'd need signing credentials & the certificate. Alongside that you need to obtain an [Apple app specific password](https://support.apple.com/en-gb/102654). The app will be signed automatically during the packaging process.
 
-For Windows you need the USB dongle with the certificate. You package the app using `yarn electron:package:win` and then run
+For Windows you need the USB dongle with the certificate. You package the app using `pnpm electron:package:win` and then run
 
 ```
 signtool sign /tr http://timestamp.sectigo.com /td sha256 /fd sha256 /a '.\dist\<installer>.exe'
 ```
 
-To make yourself a debugging build run `yarn electron:package:mac:debug`. It will work only on your machine, but you'll be able to play around with it. For the same purpose you might find helpful enabling devTools in `public/electron.js` before running `yarn build` and this command.
+To make yourself a debugging build run `pnpm electron:package:mac:debug`. It will work only on your machine, but you'll be able to play around with it. For the same purpose you might find helpful enabling devTools in `public/electron.js` before running `pnpm build` and this command.
 
-### `yarn docs`
+### `pnpm docs`
 
 It will generate documentation in HTML and put it into the `docs` folder. Open `docs/index.html`

apps/desktop/package.json

@@ -13,16 +13,16 @@
   "type": "commonjs",
   "main": "build/electron.js",
   "scripts": {
-    "audit": "yarn npm audit --exclude @toruslabs/customauth",
+    "audit": "pnpm audit --exclude @toruslabs/customauth",
     "build": "vite build",
     "clean": "rimraf build dist .turbo",
     "check-circular-deps": "madge --circular src/index.tsx",
-    "check-types:watch": "yarn check-types --watch",
+    "check-types:watch": "pnpm check-types --watch",
     "check-types": "tsc",
     "dev": "vite dev --host 127.0.0.1 --open",
     "docs": "typedoc",
     "electron:package:linux": "electron-builder -l",
-    "electron:package:mac:debug": "DEBUG=true yarn build --mode dev && sed -i='' 's@devTools: false@devTools: true@g' build/electron.js && yarn electron:package:mac -c electron-builder.dev.yml && rm -rf build",
+    "electron:package:mac:debug": "DEBUG=true pnpm build --mode dev && sed -i='' 's@devTools: false@devTools: true@g' build/electron.js && pnpm electron:package:mac -c electron-builder.dev.yml && rm -rf build",
     "electron:package:mac": "electron-builder -m",
     "electron:package:win": "electron-builder -w",
     "electron:start": "electronmon .",
@@ -31,7 +31,7 @@
     "lint:ci": "eslint src --ext .js,.jsx,.ts,.tsx --max-warnings=0",
     "lint": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
     "preview": "vite preview --host 127.0.0.1 --port 3000",
-    "test:watch": "cross-env DEV=true yarn test --watch",
+    "test:watch": "cross-env DEV=true pnpm test --watch",
     "test": "cross-env TZ=CET jest",
     "theme:watch": "chakra-cli tokens src/style/theme.ts --watch",
     "theme": "chakra-cli tokens src/style/theme.ts"
@@ -73,6 +73,7 @@
     "@types/babel__preset-env": "^7.9.7",
     "@types/identity-obj-proxy": "^3.0.2",
     "@types/jest": "^29.5.12",
+    "@types/lodash": "^4",
     "@types/md5": "^2.3.5",
     "@types/node": "20.14.11",
     "@types/papaparse": "^5.3.14",
@@ -149,10 +150,10 @@
     "typescript": "5.5.4",
     "vite": "^5.4.2",
     "vite-plugin-checker": "^0.7.2",
-    "vite-plugin-node-polyfills": "^0.22.0",
+    "vite-plugin-node-polyfills": "^0.17.0",
     "zod": "^3.23.8"
   },
-  "packageManager": "[email protected].1",
+  "packageManager": "[email protected].1",
   "dependencies": {
     "electron-updater": "6.3.3"
   }

apps/embed-iframe/README.md

@@ -25,21 +25,21 @@ For any operation, users can choose to approve or decline the request, which giv
 
 In the project directory, you can run:
 
-### `yarn build`
+### `pnpm build`
 
 Builds the app for production to the `dist` folder.\
 It correctly bundles React in production mode and optimizes the build for the best performance.
 
-### `yarn dev`
+### `pnpm dev`
 
 Runs the app in development mode at [http://localhost:5173/](http://localhost:5173/).
 
 The page will automatically reload if you make edits. You will also see any lint errors displayed in the console.
 
-### `yarn preview`
+### `pnpm preview`
 
 This command allows you to locally preview the production build.
 
-### `yarn format` & `yarn lint`
+### `pnpm format` & `pnpm lint`
 
 These commands apply formatting rules to the codebase.

apps/embed-iframe/package.json

@@ -23,6 +23,7 @@
     "@chakra-ui/react": "^2.8.2",
     "@chakra-ui/styled-system": "2.9.2",
     "@chakra-ui/system": "^2.6.2",
+    "@chakra-ui/theme-tools": "^2.1.2",
     "@emotion/react": "^11.13.0",
     "@emotion/styled": "^11.13.0",
     "@taquito/signer": "^20.0.0",
@@ -54,7 +55,7 @@
     "sass": "^1.77.8",
     "typescript": "5.5.4",
     "vite": "^5.4.2",
-    "vite-plugin-node-polyfills": "^0.22.0",
+    "vite-plugin-node-polyfills": "^0.17.0",
     "vite-plugin-svgr": "^4.2.0"
   }
 }

apps/web/.storybook/main.ts

@@ -5,7 +5,7 @@ import { join, dirname } from "path";
 
 /**
  * This function is used to resolve the absolute path of a package.
- * It is needed in projects that use Yarn PnP or are set up within a monorepo.
+ * It is needed in projects that use pnpm PnP or are set up within a monorepo.
  */
 function getAbsolutePath(value: string): any {
   return dirname(require.resolve(join(value, "package.json")));

apps/web/package.json

@@ -4,19 +4,19 @@
   "version": "0.0.1",
   "type": "module",
   "scripts": {
-    "audit": "yarn npm audit --exclude @toruslabs/customauth",
+    "audit": "pnpm audit --exclude @toruslabs/customauth",
     "build": "vite build",
     "clean": "rimraf dist .turbo",
     "check-circular-deps": "madge --circular src/main.tsx",
-    "check-types:watch": "yarn check-types --watch",
+    "check-types:watch": "pnpm check-types --watch",
     "check-types": "tsc",
     "dev": "vite --host 127.0.0.1 --open",
     "format:ci": "prettier --ignore-path ../../.gitignore --check .",
     "format": "prettier --ignore-path ../../.gitignore --write .",
     "lint:ci": "eslint src --ext .ts,.tsx --max-warnings=0",
     "lint": "eslint src --ext .ts,.tsx --fix",
     "preview": "vite preview",
-    "test:watch": "cross-env DEV=true yarn test --watch",
+    "test:watch": "cross-env DEV=true pnpm test --watch",
     "test": "cross-env TZ=CET jest",
     "storybook": "storybook dev -p 6006",
     "build:storybook": "storybook build"
@@ -104,6 +104,7 @@
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.12",
+    "@types/lodash": "^4",
     "@types/node": "20.14.11",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
@@ -116,15 +117,16 @@
     "eslint": "^8.57.0",
     "eslint-plugin-storybook": "^0.8.0",
     "jest": "^29.7.0",
+    "jest-canvas-mock": "^2.5.2",
     "jest-transformer-svg": "^2.0.2",
     "madge": "^8.0.0",
     "prettier": "^3.3.2",
     "rimraf": "^6.0.1",
     "storybook": "^8.2.9",
     "typescript": "^5.5.4",
     "vite": "^5.4.2",
-    "vite-plugin-node-polyfills": "^0.22.0",
+    "vite-plugin-node-polyfills": "^0.17.0",
     "vite-plugin-svgr": "^4.2.0"
   },
-  "packageManager": "[email protected].1"
+  "packageManager": "[email protected].1"
 }