Subscribers API updates

.dockerignore

@@ -2,4 +2,5 @@ backend/vendor
 backend/var
 frontend/.svelte-kit
 frontend/node_modules
-frontend/build
+frontend/build
+embed/node_modules

.github/workflows/ci.yaml

@@ -108,16 +108,11 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v3
 
-      - name: Install Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: "24.9.0"
-
       - name: Archive
-        run: cd archive && npm ci && npm run lint
+        run: docker build -t archive-dev . --target archive-dev && docker run archive-dev npm run lint
 
       - name: Embed
-        run: cd embed && npm ci && npm run lint
+        run: docker build -t embed-dev . --target embed-dev && docker run embed-dev npm run lint
 
       - name: Frontend
-        run: cd frontend && npm ci && npm run lint
+        run: docker build -t frontend-dev . --target frontend-dev && docker run frontend-dev npm run lint

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+    "[svelte]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[typescript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+}

DEV.md

@@ -0,0 +1,12 @@
+## Code Quality
+
+```bash
+# php tests (use --filter to run specific tests)
+docker compose run --rm backend vendor/bin/phpunit
+
+# phpstan
+docker compose run --rm backend vendor/bin/phpstan --memory-limit=1G
+
+# prettier
+docker compose run --rm frontend npm run format
+```

Dockerfile

@@ -15,6 +15,7 @@ WORKDIR /app/frontend
 COPY frontend/package.json \
     frontend/svelte.config.js \
     frontend/vite.config.ts \
+    frontend/.prettierrc frontend/.prettierignore \
     frontend/tsconfig.json /app/frontend/
 # copy code
 COPY frontend/src /app/frontend/src
@@ -46,6 +47,7 @@ WORKDIR /app/archive
 COPY archive/package.json archive/package-lock.json \
     archive/svelte.config.js \
     archive/vite.config.ts \
+    archive/.prettierrc archive/.prettierignore \
     archive/tsconfig.json /app/archive/
 # copy code
 COPY archive/src /app/archive/src
@@ -85,6 +87,7 @@ COPY embed/package.json embed/package-lock.json \
     embed/tsconfig.json \
     embed/tsconfig.app.json \
     embed/tsconfig.node.json \
+    embed/.prettierrc embed/.prettierignore \
     /app/embed/
 
 COPY embed/src /app/embed/src

archive/src/lib/actions/subscriptionActions.ts

@@ -14,19 +14,9 @@ interface UnsubscribeResponse {
 	lists: List[];
 }
 
-export function unsubscribe(token: string) {
+export function changePreferences(token: string, list_ids: number[]) {
 	return publicApi.post<UnsubscribeResponse>({
-		endpoint: SUBSCRIBER_PREFIX + '/unsubscribe',
-		data: { token }
-	});
-}
-
-export function resubscribe(list_ids: number[], token: string) {
-	return publicApi.patch<void>({
-		endpoint: SUBSCRIBER_PREFIX + '/resubscribe',
-		data: {
-			list_ids,
-			token
-		}
+		endpoint: SUBSCRIBER_PREFIX + '/preferences',
+		data: { token, list_ids }
 	});
 }

archive/src/routes/unsubscribe/+page.svelte

@@ -7,7 +7,7 @@
 	import IconEyeglasses from '@hyvor/icons/IconEyeglasses';
 	import { newsletterStore, listsStore } from '$lib/archiveStore';
 	import Resubscribe from './Resubscribe.svelte';
-	import { unsubscribe } from '$lib/actions/subscriptionActions';
+	import { changePreferences } from '$lib/actions/subscriptionActions';
 
 	let isLoading = $state(true);
 	let previewMode = $state(false);
@@ -32,7 +32,7 @@
 			return;
 		}
 
-		unsubscribe(token)
+		changePreferences(token, [])
 			.then((data) => {
 				listsStore.set(data.lists);
 			})
@@ -63,9 +63,9 @@
 		{:else}
 			<Notice
 				heading="Unsubscribe successful"
-				message="You have unsubscribed from all lists of <strong>{$newsletterStore.name}</strong>.
+				message="You've been unsubscribed from <strong>{$newsletterStore.name}</strong>.
                     <br />
-                    If this was a mistake, you can easily resubscribe below. Thank you."
+                    If you change your mind, you can resubscribe below."
 				icon={IconEnvelopeSlash}
 			>
 				<Resubscribe lists={$listsStore} {token} bind:error />

archive/src/routes/unsubscribe/Resubscribe.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-	import { slide } from 'svelte/transition';
 	import type { List } from '$lib/types';
 	import Switch from './Switch.svelte';
 	import Button from '../@components/Button.svelte';
