init

.env.example

@@ -0,0 +1 @@
+DATABASE_URL=file:local.db

.gitignore

@@ -0,0 +1,29 @@
+node_modules
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
+/.svelte-kit
+/build
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
+.env
+.env.*
+!.env.example
+!.env.test
+
+# Vite
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
+
+# Paraglide
+src/lib/paraglide
+
+# SQLite
+*.db

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

.prettierignore

@@ -0,0 +1,10 @@
+# Package Managers
+package-lock.json
+pnpm-lock.yaml
+yarn.lock
+bun.lock
+bun.lockb
+
+# Miscellaneous
+/static/
+/drizzle/

.prettierrc.json5

@@ -0,0 +1,7 @@
+// $schema: https://json.schemastore.org/prettierrc
+
+{
+    semi: false,
+    singleQuote: true,
+    tabWidth: 2,
+}

README.md

@@ -0,0 +1,38 @@
+# sv
+
+Everything you need to build a Svelte project, powered by [`sv`](https://github.com/sveltejs/cli).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```sh
+# create a new project in the current directory
+npx sv create
+
+# create a new project in my-app
+npx sv create my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```sh
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+## Building
+
+To create a production version of your app:
+
+```sh
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.

__tests__/service.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, it } from 'bun:test'
+import { Effect } from 'effect'
+
+import * as DB from '../src/lib/server/db/DB'
+import { isNotNull } from 'drizzle-orm'
+import { User } from '../src/lib/server/db/user'
+
+describe('Service', () => {
+	it('should query stuff', async () => {
+		const testDb = Effect.gen(function* () {
+			const db = yield* DB.Db
+
+			const user: User[] = yield* db.use((db) =>
+				db.select().from(DB.tables.user).where(isNotNull(DB.tables.user.id)),
+			)
+
+			return user
+		})
+			.pipe(Effect.provide(DB.fromEnv))
+			.pipe(Effect.catchTag('DbError', (_e) => Effect.succeed([] as User[])))
+			.pipe(Effect.catchTag('ConfigError', (_e) => Effect.succeed([] as User[])))
+
+		const result = await Effect.runPromise(testDb)
+
+		expect(result).toHaveLength(0)
+	})
+})

drizzle.config.ts

@@ -0,0 +1,11 @@
+import { defineConfig } from 'drizzle-kit'
+
+if (!process.env.DATABASE_URL) throw new Error('DATABASE_URL is not set')
+
+export default defineConfig({
+	schema: './src/lib/server/db/schema.ts',
+	dialect: 'sqlite',
+	dbCredentials: { url: process.env.DATABASE_URL },
+	verbose: true,
+	strict: true
+})

drizzle/0000_clumsy_bill_hollister.sql

