chore: use pnpm instead of npm (#227)

.github/dependabot.yml

@@ -3,10 +3,4 @@ updates:
   - package-ecosystem: github-actions
     directory: /
     schedule:
-      interval: 'weekly'
-
-  - package-ecosystem: 'npm'
-    directory: '/'
-    schedule:
-      interval: 'weekly'
-    versioning-strategy: increase
+      interval: 'weekly'

.github/workflows/check.yaml

@@ -16,26 +16,28 @@ jobs:
       - uses: actions/checkout@v3
         with:
           fetch-depth: 0
+
       - name: Use Node.js 18
         uses: actions/setup-node@v3
         with:
           node-version: 18
 
-      - name: Install npm deps
-        # Hardhat is missing some dependencies on linux due to https://github.com/npm/cli/issues/4828
-        run: rm -rf package-lock.json && npm install
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 7
 
-      - name: Install browser runners
-        run: npx playwright install
+      - name: Install dependenciess
+        run: pnpm install --frozen-lockfile
 
       - name: Download snark-artifacts
-        run: npm run download:snark-artifacts --workspaces --if-present
+        working-directory: packages/contracts
+        run: pnpm run download:snark-artifacts
 
       - name: Test
-        run: npm run test --workspaces --if-present
+        run: pnpm run test
 
       - name: Check the build
-        run: npm run check --workspaces --if-present
+        run: pnpm run check
 
       - name: Code linting
-        run: npm run lint --workspaces --if-present
+        run: pnpm run lint

.github/workflows/release.yaml

@@ -17,11 +17,17 @@ jobs:
         with:
           node-version: 18
 
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 7
+
       - name: Install npm deps
-        run: npm ci
+        working-directory: packages/ui
+        run: pnpm i --frozen-lockfile
 
       - name: Build
-        run: cd packages/ui && npm run build
+        working-directory: packages/ui
+        run: pnpm run build
 
       - uses: aquiladev/ipfs-action@v0.3.1
         with:

lerna.json

@@ -1,5 +0,0 @@
-{
-  "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "useWorkspaces": true,
-  "version": "0.0.0"
-}

package.json

@@ -1,13 +1,19 @@
 {
-  "name": "root",
+  "name": "@logos-labs/kurate-monorepo",
   "private": true,
+  "scripts": {
+    "preinstall": "npx only-allow pnpm",
+    "test": "pnpm --stream -r test",
+    "check": "pnpm --stream -r check",
+    "lint": "pnpm --stream -r lint"
+  },
   "workspaces": [
     "packages/*"
   ],
-  "devDependencies": {
-    "lerna": "^6.4.1"
-  },
   "dependencies": {
     "dotenv": "^16.0.3"
+  },
+  "engines": {
+    "node": "16.x - 19.x"
   }
 }

packages/contracts/package.json

@@ -4,11 +4,11 @@
     "private": true,
     "main": "index.js",
     "scripts": {
-        "start": "npm run compile && npm run deploy -- --network localhost",
+        "start": "pnpm run compile && pnpm run deploy -- --network localhost",
         "start:blockchain": "hardhat node",
         "compile": "hardhat compile",
         "download:snark-artifacts": "hardhat run scripts/download-snark-artifacts.ts",
-        "deploy": "npm run compile && hardhat deploy",
+        "deploy": "pnpm run compile && hardhat deploy",
         "test": "hardhat test",
         "test:report-gas": "REPORT_GAS=true hardhat test",
         "test:coverage": "hardhat coverage",
@@ -18,6 +18,7 @@
     "devDependencies": {
         "@nomicfoundation/hardhat-chai-matchers": "^1.0.5",
         "@nomiclabs/hardhat-ethers": "^2.2.2",
+        "@openzeppelin/contracts": "^4.8.1",
         "@semaphore-protocol/group": "3.0.0",
         "@semaphore-protocol/hardhat": "3.0.0",
         "@semaphore-protocol/identity": "3.0.0",
@@ -37,10 +38,12 @@
         "solhint": "^3.3.8",
         "solidity-coverage": "^0.8.2",
         "ts-node": "^10.9.1",
-        "typechain": "^8.1.1"
+        "typechain": "^8.1.1",
+        "typescript": "^4.9.5"
     },
     "dependencies": {
-        "@semaphore-protocol/contracts": "3.0.0"
+        "@semaphore-protocol/contracts": "3.0.0",
+        "@zk-kit/incremental-merkle-tree.sol": "^1.3.3"
     },
     "config": {
         "solidity": {

packages/ui/package.json

@@ -6,18 +6,19 @@
 		"dev": "vite dev",
 		"build": "vite build",
 		"preview": "vite preview",
-		"test": "npm run test:unit && npm run test:playwright",
-		"test:unit": "vitest",
-		"test:playwright": "playwright test",
+		"test": "vitest",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"lint": "prettier --plugin-search-dir . --check . && eslint .",
 		"format": "prettier --plugin-search-dir . --write . && eslint . --fix"
 	},
 	"devDependencies": {
+		"@ethersproject/abi": "^5.7.0",
+		"@ethersproject/providers": "^5.7.2",
 		"@fontsource/source-code-pro": "^4.5.14",
 		"@fontsource/source-sans-pro": "^4.5.11",
 		"@fontsource/source-serif-pro": "^4.5.9",
+		"@multiformats/multiaddr": "^11.4.0",
 		"@playwright/test": "1.30.0",
 		"@semaphore-protocol/group": "3.0.0",
 		"@semaphore-protocol/identity": "3.0.0",

packages/ui/playwright.config.ts

@@ -1,11 +0,0 @@
-import type { PlaywrightTestConfig } from '@playwright/test'
-
-const config: PlaywrightTestConfig = {
-	webServer: {
-		command: 'npm run build && npm run preview',
-		port: 4173,
-	},
-	testDir: './tests/playwright',
-}
-
-export default config

packages/ui/src/lib/components/persona.svelte

@@ -12,7 +12,9 @@
 </script>
 
 <Card on:click>
-	<div class="picture"><img src={picture ? adapter.getPicture(picture) :undefined} alt="persona" /></div>
+	<div class="picture">
+		<img src={picture ? adapter.getPicture(picture) : undefined} alt="persona" />
+	</div>
 	<div class="details">
 		<div class="header">{name}</div>
 		<div class="description">{pitch}</div>

packages/ui/src/lib/components/persona_detail.svelte

@@ -29,7 +29,9 @@
 	async function resizePersonaPicture(p?: File) {
 		try {
 			picture = p
-				? await adapter.uploadPicture(await clipAndResize(p, MAX_DIMENSIONS.PICTURE.width, MAX_DIMENSIONS.PICTURE.height))
+				? await adapter.uploadPicture(
+						await clipAndResize(p, MAX_DIMENSIONS.PICTURE.width, MAX_DIMENSIONS.PICTURE.height),
+				  )
 				: picture
 		} catch (error) {
 			console.error(error)
@@ -39,7 +41,9 @@
 	async function resizePersonaCover(c?: File) {
 		try {
 			cover = c
-				? await adapter.uploadPicture(await clipAndResize(c, MAX_DIMENSIONS.COVER.width, MAX_DIMENSIONS.COVER.height))
+				? await adapter.uploadPicture(
+						await clipAndResize(c, MAX_DIMENSIONS.COVER.width, MAX_DIMENSIONS.COVER.height),
+				  )
 				: cover
 		} catch (error) {
 			console.error(error)

packages/ui/src/lib/components/post.svelte

@@ -15,13 +15,13 @@
 		<div class="imgs">
 			{#each post.images as image, index}
 				{#if index <= 5}
-				<div>
-					<img src={adapter.getPicture(image)} alt="post" />
-					<!-- TODO: add check and functionality to 'more images' badge -->
-					{#if index === 5 && post.images.length > 6}
-						<div class="more">+{post.images.length - 6}</div>
-					{/if}
-				</div>
+					<div>
+						<img src={adapter.getPicture(image)} alt="post" />
+						<!-- TODO: add check and functionality to 'more images' badge -->
+						{#if index === 5 && post.images.length > 6}
+							<div class="more">+{post.images.length - 6}</div>
+						{/if}
+					</div>
 				{/if}
 			{/each}
 		</div>
@@ -30,7 +30,7 @@
 			<div class="faded">{formatDateAndTime(post.timestamp)}</div>
 		</div>
 		<!-- FIXME: not sure this is correct -->
-		<div style='display: flex; flex-direction: row;'>
+		<div style="display: flex; flex-direction: row;">
 			<slot />
 		</div>
 	</div>

packages/ui/src/lib/components/post_new.svelte

@@ -33,8 +33,14 @@
 		try {
 			const imgs = []
 			for (let i = 0; i < files.length; i++) {
-				imgs.push(await adapter.uploadPicture(
-					await resize(files[i], MAX_DIMENSIONS.POST_IMAGE.width, MAX_DIMENSIONS.POST_IMAGE.height)),
+				imgs.push(
+					await adapter.uploadPicture(
+						await resize(
+							files[i],
+							MAX_DIMENSIONS.POST_IMAGE.width,
+							MAX_DIMENSIONS.POST_IMAGE.height,
+						),
+					),
 				)
 			}
 			images = [...images, ...imgs]

packages/ui/src/routes/persona/[id]/+page.svelte

@@ -40,7 +40,7 @@
 	let unsubscribe: () => unknown
 
 	onMount(() => {
-		adapter.subscribePersonaPosts(groupId).then(unsub => unsubscribe = unsub)
+		adapter.subscribePersonaPosts(groupId).then((unsub) => (unsubscribe = unsub))
 	})
 
 	onDestroy(() => {
@@ -68,11 +68,7 @@
 	<div class={`header ${y > 0 ? 'scrolled' : ''}`}>
 		<Header title={persona.name} {onBack}>
 			{#if $profile.signer !== undefined}
-				<Button
-					variant="primary"
-					icon={Edit}
-					on:click={() => goto(ROUTES.POST_NEW(groupId))}
-				/>
+				<Button variant="primary" icon={Edit} on:click={() => goto(ROUTES.POST_NEW(groupId))} />
 			{:else}
 				<Button
 					variant="primary"
@@ -91,7 +87,9 @@
 		participantsCount={persona.participantsCount}
 		bind:picture={persona.picture}
 		bind:cover={persona.cover}
-		onBack={() => {showPending ? showPending = false : goto(ROUTES.HOME)}}
+		onBack={() => {
+			showPending ? (showPending = false) : goto(ROUTES.HOME)
+		}}
 	>
 		<svelte:fragment slot="button_top">
 			{#if $profile.signer !== undefined}
@@ -129,34 +127,34 @@
 
 		<svelte:fragment slot="button_other">
 			{#if !showPending}
-				<Button label="Review pending" icon={Hourglass} on:click={() => showPending = true} />
+				<Button label="Review pending" icon={Hourglass} on:click={() => (showPending = true)} />
 			{/if}
 		</svelte:fragment>
 
 		<SectionTitle title={showPending ? 'All pending posts' : 'All posts'}>
-		<svelte:fragment slot="buttons">
+			<svelte:fragment slot="buttons">
+				{#if $profile.signer !== undefined}
+					<Dropdown icon={SettingsView}>
+						<DropdownItem active={sortBy === 'date'} on:click={() => (sortBy = 'date')}>
+							Sort by date of creation
+						</DropdownItem>
+						<DropdownItem
+							active={sortBy === 'alphabetical'}
+							on:click={() => (sortBy = 'alphabetical')}
+						>
+							Sort by name (alphabetical)
+						</DropdownItem>
+					</Dropdown>
+					<Button
+						icon={sortAsc ? SortAscending : SortDescending}
+						on:click={() => (sortAsc = !sortAsc)}
+					/>
+				{/if}
+			</svelte:fragment>
 			{#if $profile.signer !== undefined}
-				<Dropdown icon={SettingsView}>
-					<DropdownItem active={sortBy === 'date'} on:click={() => (sortBy = 'date')}>
-						Sort by date of creation
-					</DropdownItem>
-					<DropdownItem
-						active={sortBy === 'alphabetical'}
-						on:click={() => (sortBy = 'alphabetical')}
-					>
-						Sort by name (alphabetical)
-					</DropdownItem>
-				</Dropdown>
-				<Button
-					icon={sortAsc ? SortAscending : SortDescending}
-					on:click={() => (sortAsc = !sortAsc)}
-				/>
+				<Search bind:filterQuery />
 			{/if}
-		</svelte:fragment>
-		{#if $profile.signer !== undefined}
-			<Search bind:filterQuery />
-		{/if}
-	</SectionTitle>
+		</SectionTitle>
 
 		{#if !personaPosts || personaPosts.loading}
 			<Container>
@@ -175,13 +173,27 @@
 				{#each showPending ? personaPosts.pending : personaPosts.approved as post, index}
 					<Post {post} on:click={() => !showPending && goto(ROUTES.PERSONA_POST(groupId, index))}>
 						{#if showPending}
-							{#if post.yourVote === '+'  && $profile.signer !== undefined}
-								<Button variant='secondary' label='You promoted this' />
+							{#if post.yourVote === '+' && $profile.signer !== undefined}
+								<Button variant="secondary" label="You promoted this" />
 							{:else if post.yourVote === '-' && $profile.signer !== undefined}
-								<Button variant='secondary' label='You demoted this' />
+								<Button variant="secondary" label="You demoted this" />
 							{:else}
-								<Button variant='secondary' label='Promote' disabled={$profile.signer === undefined} on:click={() => $profile.signer !== undefined && adapter.voteOnPost(groupId, index, '+', $profile.signer)} />
-								<Button variant='secondary' label='Demote' disabled={$profile.signer === undefined} on:click={() => $profile.signer !== undefined && adapter.voteOnPost(groupId, index, '-', $profile.signer)} />
+								<Button
+									variant="secondary"
+									label="Promote"
+									disabled={$profile.signer === undefined}
+									on:click={() =>
+										$profile.signer !== undefined &&
+										adapter.voteOnPost(groupId, index, '+', $profile.signer)}
+								/>
+								<Button
+									variant="secondary"
+									label="Demote"
+									disabled={$profile.signer === undefined}
+									on:click={() =>
+										$profile.signer !== undefined &&
+										adapter.voteOnPost(groupId, index, '-', $profile.signer)}
+								/>
 							{/if}
 						{/if}
 					</Post>

packages/ui/tests/playwright/test.ts

@@ -1,7 +0,0 @@
-import { ROUTES } from '../../src/lib/routes.js'
-import { expect, test } from '@playwright/test'
-
-test('index page has expected header', async ({ page }) => {
-	await page.goto(ROUTES.HOME)
-	expect(await page.textContent('h1')).toBe('Kurate')
-})

pnpm-workspace.yaml

@@ -0,0 +1,2 @@
+packages:
+  - 'packages/*'