-	import { resubscribe } from '$lib/actions/subscriptionActions';
+	import { changePreferences } from '$lib/actions/subscriptionActions';
+	import { fade } from 'svelte/transition';
 
 	interface Props {
 		lists: List[];
@@ -13,7 +13,9 @@
 
 	let { lists, token, error = $bindable() }: Props = $props();
 
-	let selectedListsIds: number[] = $state(lists.map((list) => list.id));
+	let selectedListsIds: number[] = $state([]);
+	let saving = $state(false);
+	let saved = $state(false);
 
 	function handleListSwitch(listId: number) {
 		return (event: Event) => {
@@ -40,56 +42,55 @@
 			return;
 		}
 
-		resubscribe(selectedListsIds, token).catch((e) => {
-			error = e.message || 'An unexpected error occurred';
-		});
+		saving = true;
+
+		changePreferences(token, selectedListsIds)
+			.then(() => {
+				saved = true;
+				setTimeout(() => {
+					saved = false;
+				}, 2000);
+			})
+			.catch((e) => {
+				error = e.message || 'An unexpected error occurred';
+			})
+			.finally(() => {
+				saving = false;
+			});
 	}
 </script>
 
 <div class="resubscribe">
-	<div class="lists" transition:slide={{ duration: 400 }} class:hidden={lists.length === 0}>
+	<div class="lists" class:hidden={lists.length === 0}>
 		{#each lists as list (list.id)}
 			<label class="list">
 				<div class="list-name-description">
 					<div class="list-name">{list.name}</div>
 					<div class="list-description">{list.description}</div>
 				</div>
-				<Switch
-					checked={selectedListsIds.includes(list.id)}
-					onchange={handleListSwitch(list.id)}
-				/>
+				<Switch checked={selectedListsIds.includes(list.id)} onchange={handleListSwitch(list.id)} />
 			</label>
 		{/each}
 	</div>
 
 	<div class="select">
-		<Button
-			color="var(--hp-accent-text-light)"
-			backgroundColor="transparent"
-			size="x-small"
-			style="font-weight: 500;"
-			onclick={handleSelectAll}
-		>
-			Select all
-		</Button>
-		<Button
-			color="var(--hp-accent-text-light)"
-			backgroundColor="transparent"
-			size="x-small"
-			style="font-weight: 500;"
-			onclick={handleDeselectAll}
-		>
-			Deselect all
-		</Button>
+		<button onclick={handleDeselectAll}>Deselect</button>
+		<button onclick={handleSelectAll}>Select all</button>
 	</div>
 
-	<Button size="small" onclick={handleSave}>Save preferences</Button>
+	<div>
+		<Button onclick={handleSave} disabled={saving}>Save preferences</Button>
+	</div>
+
+	{#if saved}
+		<div class="saved" transition:fade>Preferences saved</div>
+	{/if}
 </div>
 
 <style>
 	.lists {
 		margin: auto;
-		width: 70%;
+		margin-top: 30px;
 	}
 
 	.list {
@@ -114,10 +115,24 @@
 	}
 
 	.select {
+		margin-top: 10px;
+		margin-bottom: 30px;
 		display: flex;
-		flex-direction: column;
-		gap: 2px;
-		margin: 5px 9% 10px auto;
-		width: 20%;
+		gap: 6px;
+		justify-content: flex-end;
+	}
+
+	.select button {
+		font-size: 12px;
+	}
+
+	.select button:hover {
+		text-decoration: underline;
+	}
+
+	.saved {
+		margin-top: 10px;
+		font-size: 14px;
+		color: var(--hp-text-light);
 	}
 </style>

backend/.env

@@ -31,7 +31,6 @@ URL_ARCHIVE=https://hyvorpost.email
 # One of: debug, info, notice, warning, error, critical, alert, emergency
 LOG_LEVEL=info
 
-
 ### ============ HYVOR CLOUD ============ ###
 
 # Deployment type
@@ -54,13 +53,11 @@ COMMS_KEY=
 # @deprecated. Migrate to DEPLOYMENT env
 IS_CLOUD=true
 
-
 ### ============ DATABASE ============ ###
 
 # PostgreSQL database is the single source of truth
 DATABASE_URL=""
 
-
 ### ============ MAIL ============ ###
 
 # Hyvor Relay configuration
@@ -87,7 +84,6 @@ NOTIFICATION_MAIL_REPLY_TO=
 # If not set, if will fallback to RELAY_API_KEY
 NOTIFICATION_RELAY_API_KEY=
 
-
 ### ============ FILE STORAGE ============ ###
 
 # You can use any S3-compatibly storage like
@@ -100,14 +96,17 @@ S3_ACCESS_KEY_ID=key-id
 S3_SECRET_ACCESS_KEY=access-key
 S3_BUCKET=hyvor-post
 
+### ============ INTEGRATIONS ============ ###
+
+# Sentry-compatible DSN for error tracking
+SENTRY_DSN=
 
 ### ============ SCALING ============ ###
 
 # Set the number of workers to run
 # Default is x2 CPUs
 WORKERS=
 
-
 ### ============ DOCKER IMAGE ============ ###
 
 # Defaults (do not change or add to docs):

backend/.env.dev

@@ -13,16 +13,14 @@ HYVOR_PRIVATE_INSTANCE=http://hyvor.internal
 COMMS_KEY=BXnQt5EOIT3NwHYvJ0diIa+6iK1YeVTjQfz6XVSFHFg=
 HYVOR_FAKE=1
 
-###> symfony/mailer ###
-# MAILER_DSN=null://null
-MAILER_DSN=smtp://user:pass@hyvor-service-mailpit:1025
-###< symfony/mailer ###
 NOTIFICATION_MAIL_FROM_ADDRESS=notifications@hyvor.localhost
 NOTIFICATION_MAIL_FROM_NAME=HYVOR
 NOTIFICATION_MAIL_REPLY_TO=support@hyvor.localhost
 
 RELAY_URL=
 RELAY_API_KEY=
+# dev emails sent here
+MAILER_DSN=smtp://user:pass@hyvor-service-mailpit:1025
 
 ###> filesystem ###
 FILESYSTEM_ADAPTER=file

backend/.gitignore

@@ -2,6 +2,7 @@
 /.env.dev.local
 /.env.local.php
 /.env.*.local
+/.env.local
 /config/secrets/prod/prod.decrypt.private.php
 /public/bundles/
 /var/

backend/composer.json

@@ -45,7 +45,8 @@
     "twig/cssinliner-extra": "^3.21",
     "twig/extra-bundle": "^3.21",
     "symfony/dom-crawler": "7.4.*",
-    "zenstruck/messenger-monitor-bundle": "^0.6.0"
+    "zenstruck/messenger-monitor-bundle": "^0.6.0",
+    "sentry/sentry-symfony": "^5.9"
   },
   "bump-after-update": true,
   "sort-packages": true,