@@ -0,0 +1,15 @@
+CREATE TABLE `session` (
+	`id` text PRIMARY KEY NOT NULL,
+	`user_id` text NOT NULL,
+	`expires_at` integer NOT NULL,
+	FOREIGN KEY (`user_id`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
+);
+--> statement-breakpoint
+CREATE TABLE `user` (
+	`id` text PRIMARY KEY NOT NULL,
+	`age` integer,
+	`username` text NOT NULL,
+	`password_hash` text NOT NULL
+);
+--> statement-breakpoint
+CREATE UNIQUE INDEX `user_username_unique` ON `user` (`username`);

drizzle/meta/0000_snapshot.json

@@ -0,0 +1,109 @@
+{
+  "version": "6",
+  "dialect": "sqlite",
+  "id": "fdc2dee0-2538-4cc8-b099-91c79837ec7c",
+  "prevId": "00000000-0000-0000-0000-000000000000",
+  "tables": {
+    "session": {
+      "name": "session",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "expires_at": {
+          "name": "expires_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {
+        "session_user_id_user_id_fk": {
+          "name": "session_user_id_user_id_fk",
+          "tableFrom": "session",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "no action",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "user": {
+      "name": "user",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "age": {
+          "name": "age",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "username": {
+          "name": "username",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "password_hash": {
+          "name": "password_hash",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        }
+      },
+      "indexes": {
+        "user_username_unique": {
+          "name": "user_username_unique",
+          "columns": [
+            "username"
+          ],
+          "isUnique": true
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    }
+  },
+  "views": {},
+  "enums": {},
+  "_meta": {
+    "schemas": {},
+    "tables": {},
+    "columns": {}
+  },
+  "internal": {
+    "indexes": {}
+  }
+}

drizzle/meta/_journal.json

@@ -0,0 +1,13 @@
+{
+  "version": "7",
+  "dialect": "sqlite",
+  "entries": [
+    {
+      "idx": 0,
+      "version": "6",
+      "when": 1761399224828,
+      "tag": "0000_clumsy_bill_hollister",
+      "breakpoints": true
+    }
+  ]
+}

messages/de-de.json

@@ -0,0 +1,4 @@
+{
+	"$schema": "https://inlang.com/schema/inlang-message-format",
+	"hello_world": "Hello, {name} from de-de!"
+}

messages/en.json

@@ -0,0 +1,4 @@
+{
+	"$schema": "https://inlang.com/schema/inlang-message-format",
+	"hello_world": "Hello, {name} from en!"
+}

messages/es.json

@@ -0,0 +1,4 @@
+{
+	"$schema": "https://inlang.com/schema/inlang-message-format",
+	"hello_world": "Hello, {name} from es!"
+}

package.json

@@ -0,0 +1,63 @@
+{
+  "name": "rbw",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "trustedDependencies": [
+    "puppeteer"
+  ],
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build",
+    "preview": "vite preview",
+    "prepare": "svelte-kit sync || echo ''",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "format": "prettier --write .",
+    "lint": "prettier --check . && eslint .",
+    "db:push": "drizzle-kit push",
+    "db:generate": "drizzle-kit generate",
+    "db:migrate": "drizzle-kit migrate",
+    "db:studio": "drizzle-kit studio"
+  },
+  "devDependencies": {
+    "@eslint/compat": "^1.4.0",
+    "@eslint/js": "^9.36.0",
+    "@inlang/paraglide-js": "^2.3.2",
+    "@libsql/client": "^0.15.15",
+    "@oslojs/crypto": "^1.0.1",
+    "@oslojs/encoding": "^1.1.0",
+    "@sveltejs/adapter-auto": "^6.1.0",
+    "@sveltejs/kit": "^2.43.2",
+    "@sveltejs/vite-plugin-svelte": "^6.2.0",
+    "@tailwindcss/forms": "^0.5.10",
+    "@tailwindcss/typography": "^0.5.18",
+    "@tailwindcss/vite": "^4.1.13",
+    "@types/bun": "latest",
+    "@types/node": "^22",
+    "drizzle-kit": "^0.31.4",
+    "drizzle-orm": "^0.44.5",
+    "eslint": "^9.36.0",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-svelte": "^3.12.4",
+    "globals": "^16.4.0",
+    "oxlint": "^1.24.0",
+    "prettier": "^3.6.2",
+    "prettier-plugin-svelte": "^3.4.0",
+    "prettier-plugin-tailwindcss": "^0.6.14",
+    "svelte": "^5.39.5",
+    "svelte-check": "^4.3.2",
+    "tailwindcss": "^4.1.13",
+    "typescript": "^5.9.2",
+    "typescript-eslint": "^8.44.1",
+    "vite": "^7.1.7",
+    "vite-plugin-devtools-json": "^1.0.0"
+  },
+  "dependencies": {
+    "@effect/platform": "^0.92.1",
+    "@effect/platform-bun": "^0.81.1",
+    "@node-rs/argon2": "^2.0.2",
+    "effect": "^3.18.4",
+    "puppeteer": "^24.26.1"
+  }
+}

project.inlang/project_id

@@ -0,0 +1 @@
+zde6McVKGu95Y42pgx

project.inlang/settings.json

@@ -0,0 +1,12 @@
+{
+	"$schema": "https://inlang.com/schema/project-settings",
+	"modules": [
+		"https://cdn.jsdelivr.net/npm/@inlang/plugin-message-format@4/dist/index.js",
+		"https://cdn.jsdelivr.net/npm/@inlang/plugin-m-function-matcher@2/dist/index.js"
+	],
+	"plugin.inlang.messageFormat": {
+		"pathPattern": "./messages/{locale}.json"
+	},
+	"baseLocale": "en",
+	"locales": ["en", "es", "de-de"]
+}

src/app.css

@@ -0,0 +1,3 @@
+@import 'tailwindcss';
+@plugin '@tailwindcss/forms';
+@plugin '@tailwindcss/typography';

src/app.d.ts

@@ -0,0 +1,15 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+	namespace App {
+		interface Locals {
+			user: import('$lib/server/auth').SessionValidationResult['user']
+			session: import('$lib/server/auth').SessionValidationResult['session']
+		}
+	} // interface Error {}
+	// interface Locals {}
+} // interface PageData {}
+// interface PageState {}
+
+// interface Platform {}
+export {}

src/app.html

@@ -0,0 +1,11 @@
+<!doctype html>
+<html lang="%paraglide.lang%">
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>

src/hooks.server.ts

@@ -0,0 +1,50 @@
+import { sequence } from '@sveltejs/kit/hooks'
+import * as auth from '$lib/server/auth'
+import type { Handle } from '@sveltejs/kit'
+import { paraglideMiddleware } from '$lib/paraglide/server'
+import { val, type SessionData } from '$lib/server/auth'
+import { Effect, Logger, Tracer } from 'effect'
+import { BunRuntime } from '@effect/platform-bun'
+
+const handleParaglide: Handle = ({ event, resolve }) =>
+	paraglideMiddleware(event.request, ({ request, locale }) => {
+		event.request = request
+
+		return resolve(event, {
+			transformPageChunk: ({ html }) => html.replace('%paraglide.lang%', locale),
+		})
+	})
+
+const handleAuth: Handle = async ({ event, resolve }) => {
+	const sessionToken = event.cookies.get(auth.sessionCookieName)
+
+	if (!sessionToken) {
+		event.locals.user = null
+		event.locals.session = null
+		return resolve(event)
+	}
+
+	const recoveredVal = val(sessionToken).pipe(
+		Effect.catchTag('DbError', (_) =>
+			Effect.succeed({ session: null, user: null } satisfies SessionData),
+		),
+		Effect.provide(Logger.pretty),
+		Effect.annotateLogs('Operation', 'ValidateToken'),
+	)
+
+	const { session, user } = await Effect.runPromise(recoveredVal)
+
+	// const { session, user } = await auth.validateSessionToken(sessionToken)
+
+	if (session) {
+		auth.setSessionTokenCookie(event, sessionToken, session.expiresAt)
+	} else {
+		auth.deleteSessionTokenCookie(event)
+	}
+
+	event.locals.user = user
+	event.locals.session = session
+	return resolve(event)
+}
+
+export const handle: Handle = sequence(handleParaglide, handleAuth)

src/hooks.ts

@@ -0,0 +1,3 @@
+import { deLocalizeUrl } from '$lib/paraglide/runtime'
+
+export const reroute = (request) => deLocalizeUrl(request.url).pathname

src/lib/assets/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="107" height="128" viewBox="0 0 107 128"><title>svelte-logo</title><path d="M94.157 22.819c-10.4-14.885-30.94-19.297-45.792-9.835L22.282 29.608A29.92 29.92 0 0 0 8.764 49.65a31.5 31.5 0 0 0 3.108 20.231 30 30 0 0 0-4.477 11.183 31.9 31.9 0 0 0 5.448 24.116c10.402 14.887 30.942 19.297 45.791 9.835l26.083-16.624A29.92 29.92 0 0 0 98.235 78.35a31.53 31.53 0 0 0-3.105-20.232 30 30 0 0 0 4.474-11.182 31.88 31.88 0 0 0-5.447-24.116" style="fill:#ff3e00"/><path d="M45.817 106.582a20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.503 18 18 0 0 1 .624-2.435l.49-1.498 1.337.981a33.6 33.6 0 0 0 10.203 5.098l.97.294-.09.968a5.85 5.85 0 0 0 1.052 3.878 6.24 6.24 0 0 0 6.695 2.485 5.8 5.8 0 0 0 1.603-.704L69.27 76.28a5.43 5.43 0 0 0 2.45-3.631 5.8 5.8 0 0 0-.987-4.371 6.24 6.24 0 0 0-6.698-2.487 5.7 5.7 0 0 0-1.6.704l-9.953 6.345a19 19 0 0 1-5.296 2.326 20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.502 17.99 17.99 0 0 1 8.13-12.052l26.081-16.623a19 19 0 0 1 5.3-2.329 20.72 20.72 0 0 1 22.237 8.243 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-.624 2.435l-.49 1.498-1.337-.98a33.6 33.6 0 0 0-10.203-5.1l-.97-.294.09-.968a5.86 5.86 0 0 0-1.052-3.878 6.24 6.24 0 0 0-6.696-2.485 5.8 5.8 0 0 0-1.602.704L37.73 51.72a5.42 5.42 0 0 0-2.449 3.63 5.79 5.79 0 0 0 .986 4.372 6.24 6.24 0 0 0 6.698 2.486 5.8 5.8 0 0 0 1.602-.704l9.952-6.342a19 19 0 0 1 5.295-2.328 20.72 20.72 0 0 1 22.237 8.242 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-8.13 12.053l-26.081 16.622a19 19 0 0 1-5.3 2.328" style="fill:#fff"/></svg>

src/lib/index.ts

@@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.

src/lib/server/auth.ts

@@ -0,0 +1,148 @@
+import type { RequestEvent } from '@sveltejs/kit'
+import { eq } from 'drizzle-orm'
+import { sha256 } from '@oslojs/crypto/sha2'
+import { encodeBase64url, encodeHexLowerCase } from '@oslojs/encoding'
+import { db } from '$lib/server/db'
+import {
+  deleteSession,
+  getSessionData,
+  renewSession,
+  type Session,
+} from './db/session'
+
+import { tables } from './db'
+import { Effect } from 'effect'
+
+const DAY_IN_MS = 1000 * 60 * 60 * 24
+
+export const sessionCookieName = 'auth-session'
+
+export function generateSessionToken() {
+  const bytes = crypto.getRandomValues(new Uint8Array(18))
+  const token = encodeBase64url(bytes)
+  return token
+}
+
+export async function createSession(token: string, userId: string) {
+  const sessionId = encodeHexLowerCase(sha256(new TextEncoder().encode(token)))
+  const session: Session = {
+    id: sessionId,
+    userId,
+    expiresAt: new Date(Date.now() + DAY_IN_MS * 30),
+  }
+  await db.insert(tables.session).values(session)
+  return session
+}
+
+export type SessionData =
+  | {
+      user: {
+        username: string
+        id: string
+      }
+      session: {
+        id: string
+        userId: string
+        expiresAt: Date
+      }
+    }
+  | {
+      user: null
+      session: null
+    }
+
+export const val = (token: string) =>
+  Effect.gen(function* () {
+    const sessionId = encodeHexLowerCase(
+      sha256(new TextEncoder().encode(token)),
+    )
+
+    const result: SessionData = { session: null, user: null }
+
+    const sessionData = yield* getSessionData(sessionId)
+
+    if (!sessionData) {
+      yield* Effect.logInfo(`Session ${sessionId} not found`)
+      return result
+    }
+
+    const { session, user } = sessionData
+
+    yield* Effect.logInfo('Session found', session)
+
+    const sessionExpired = Date.now() >= session.expiresAt.getTime()
+    if (sessionExpired) {
+      deleteSession(sessionId)
+      return result
+    }
+
+    yield* renewSession(session)
+
+    return { session, user }
+  }).pipe(Effect.withSpan('ValidateToken', { captureStackTrace: true }))
+
+export async function validateSessionToken(
+  token: string,
+): Promise<
+  | { session: null; user: null }
+  | { session: Session; user: { username: string; id: string } }
+> {
+  const sessionId = encodeHexLowerCase(sha256(new TextEncoder().encode(token)))
+  const [result] = await db
+    .select({
+      // Adjust user table here to tweak returned data
+      user: { id: tables.user.id, username: tables.user.username },
+      session: tables.session,
+    })
+    .from(tables.session)
+    .innerJoin(tables.user, eq(tables.session.userId, tables.user.id))
+    .where(eq(tables.session.id, sessionId))
+
+  if (!result) {
+    return { session: null, user: null }
+  }
+  const { session, user } = result
+
+  const sessionExpired = Date.now() >= session.expiresAt.getTime()
+  if (sessionExpired) {
+    await db.delete(tables.session).where(eq(tables.session.id, session.id))
+    return { session: null, user: null }
+  }
+
+  const renewSession =
+    Date.now() >= session.expiresAt.getTime() - DAY_IN_MS * 15
+  if (renewSession) {
+    session.expiresAt = new Date(Date.now() + DAY_IN_MS * 30)
+    await db
+      .update(tables.session)
+      .set({ expiresAt: session.expiresAt })
+      .where(eq(tables.session.id, session.id))
+  }
+
+  return { session, user }
+}
+
+export type SessionValidationResult = Awaited<
+  ReturnType<typeof validateSessionToken>
+>
+
+export async function invalidateSession(sessionId: string) {
+  await db.delete(tables.session).where(eq(tables.session.id, sessionId))
+}
+
+export function setSessionTokenCookie(
+  event: RequestEvent,
+  token: string,
+  expiresAt: Date,
+) {
+  event.cookies.set(sessionCookieName, token, {
+    expires: expiresAt,
+    path: '/',
+  })
+}
+
+export function deleteSessionTokenCookie(event: RequestEvent) {
+  event.cookies.delete(sessionCookieName, {
+    path: '/',
+  })
+}

src/lib/server/config.ts

@@ -0,0 +1,20 @@
+import { Config, Context, Effect } from 'effect'
+
+export class ConfigService extends Context.Tag('ConfigService')<
+	ConfigService,
+	{ readonly getDbUrl: () => Config.Config<URL> }
+>() {}
+
+const program = Effect.gen(function* () {
+	const configService = yield* ConfigService
+
+	const url = yield* configService.getDbUrl()
+
+	console.log(url.toString())
+})
+
+const runnable = Effect.provideService(program, ConfigService, {
+	getDbUrl: () => {
+		return Config.url('DATABASE_URL').pipe(Config.withDefault(new URL('file:local.db')))
+	}
+})

src/lib/server/crawler/clevertronik/data/capacity.ts

@@ -0,0 +1,13 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getCapacityVariations } from '../variations/capacity'
+import { getSelected } from '.'
+
+export const getCapacity = (page: Page) =>
+  Effect.gen(function* () {
+    const capacityVariations = yield* getCapacityVariations(page)
+
+    const selectedCapacity = yield* getSelected(capacityVariations)
+
+    return selectedCapacity.label
+  })

src/lib/server/crawler/clevertronik/data/color.ts

@@ -0,0 +1,13 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getSelected } from '.'
+import { getColorVariations } from '../variations/color'
+
+export const getColor = (page: Page) =>
+  Effect.gen(function* () {
+    const colorVariations = yield* getColorVariations(page)
+
+    const selectedCapacity = yield* getSelected(colorVariations)
+
+    return selectedCapacity.label
+  })

src/lib/server/crawler/clevertronik/data/condition.ts

@@ -0,0 +1,49 @@
+import { Data, Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { CrawlerElementNotFoundError } from '../..'
+
+const PRODUCT_CONDITION_SELECTOR =
+  '#dynamic_content > div.modell_page_grid > div.modell_page_name > div.modell_page_name_container > div'
+
+export const getCondition = (page: Page) =>
+  Effect.gen(function* () {
+    let conditionString = yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate((PRODUCT_CONDITION_SELECTOR) => {
+          const productConditionDiv: HTMLDivElement | null =
+            document.querySelector(PRODUCT_CONDITION_SELECTOR)
+
+          if (!productConditionDiv) {
+            throw new Error('Could not find product condition')
+          }
+
+          return productConditionDiv.innerText
+        }, PRODUCT_CONDITION_SELECTOR),
+      catch: (cause) =>
+        new CrawlerElementNotFoundError({
+          message: 'Could not parse product condition',
+          cause,
+        }),
+    })
+
+    conditionString = conditionString.replace('Akku: Neu', '')
+
+    const [_, condition] = conditionString.split(':').map((str) => str.trim())
+
+    if (!condition) {
+      return yield* Effect.fail(
+        new ParseConditionError({
+          message: 'Could not parse condition from condition string',
+        }),
+      )
+    }
+
+    return condition
+  })
+
+export class ParseConditionError extends Data.TaggedError(
+  'ParseConditionError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}

src/lib/server/crawler/clevertronik/data/devices.ts

@@ -0,0 +1,130 @@
+import { Data, Effect } from 'effect'
+import type { Page } from 'puppeteer'
+
+const OPEN_MODAL_BUTTON_SELECTOR =
+  '#dynamic_content > div.modell_page_grid > div.modell_page_filter_and_info > div.show_single_container > div.show_single_text > button'
+
+const DEVICE_LIST_SELECTOR =
+  '#popup-singles > div.popup_box > div > div.single_item_list.js_single_item_list'
+
+export class ParseDeviceModalError extends Data.TaggedError(
+  'ParseDeviceModalError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export class OpenDeviceModalError extends Data.TaggedError(
+  'OpenDeviceModalError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+const openDeviceModal = (page: Page) =>
+  Effect.gen(function* () {
+    const childrenCount = yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate(
+          async (DEVICE_LIST_SELECTOR, OPEN_MODAL_BUTTON_SELECTOR) => {
+            const button: HTMLButtonElement | null = document.querySelector(
+              OPEN_MODAL_BUTTON_SELECTOR,
+            )
+
+            if (!button) return
+
+            button.click()
+
+            let deviceListDiv: HTMLDivElement | null = null
+
+            const tryLimit = 200
+            for (let tryCount = 0; tryCount < tryLimit; tryCount++) {
+              deviceListDiv = document.querySelector(DEVICE_LIST_SELECTOR)
+
+              if (deviceListDiv) {
+                break
+              }
+              await new Promise((resolve) => setTimeout(resolve, 50))
+            }
+
+            if (!deviceListDiv) {
+              throw new Error('List not found')
+            }
+
+            return deviceListDiv.children.length
+          },
+          DEVICE_LIST_SELECTOR,
+          OPEN_MODAL_BUTTON_SELECTOR,
+        ),
+      catch: (cause) =>
+        new OpenDeviceModalError({
+          message: `Unable to open device modal: ${cause}`,
+          cause,
+        }),
+    })
+  })
+
+export const getDevices = (page: Page) =>
+  Effect.gen(function* () {
+    yield* openDeviceModal(page)
+
+    return yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate((DEVICE_LIST_SELECTOR) => {
+          const deviceListDiv: HTMLDivElement | null =
+            document.querySelector(DEVICE_LIST_SELECTOR)
+
+          if (!deviceListDiv) {
+            throw new Error('Unable to find device list')
+          }
+
+          const parseDevice = (element: HTMLDivElement) => {
+            const detailListElements: HTMLLIElement[] = Array.from(
+              element.querySelectorAll('.inline_list'),
+            )
+
+            const details = detailListElements.map((li) => li.innerText)
+
+            const extraBarDiv: HTMLDivElement | null = element.querySelector(
+              '.extra_information_list',
+            )
+
+            let batteryStatusString: string = ''
+            let imagesCountString: string = ''
+            let originalPagacking: string = ''
+
+            if (extraBarDiv) {
+              ;[batteryStatusString, imagesCountString, originalPagacking] =
+                extraBarDiv.innerText.split('\n')
+            }
+
+            let imageCount = 0
+
+            if (imagesCountString) {
+              imageCount = parseInt(imagesCountString.match(/\d+/)?.[0] ?? '0')
+            }
+
+            let batteryPercentage = 0
+
+            if (batteryStatusString) {
+              batteryPercentage = parseInt(
+                batteryStatusString.match(/\d+(?=%)/)?.[0] ?? '0',
+              )
+            }
+
+            return { details, originalPagacking, imageCount, batteryPercentage }
+          }
+
+          const deviceDivs: HTMLDivElement[] = Array.from(
+            deviceListDiv.querySelectorAll(':scope > div'),
+          )
+
+          return deviceDivs.map((device) => parseDevice(device))
+        }, DEVICE_LIST_SELECTOR),
+      catch: (cause) =>
+        new ParseDeviceModalError({
+          message: `Unable to parse device list: ${cause}`,
+          cause,
+        }),
+    })
+  })

src/lib/server/crawler/clevertronik/data/index.ts

@@ -0,0 +1,93 @@
+import { Data, Effect } from 'effect'
+import { getPrice } from './price'
+import type { Page } from 'puppeteer'
+import { getProductName } from './productName'
+import { getCondition } from './condition'
+import { getCapacity } from './capacity'
+import type { Variation } from '../variations'
+import { getColor } from './color'
+import { getSim } from './sim'
+import { getStockLevel } from './stockLevel'
+import { getDevices } from './devices'
+
+export class ExtractSelectedVariationError extends Data.TaggedError(
+  'ExtractSelectedVariationError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export const getSelected = (variations: Variation[]) =>
+  Effect.gen(function* () {
+    const selected = variations.find((variation) => variation.selected)
+
+    if (!selected) {
+      return yield* Effect.fail(
+        new ExtractSelectedVariationError({
+          message: 'No selected variation option found',
+        }),
+      )
+    }
+
+    return selected
+  })
+
+const log = (value: unknown, name: string) =>
+  Effect.gen(function* () {
+    if (typeof value === 'object') {
+      yield* Effect.logInfo(`${name}: ${JSON.stringify(value)}`)
+    } else {
+      yield* Effect.logInfo(`${name}: ${value}`)
+    }
+  })
+
+export type PageData = {
+  price: number
+  productName: string
+  condition: string
+  capacity: string
+  color: string
+  sim: string
+  stockLevel: string
+  devices: DeviceData[]
+}
+
+export type DeviceData = {
+  details: string[]
+  originalPagacking: string
+  imageCount: number
+  batteryPercentage: number
+}
+
+export const getPageData = (page: Page) =>
+  Effect.gen(function* () {
+    const price = yield* getPrice(page)
+
+    const productName = yield* getProductName(page).pipe(
+      Effect.tap((val) => log(val, 'Product Name')),
+    )
+
+    const condition = yield* getCondition(page)
+
+    const capacity = yield* getCapacity(page)
+
+    const color = yield* getColor(page)
+
+    const sim = yield* getSim(page)
+
+    const stockLevel = yield* getStockLevel(page)
+    const devices = yield* getDevices(page)
+
+    const pageData: PageData = {
+      price,
+      productName,
+      condition,
+      capacity,
+      color,
+      sim,
+      stockLevel,
+      devices,
+    }
+
+    return pageData
+  })

src/lib/server/crawler/clevertronik/data/price.ts

@@ -0,0 +1,57 @@
+import { Data, Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { CrawlerElementNotFoundError } from '../..'
+
+export class ParsePriceError extends Data.TaggedError('ParsePriceError')<{
+  cause?: unknown
+  message?: string
+}> {}
+
+const PRICE_SELECTOR =
+  '#js-buybox-container > div > div.buybox_price_container > div > span.js_adjust_main_price'
+
+export const getPrice = (page: Page) =>
+  Effect.gen(function* () {
+    const priceString = yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate((PRICE_SELECTOR) => {
+          const priceSpan: HTMLSpanElement | null =
+            document.querySelector(PRICE_SELECTOR)
+
+          if (!priceSpan) {
+            throw new Error('Could not find price span')
+          }
+
+          return priceSpan.innerText
+        }, PRICE_SELECTOR),
+      catch: (cause) =>
+        new CrawlerElementNotFoundError({
+          message: 'Could not parse price',
+          cause,
+        }),
+    })
+
+    return priceString
+  }).pipe(Effect.flatMap(toNumber))
+
+const toNumber = (priceString: string) =>
+  Effect.gen(function* () {
+    // Remove all non-digit characters except comma and dot
+    let cleaned = priceString.replace(/[^\d,.-]/g, '')
+
+    // Replace comma with dot (for European format)
+    cleaned = cleaned.replace(',', '.')
+
+    const parsed = parseFloat(cleaned)
+
+    if (Number.isNaN(parsed)) {
+      return yield* Effect.fail(
+        new ParsePriceError({
+          message: 'Could not parse price string',
+          cause: 'Number is NaN',
+        }),
+      )
+    } else {
+      return yield* Effect.succeed(parsed)
+    }
+  })

src/lib/server/crawler/clevertronik/data/productName.ts

@@ -0,0 +1,28 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { CrawlerElementNotFoundError } from '../..'
+
+const PRODUCT_NAME_SELECTOR =
+  '#dynamic_content > div.modell_page_grid > div.modell_page_name > div.modell_page_name_container > h1 > span'
+
+export const getProductName = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate((PRODUCT_NAME_SELECTOR) => {
+          const productNameSpan: HTMLSpanElement | null =
+            document.querySelector(PRODUCT_NAME_SELECTOR)
+
+          if (!productNameSpan) {
+            throw new Error('Could not find product name')
+          }
+
+          return productNameSpan.innerText
+        }, PRODUCT_NAME_SELECTOR),
+      catch: (cause) =>
+        new CrawlerElementNotFoundError({
+          message: 'Could not parse product name',
+          cause,
+        }),
+    })
+  })

src/lib/server/crawler/clevertronik/data/sim.ts

@@ -0,0 +1,17 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getSelected } from '.'
+import { getSimVariations } from '../variations/sim'
+
+export const getSim = (page: Page) =>
+  Effect.gen(function* () {
+    const simVariations = yield* getSimVariations(page)
+
+    if (simVariations.length === 0) {
+      return ''
+    }
+
+    const selectedSim = yield* getSelected(simVariations)
+
+    return selectedSim.label
+  })

src/lib/server/crawler/clevertronik/data/stockLevel.ts

@@ -0,0 +1,29 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { CrawlerElementNotFoundError } from '../..'
+
+const STOCK_LEVEL_BADGE_SELECTOR =
+  '.modellfilter_row > .modellfilter_head > .colored_label_wrapper'
+
+export const getStockLevel = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate((STOCK_LEVEL_BADGE_SELECTOR) => {
+          const stockLevelBadge: HTMLDivElement | null = document.querySelector(
+            STOCK_LEVEL_BADGE_SELECTOR,
+          )
+
+          if (!stockLevelBadge) {
+            throw new Error('Could not find stock level')
+          }
+
+          return stockLevelBadge.innerText
+        }, STOCK_LEVEL_BADGE_SELECTOR),
+      catch: (cause) =>
+        new CrawlerElementNotFoundError({
+          message: `Could not parse stock level, ${cause}`,
+          cause,
+        }),
+    })
+  })

src/lib/server/crawler/clevertronik/index.ts

@@ -0,0 +1,80 @@
+import { Data, Effect, pipe } from 'effect'
+import { openPage } from '../openPage'
+import * as Crawler from '../index'
+import { withOperation } from '$lib/server/utils'
+import { getProductName } from './data/productName'
+import { getAllVariations, VariationEnum, type Variation } from './variations'
+import { getPageData, type PageData } from './data'
+import type { Page } from 'puppeteer'
+import {
+  getAllVariationCategoryData,
+  getAllVariationData,
+  type VariationCategory,
+} from './variationData'
+
+export type Selectable = {
+  selector: string
+}
+
+export class VariationParseError extends Data.TaggedError(
+  'VariationParseError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export const crawlClevertronik = Effect.gen(function* () {
+  const page = yield* openPage(
+    'https://www.clevertronic.de/kaufen/handy-kaufen/apple/iphone-16-pro-max/auswahl/21872/apple-iphone-16-pro-max-256gb-titan-schwarz?ok=11&ok_click=11',
+  )
+
+  yield* Effect.logInfo('opened clevertronik page')
+
+  let productName = yield* getProductName(page)
+
+  const variations = yield* getAllVariations(page)
+
+  // const variationCategory: VariationCategory = {
+  //   name: 'Capacity',
+  //   variations: variations.capacities,
+  //   subVariationCategory: {
+  //     name: 'Color',
+  //     variations: variations.colors,
+  //     subVariationCategory: {
+  //       name: 'Sim',
+  //       variations: variations.sims,
+  //       subVariationCategory: {
+  //         name: 'Condition',
+  //         variations: variations.conditions,
+  //         subVariationCategory: {
+  //           name: 'Battery',
+  //           variations: variations.battery,
+  //         },
+  //       },
+  //     },
+  //   },
+  // }
+
+  const variationCategory: VariationCategory = {
+    name: VariationEnum.CAPACITY,
+    subVariationCategory: {
+      name: VariationEnum.COLOR,
+    },
+  }
+
+  const variationData = yield* getAllVariationCategoryData(
+    page,
+    variationCategory,
+  )
+
+  yield* Effect.promise(() => page.browser().close())
+
+  return {
+    productName,
+    ...variations,
+    variationData,
+  }
+}).pipe(
+  Effect.provide(Crawler.CrawlerLayer()),
+  withOperation('CrawlClevertronik'),
+)

src/lib/server/crawler/clevertronik/variationData/index.ts

@@ -0,0 +1,138 @@
+import type { Page } from 'puppeteer'
+import { getPageData, type PageData } from '../data'
+import {
+  getVariationHandler,
+  VariationEnum,
+  VariationParseError,
+  type Variation,
+} from '../variations'
+import { Effect, pipe } from 'effect'
+
+export type VariationPageData = {
+  capacityVartiationName: string
+  conditionVartiationName: string
+  colorVartiationName: string
+  batteryVartiationName: string
+} & PageData
+
+export type VariationCategory = {
+  name: VariationEnum
+  subVariationCategory?: VariationCategory
+}
+
+export const getAllVariationCategoryData = (
+  page: Page,
+  variationCategory: VariationCategory,
+): Effect.Effect<
+  PageData[],
+  Effect.Effect.Error<ReturnType<typeof getDataFromVariation>>,
+  Effect.Effect.Context<ReturnType<typeof getDataFromVariation>>
+> =>
+  Effect.gen(function* () {
+    const result: PageData[] = []
+    const variationPage = yield* duplicatePage(page)
+    const variations =
+      yield* getVariationHandler[variationCategory.name](variationPage)
+
+    for (const variation of variations.filter((v) => v.active)) {
+      if (!variation.selected) {
+        yield* gotoVariation(variationPage, variation)
+      }
+      if (variationCategory.subVariationCategory) {
+        const pageDataResult = yield* getAllVariationCategoryData(
+          variationPage,
+          variationCategory.subVariationCategory,
+        )
+
+        result.push(...pageDataResult)
+      } else {
+        result.push(yield* getPageData(variationPage))
+      }
+    }
+
+    return result
+  })
+
+export const getAllVariationData = (page: Page, variations: Variation[]) =>
+  Effect.gen(function* () {
+    const effects = []
+    for (const variation of variations) {
+      if (!variation.active) {
+        continue
+      }
+      effects.push(getDataFromVariation(page, variation))
+    }
+
+    return yield* Effect.all(effects, { concurrency: 'unbounded' })
+  })
+
+const getDataFromVariation = (page: Page, variation: Variation) =>
+  pipe(
+    gotoVariation(page, variation),
+    Effect.flatMap(() => getPageData(page)),
+    Effect.annotateLogs({ variation: variation.label }),
+  )
+
+const duplicatePage = (page: Page) =>
+  Effect.gen(function* () {
+    const variationPage = yield* Effect.promise(() => page.browser().newPage())
+
+    yield* Effect.promise(() => variationPage.goto(page.url()))
+
+    return variationPage
+  })
+
+const gotoVariation = (page: Page, variation: Variation) =>
+  Effect.gen(function* () {
+    const success = yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate(async (selector) => {
+          const button: HTMLButtonElement | null =
+            document.querySelector(selector)
+
+          const loadingDiv: HTMLDivElement | null = document.querySelector(
+            '#js-global-wait-mask',
+          )
+
+          if (!button) {
+            throw new Error('Could not find variation button')
+          }
+
+          if (!loadingDiv) {
+            throw new Error('Could not find loading div')
+          }
+
+          button.click()
+
+          let wasActive = false
+
+          const tryLimit = 200
+          for (let tryCount = 0; tryCount < tryLimit; tryCount++) {
+            await new Promise((resolve) => setTimeout(resolve, 50))
+
+            const current = loadingDiv.classList.contains('js_active')
+
+            if (!wasActive && current) {
+              wasActive = true
+              continue
+            }
+
+            if (wasActive && !current) {
+              return true
+            }
+          }
+          return false
+        }, variation.selector),
+      catch: (cause) =>
+        new VariationParseError({
+          message: `Could not goto variation: ${cause}`,
+          cause,
+        }),
+    })
+
+    yield* Effect.sleep('2 second')
+
+    yield* Effect.logInfo(`Goto Variaton success: ${success}`)
+
+    return page
+  })

src/lib/server/crawler/clevertronik/variations/battery.ts

@@ -0,0 +1,10 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getVariations } from '.'
+
+const BATTERY_CONTAINER_SELECTOR = '.new_battery_options'
+
+export const getBatteryVariations = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* getVariations(page, BATTERY_CONTAINER_SELECTOR, 'DIV')
+  })

src/lib/server/crawler/clevertronik/variations/capacity.ts

@@ -0,0 +1,10 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getVariations } from '.'
+
+const CAPACITY_CONTAINER_SELECTOR = '[data-scrollel="prop_19"]'
+
+export const getCapacityVariations = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* getVariations(page, CAPACITY_CONTAINER_SELECTOR)
+  })

src/lib/server/crawler/clevertronik/variations/color.ts

@@ -0,0 +1,23 @@
+import { Effect, pipe } from 'effect'
+import type { Page } from 'puppeteer'
+import { getVariations } from '.'
+
+const COLOR_VARIATION_CONTAINER_SELECTOR = '[data-scrollel="prop_17"]'
+
+export const getColorVariations = (page: Page) =>
+  pipe(
+    Effect.gen(function* () {
+      return yield* getVariations(page, COLOR_VARIATION_CONTAINER_SELECTOR)
+    }),
+    Effect.flatMap((variations) =>
+      Effect.gen(function* () {
+        for (const variation of variations) {
+          if (variation.detail?.includes('Alternativen')) {
+            variation.active = false
+          }
+        }
+
+        return yield* Effect.succeed(variations)
+      }),
+    ),
+  )

src/lib/server/crawler/clevertronik/variations/condition.ts

@@ -0,0 +1,10 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getVariations } from '.'
+
+export const CONDITION_CONTAINER_SELECTOR = '[data-scrollel="condition"]'
+
+export const getConditionVariations = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* getVariations(page, CONDITION_CONTAINER_SELECTOR, 'DIV')
+  })

src/lib/server/crawler/clevertronik/variations/index.ts

@@ -0,0 +1,118 @@
+import { Data, Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import type { Selectable } from '../'
+import { getCapacityVariations } from './capacity'
+import { getColorVariations } from './color'
+import { getSimVariations } from './sim'
+import { getConditionVariations } from './condition'
+import { getBatteryVariations } from './battery'
+
+export type Variation = {
+  label: string
+  detail?: string
+  /**
+   * active and clickable
+   */
+  active: boolean
+  /**
+   * currently selected
+   */
+  selected: boolean
+} & Selectable
+
+export class VariationParseError extends Data.TaggedError(
+  'VariationParseError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export enum VariationEnum {
+  CAPACITY = 'Capacity',
+  COLOR = 'Color',
+  SIM = 'Sim',
+  CONDITION = 'CONDITION',
+  BATTERY = 'BATTER',
+}
+
+export const getVariationHandler = {
+  [VariationEnum.CAPACITY]: getCapacityVariations,
+  [VariationEnum.COLOR]: getColorVariations,
+  [VariationEnum.SIM]: getSimVariations,
+  [VariationEnum.CONDITION]: getConditionVariations,
+  [VariationEnum.BATTERY]: getBatteryVariations,
+}
+
+export const getVariations = (
+  page: Page,
+  containerSelector: string,
+  elementType: 'DIV' | 'SPAN' = 'SPAN',
+) =>
+  Effect.gen(function* () {
+    const variations = yield* Effect.tryPromise({
+      try: () =>
+        page.evaluate(
+          async (containerSelector, elementType) => {
+            const container = document.querySelector(containerSelector)
+
+            if (!container) {
+              throw new Error('Container not found')
+            }
+
+            const buttons: HTMLSpanElement[] | HTMLDivElement[] = Array.from(
+              container.children,
+            ).filter(
+              (child) => child.tagName === elementType,
+            ) as HTMLSpanElement[]
+
+            const variations: Variation[] = []
+
+            for (let i = 0; i < buttons.length; i++) {
+              const selector = `${containerSelector} > :nth-child(${i + 1})`
+              const textContent = buttons[i].innerText.split('\n')
+              variations.push({
+                label: textContent.at(0)?.trim() ?? '',
+                active: !buttons[i].classList.contains('faded'),
+                selected: buttons[i].classList.contains('active'),
+                detail: textContent.at(1)?.trim(),
+                selector,
+              })
+            }
+            return variations
+          },
+          containerSelector,
+          elementType,
+        ),
+      catch: (cause) =>
+        new VariationParseError({
+          message: `Could not parse variations, ${cause}, ${containerSelector}`,
+          cause,
+        }),
+    })
+
+    return variations
+  })
+
+export const getAllVariations = (page: Page) =>
+  Effect.gen(function* () {
+    const [capacities, colors, sims, conditions, battery] = yield* Effect.all(
+      [
+        getCapacityVariations(page),
+        getColorVariations(page),
+        getSimVariations(page),
+        getConditionVariations(page),
+        getBatteryVariations(page),
+      ],
+      {
+        concurrency: 'unbounded',
+      },
+    )
+
+    return {
+      capacities,
+      colors,
+      sims,
+      conditions,
+      battery,
+    }
+  })

src/lib/server/crawler/clevertronik/variations/sim.ts

@@ -0,0 +1,17 @@
+import { Effect } from 'effect'
+import type { Page } from 'puppeteer'
+import { getVariations, type Variation } from '.'
+
+const SIM_CONTAINER_SELECTOR = '[data-scrollel="prop_39"]'
+
+export const getSimVariations = (page: Page) =>
+  Effect.gen(function* () {
+    return yield* getVariations(page, SIM_CONTAINER_SELECTOR).pipe(
+      Effect.catchTag('VariationParseError', (e) =>
+        Effect.gen(function* () {
+          yield* Effect.logInfo('No SimVariations found')
+          return yield* Effect.succeed(new Array<Variation>())
+        }),
+      ),
+    )
+  }).pipe()

src/lib/server/crawler/index.ts

@@ -0,0 +1,82 @@
+import { Context, Data, Effect, Layer } from 'effect'
+import { launch } from 'puppeteer'
+
+export class CrawlerPageNotFoundError extends Data.TaggedError(
+  'CrawlerPageNotFoundError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export class CrawlerHttpError extends Data.TaggedError('CrawlerHttpError')<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export class CrawlerError extends Data.TaggedError('CrawlerError')<{
+  cause?: unknown
+  message?: string
+}> {}
+
+export class CrawlerElementNotFoundError extends Data.TaggedError(
+  'CrawlerElementNotFoundError',
+)<{
+  cause?: unknown
+  message?: string
+}> {}
+
+const getBrowser = (options?: Parameters<typeof launch>[0]) =>
+  Effect.acquireRelease(
+    Effect.tryPromise({
+      try: () =>
+        launch(options).then((res) => {
+          return res
+        }),
+      catch: (e) =>
+        new CrawlerError({ cause: e, message: 'Error launching browser' }),
+    }),
+    (browser) => Effect.promise(() => browser.close()),
+  )
+
+interface CrawlerImpl {
+  use: <T>(
+    fn: (client: Awaited<ReturnType<typeof launch>>) => T,
+  ) => Effect.Effect<Awaited<T>, CrawlerError, never>
+}
+
+export class Crawler extends Context.Tag('Crawler')<Crawler, CrawlerImpl>() {}
+
+export const make = (options?: Parameters<typeof launch>[0]) =>
+  Effect.gen(function* () {
+    const browser = yield* getBrowser(options)
+
+    return Crawler.of({
+      use: (fn) =>
+        Effect.gen(function* () {
+          const result = yield* Effect.try({
+            try: () => fn(browser),
+            catch: (e) => {
+              return new CrawlerError({
+                cause: e,
+                message: `Crawler error: ${e}`,
+              })
+            },
+          })
+          if (result instanceof Promise) {
+            return yield* Effect.tryPromise({
+              try: () => result,
+              catch: (e) =>
+                new CrawlerError({
+                  cause: e,
+                  message: 'Asyncronous error in `Crawler.use`',
+                }),
+            })
+          } else {
+            return result
+          }
+        }),
+    })
+  })
+
+export const CrawlerLayer = (options?: Parameters<typeof launch>[0]) =>
+  Layer.scoped(Crawler, make(options))

src/lib/server/crawler/openPage.ts

@@ -0,0 +1,46 @@
+import { Effect } from 'effect'
+import {
+  Crawler,
+  CrawlerError,
+  CrawlerHttpError,
+  CrawlerPageNotFoundError,
+} from './index'
+
+export const openPage = (url: string) =>
+  Effect.gen(function* () {
+    const browser = yield* Crawler
+
+    const page = yield* browser.use((b) =>
+      Effect.gen(function* () {
+        const page = yield* Effect.promise(() => b.newPage())
+
+        const res = yield* Effect.tryPromise({
+          try: () => page.goto(url),
+          catch: (e) =>
+            new CrawlerError({
+              message: `Error opening page: ${url}`,
+              cause: e,
+            }),
+        })
+
+        if (!res) {
+          return yield* Effect.fail(
+            new CrawlerPageNotFoundError({ message: 'Page not found' }),
+          )
+        }
+
+        if (res.ok()) {
+          return page
+        }
+
+        return yield* Effect.fail(
+          new CrawlerHttpError({
+            message: res.statusText(),
+            cause: res.status(),
+          }),
+        )
+      }),
+    )
+
+    return yield* page
+  })

src/lib/server/db/DB.ts

@@ -0,0 +1,81 @@
+import { drizzle } from 'drizzle-orm/libsql'
+
+import { Config, Context, Data, Effect, Layer } from 'effect'
+import { createClient } from '@libsql/client'
+import { user } from './user'
+import { session } from './session'
+
+export const tables = { user, session }
+
+export class DbError extends Data.TaggedError('DbError')<{
+	cause?: unknown
+	message?: string
+}> {}
+
+export class DbOptimisticLockingError extends Data.TaggedError('DbOptimisticLockingError')<{
+	cause?: unknown
+	message?: string
+}> {}
+
+interface DbImpl {
+	use: <T>(
+		fn: (client: ReturnType<typeof drizzle>) => T,
+	) => Effect.Effect<Awaited<T>, DbError, never>
+	insert: (input: number) => Effect.Effect<void, DbError | DbOptimisticLockingError, never>
+}
+export class Db extends Context.Tag('Db')<Db, DbImpl>() {}
+
+export const make = (options: Parameters<typeof createClient>[0]) =>
+	Effect.gen(function* () {
+		const client = yield* Effect.acquireRelease(
+			Effect.try({
+				try: () => drizzle(createClient(options), { schema: tables }),
+				catch: (e) => new DbError({ cause: e, message: 'Error connecting' }),
+			}),
+			() => Effect.sync(() => Effect.logInfo('Disconnect Db')),
+		)
+		return Db.of({
+			insert: (n: number) => {
+				if (n === 0) {
+					throw new DbOptimisticLockingError({ message: 'OptimisticLocking failed with version 1' })
+				}
+
+				return Effect.succeed(undefined)
+			},
+			use: (fn) =>
+				Effect.gen(function* () {
+					const result = yield* Effect.try({
+						try: () => fn(client),
+						catch: (e) => {
+							return new DbError({
+								cause: e,
+								message: `DB error: ${e}`,
+							})
+						},
+					})
+					if (result instanceof Promise) {
+						return yield* Effect.tryPromise({
+							try: () => result,
+							catch: (e) =>
+								new DbError({
+									cause: e,
+									message: 'Asyncronous error in `Db.use`',
+								}),
+						})
+					} else {
+						return result
+					}
+				}),
+		})
+	})
+
+export const layer = (options: Parameters<typeof createClient>[0]) =>
+	Layer.scoped(Db, make(options))
+
+export const fromEnv = Layer.scoped(
+	Db,
+	Effect.gen(function* () {
+		const url = yield* Config.string('DATABASE_URL')
+		return yield* make({ url })
+	}),
+)

src/lib/server/db/index.ts

@@ -0,0 +1,73 @@
+import { drizzle } from 'drizzle-orm/libsql'
+
+import { env } from '$env/dynamic/private'
+
+import { Config, Context, Data, Effect, Layer } from 'effect'
+import { createClient } from '@libsql/client'
+import { user } from './user'
+import { session } from './session'
+
+export const tables = { user, session }
+
+export class DbError extends Data.TaggedError('DbError')<{
+	cause?: unknown
+	message?: string
+}> {}
+
+interface DbImpl {
+	use: <T>(
+		fn: (client: ReturnType<typeof drizzle>) => T
+	) => Effect.Effect<Awaited<T>, DbError, never>
+}
+export class Db extends Context.Tag('Db')<Db, DbImpl>() {}
+
+export const make = (options: Parameters<typeof createClient>[0]) =>
+	Effect.gen(function* () {
+		const client = yield* Effect.acquireRelease(
+			Effect.try({
+				try: () => drizzle(createClient(options), { schema: tables }),
+				catch: (e) => new DbError({ cause: e, message: 'Error connecting' })
+			}),
+			() => Effect.sync(() => Effect.logInfo('Disconnect Db'))
+		)
+		return Db.of({
+			use: (fn) =>
+				Effect.gen(function* () {
+					const result = yield* Effect.try({
+						try: () => fn(client),
+						catch: (e) =>
+							new DbError({
+								cause: e,
+								message: 'Syncronous error in `Db.use`'
+							})
+					})
+					if (result instanceof Promise) {
+						return yield* Effect.tryPromise({
+							try: () => result,
+							catch: (e) =>
+								new DbError({
+									cause: e,
+									message: 'Asyncronous error in `Db.use`'
+								})
+						})
+					} else {
+						return result
+					}
+				})
+		})
+	})
+
+export const layer = (options: Parameters<typeof createClient>[0]) =>
+	Layer.scoped(Db, make(options))
+
+export const fromEnv = Layer.scoped(
+	Db,
+	Effect.gen(function* () {
+		const url = yield* Config.string('DATABASE_URL')
+		return yield* make({ url })
+	})
+)
+
+const client = createClient({ url: env.DATABASE_URL })
+
+export const db = drizzle(client, { schema: tables })

src/lib/server/db/session.ts

@@ -0,0 +1,58 @@
+import { integer, sqliteTable, text } from 'drizzle-orm/sqlite-core'
+import { eq } from 'drizzle-orm'
+import { user } from './user'
+import { Duration, Effect } from 'effect'
+
+import * as DB from './DB'
+
+export const session = sqliteTable('session', {
+	id: text('id').primaryKey(),
+	userId: text('user_id')
+		.notNull()
+		.references(() => user.id),
+	expiresAt: integer('expires_at', { mode: 'timestamp' }).notNull(),
+})
+
+export type Session = typeof session.$inferSelect
+
+export const getSessionData = (sessionId: string) =>
+	Effect.gen(function* () {
+		const db = yield* DB.Db
+
+		const result = yield* db.use(
+			async (db) =>
+				await db
+					.select({
+						user: { id: user.id, username: user.username },
+						session: session,
+					})
+					.from(session)
+					.innerJoin(user, eq(session.userId, user.id))
+					.where(eq(session.id, sessionId)),
+		)
+		return result.at(0)
+	}).pipe(Effect.provide(DB.fromEnv))
+
+export const deleteSession = (sessionId: string) =>
+	Effect.gen(function* () {
+		const db = yield* DB.Db
+		yield* db.use((db) => db.delete(DB.tables.session).where(eq(DB.tables.session.id, sessionId)))
+	}).pipe(Effect.provide(DB.fromEnv))
+
+export const renewSession = (session: Session) =>
+	Effect.gen(function* () {
+		const db = yield* DB.Db
+
+		const DAY_IN_MS = Duration.toMillis(Duration.days(1))
+
+		const renewSession = Date.now() >= session.expiresAt.getTime() - DAY_IN_MS * 15
+		if (renewSession) {
+			session.expiresAt = new Date(Date.now() + DAY_IN_MS * 30)
+			yield* db.use((db) =>
+				db
+					.update(DB.tables.session)
+					.set({ expiresAt: session.expiresAt })
+					.where(eq(DB.tables.session.id, session.id)),
+			)
+		}
+	}).pipe(Effect.provide(DB.fromEnv))

src/lib/server/db/user.ts

@@ -0,0 +1,10 @@
+import { integer, sqliteTable, text } from 'drizzle-orm/sqlite-core'
+
+export const user = sqliteTable('user', {
+	id: text('id').primaryKey(),
+	age: integer('age'),
+	username: text('username').notNull().unique(),
+	passwordHash: text('password_hash').notNull()
+})
+
+export type User = typeof user.$inferSelect

src/lib/server/utils.ts

@@ -0,0 +1,4 @@
+import { Effect } from 'effect'
+
+export const withOperation = (operationName: string) =>
+  Effect.annotateLogs({ operation: operationName })

src/routes/+layout.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+	import '../app.css'
+	import favicon from '$lib/assets/favicon.svg'
+
+	let { children } = $props()
+</script>
+
+<svelte:head>
+	<link rel="icon" href={favicon} />
+</svelte:head>
+
+{@render children?.()}

src/routes/+page.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+  async function crawlClevertronik() {
+    const response = await fetch('/crawl', { method: 'POST' })
+    const productName = await response.json()
+    console.log(productName)
+  }
+</script>
+
+<h1>Welcome to SvelteKit</h1>
+<p>
+  Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the
+  documentation
+</p>
+
+<button onclick={crawlClevertronik}>lets do it</button>

src/routes/crawl/+server.ts

@@ -0,0 +1,22 @@
+import { crawlClevertronik } from '$lib/server/crawler/clevertronik'
+import { json, error } from '@sveltejs/kit'
+import { Effect } from 'effect'
+
+export async function POST() {
+  try {
+    const pageContent = await Effect.runPromise(
+      crawlClevertronik.pipe(Effect.annotateLogs({ route: 'crawl' })),
+    )
+    return json(pageContent)
+  } catch (e) {
+    if (
+      e &&
+      typeof e === 'object' &&
+      'message' in e &&
+      typeof e.message === 'string'
+    ) {
+      return error(500, { message: e.message })
+    }
+    return error(500, { message: 'Internal Error' })
+  }
+}

src/routes/demo/+page.svelte

@@ -0,0 +1,2 @@
+<a href="/demo/paraglide">paraglide</a>
+<a href="/demo/lucia">lucia</a>

src/routes/demo/lucia/+page.server.ts

@@ -0,0 +1,31 @@
+import * as auth from '$lib/server/auth'
+import { fail, redirect } from '@sveltejs/kit'
+import { getRequestEvent } from '$app/server'
+import type { Actions, PageServerLoad } from './$types'
+
+export const load: PageServerLoad = async () => {
+	const user = requireLogin()
+	return { user }
+}
+
+export const actions: Actions = {
+	logout: async (event) => {
+		if (!event.locals.session) {
+			return fail(401)
+		}
+		await auth.invalidateSession(event.locals.session.id)
+		auth.deleteSessionTokenCookie(event)
+
+		return redirect(302, '/demo/lucia/login')
+	}
+}
+
+function requireLogin() {
+	const { locals } = getRequestEvent()
+
+	if (!locals.user) {
+		return redirect(302, '/demo/lucia/login')
+	}
+
+	return locals.user
+}

src/routes/demo/lucia/+page.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+	import { enhance } from '$app/forms'
+	import type { PageServerData } from './$types'
+
+	let { data }: { data: PageServerData } = $props()
+</script>
+
+<h1>Hi, {data.user.username}!</h1>
+<p>Your user ID is {data.user.id}.</p>
+<form method="post" action="?/logout" use:enhance>
+	<button>Sign out</button>
+</form>

src/routes/demo/lucia/login/+page.server.ts

@@ -0,0 +1,107 @@
+import { hash, verify } from '@node-rs/argon2'
+import { encodeBase32LowerCase } from '@oslojs/encoding'
+import { fail, redirect } from '@sveltejs/kit'
+import { eq } from 'drizzle-orm'
+import * as auth from '$lib/server/auth'
+import { db } from '$lib/server/db'
+import { user } from '$lib/server/db/user'
+import type { Actions, PageServerLoad } from './$types'
+
+export const load: PageServerLoad = async (event) => {
+	if (event.locals.user) {
+		return redirect(302, '/demo/lucia')
+	}
+	return {}
+}
+
+export const actions: Actions = {
+	login: async (event) => {
+		const formData = await event.request.formData()
+		const username = formData.get('username')
+		const password = formData.get('password')
+
+		if (!validateUsername(username)) {
+			return fail(400, {
+				message: 'Invalid username (min 3, max 31 characters, alphanumeric only)'
+			})
+		}
+		if (!validatePassword(password)) {
+			return fail(400, { message: 'Invalid password (min 6, max 255 characters)' })
+		}
+
+		const results = await db.select().from(user).where(eq(user.username, username))
+
+		const existingUser = results.at(0)
+		if (!existingUser) {
+			return fail(400, { message: 'Incorrect username or password' })
+		}
+
+		const validPassword = await verify(existingUser.passwordHash, password, {
+			memoryCost: 19456,
+			timeCost: 2,
+			outputLen: 32,
+			parallelism: 1
+		})
+		if (!validPassword) {
+			return fail(400, { message: 'Incorrect username or password' })
+		}
+
+		const sessionToken = auth.generateSessionToken()
+		const session = await auth.createSession(sessionToken, existingUser.id)
+		auth.setSessionTokenCookie(event, sessionToken, session.expiresAt)
+
+		return redirect(302, '/demo/lucia')
+	},
+	register: async (event) => {
+		const formData = await event.request.formData()
+		const username = formData.get('username')
+		const password = formData.get('password')
+
+		if (!validateUsername(username)) {
+			return fail(400, { message: 'Invalid username' })
+		}
+		if (!validatePassword(password)) {
+			return fail(400, { message: 'Invalid password' })
+		}
+
+		const userId = generateUserId()
+		const passwordHash = await hash(password, {
+			// recommended minimum parameters
+			memoryCost: 19456,
+			timeCost: 2,
+			outputLen: 32,
+			parallelism: 1
+		})
+
+		try {
+			await db.insert(user).values({ id: userId, username, passwordHash })
+
+			const sessionToken = auth.generateSessionToken()
+			const session = await auth.createSession(sessionToken, userId)
+			auth.setSessionTokenCookie(event, sessionToken, session.expiresAt)
+		} catch {
+			return fail(500, { message: 'An error has occurred' })
+		}
+		return redirect(302, '/demo/lucia')
+	}
+}
+
+function generateUserId() {
+	// ID with 120 bits of entropy, or about the same as UUID v4.
+	const bytes = crypto.getRandomValues(new Uint8Array(15))
+	const id = encodeBase32LowerCase(bytes)
+	return id
+}
+
+function validateUsername(username: unknown): username is string {
+	return (
+		typeof username === 'string' &&
+		username.length >= 3 &&
+		username.length <= 31 &&
+		/^[a-z0-9_-]+$/.test(username)
+	)
+}
+
+function validatePassword(password: unknown): password is string {
+	return typeof password === 'string' && password.length >= 6 && password.length <= 255
+}

src/routes/demo/lucia/login/+page.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	import { enhance } from '$app/forms'
+	import type { ActionData } from './$types'
+
+	let { form }: { form: ActionData } = $props()
+</script>
+
+<h1>Login/Register</h1>
+<form method="post" action="?/login" use:enhance>
+	<label>
+		Username
+		<input
+			name="username"
+			class="mt-1 rounded-md border border-gray-300 bg-white px-3 py-2 shadow-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none"
+		/>
+	</label>
+	<label>
+		Password
+		<input
+			type="password"
+			name="password"
+			class="mt-1 rounded-md border border-gray-300 bg-white px-3 py-2 shadow-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none"
+		/>
+	</label>
+	<button class="rounded-md bg-blue-600 px-4 py-2 text-white transition hover:bg-blue-700"
+		>Login</button
+	>
+	<button
+		formaction="?/register"
+		class="rounded-md bg-blue-600 px-4 py-2 text-white transition hover:bg-blue-700"
+		>Register</button
+	>
+</form>
+<p style="color: red">{form?.message ?? ''}</p>

src/routes/demo/paraglide/+page.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import { setLocale } from '$lib/paraglide/runtime'
+	import { page } from '$app/state'
+	import { goto } from '$app/navigation'
+	import { m } from '$lib/paraglide/messages.js'
+</script>
+
+<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>
+<div>
+	<button onclick={() => setLocale('en')}>en</button>
+	<button onclick={() => setLocale('es')}>es</button>
+	<button onclick={() => setLocale('de-de')}>de-de</button>
+</div>
+<p>
+	If you use VSCode, install the <a
+		href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension"
+		target="_blank">Sherlock i18n extension</a
+	> for a better i18n experience.
+</p>

static/robots.txt

@@ -0,0 +1,3 @@
+# allow crawling everything by default
+User-agent: *
+Disallow:

svelte.config.js

@@ -0,0 +1,17 @@
+import adapter from '@sveltejs/adapter-auto'
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	// Consult https://svelte.dev/docs/kit/integrations
+	// for more information about preprocessors
+	preprocess: vitePreprocess(),
+	kit: {
+		// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
+		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
+		// See https://svelte.dev/docs/kit/adapters for more information about adapters.
+		adapter: adapter()
+	}
+}
+
+export default config

tsconfig.json

@@ -0,0 +1,19 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"moduleResolution": "bundler"
+	}
+	// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
+	// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
+	//
+	// To make changes to top-level options such as include and exclude, we recommend extending
+	// the generated config; see https://svelte.dev/docs/kit/configuration#typescript
+}

vite.config.ts

@@ -0,0 +1,17 @@
+import { paraglideVitePlugin } from '@inlang/paraglide-js'
+import devtoolsJson from 'vite-plugin-devtools-json'
+import tailwindcss from '@tailwindcss/vite'
+import { sveltekit } from '@sveltejs/kit/vite'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+	plugins: [
+		tailwindcss(),
+		sveltekit(),
+		devtoolsJson(),
+		paraglideVitePlugin({
+			project: './project.inlang',
+			outdir: './src/lib/paraglide'
+		})
+	]
+})