@revenexx/cover 0.1.0

package/app/interfaces/market.ts

@@ -0,0 +1,24 @@
+/**
+ * Storefront view of the markets app: a market bundles currency and
+ * locales (language + country); the locale selector is driven by this.
+ */
+export interface ShopMarketLocale {
+	/** BCP-47 code, e.g. "de-DE". */
+	code: string;
+	/** ISO 639-1 language, e.g. "de" — matched against the UI locales. */
+	language: string;
+	/** ISO 3166-1 alpha-2 country, e.g. "DE". */
+	country: string;
+	isDefault: boolean;
+}
+
+export interface ShopMarket {
+	id: string;
+	/** Stable market code, e.g. "de". */
+	code: string;
+	name: string;
+	/** ISO 4217, e.g. "EUR". */
+	currency: string;
+	isDefault: boolean;
+	locales: ShopMarketLocale[];
+}

package/app/interfaces/payment.ts

@@ -0,0 +1,19 @@
+/**
+ * Payment method codes come from the payments app (live) or the demo
+ * profile (mock) — generic strings, e.g. "invoice", "card", "paypal",
+ * "po_number". The demo-only methods po_number/cost_center keep their
+ * extra input fields in the checkout.
+ */
+export type PaymentMethod = string;
+
+export interface PaymentOption {
+	method: PaymentMethod;
+	label: string;
+	/** Payment terms shown beneath the method (e.g. "30 days net"). */
+	description?: string;
+	/** Surcharge for this method at the current order value. */
+	fee?: number;
+	feeType?: "none" | "fixed" | "percent";
+	/** self_managed | psp — informational. */
+	kind?: string;
+}

package/app/interfaces/persisted-cart.ts

@@ -0,0 +1,10 @@
+import type { Requisition } from "../interfaces/b2b";
+import type { CartItem } from "../interfaces/cart-item";
+
+export type CartRequisitionMeta = Omit<Requisition, "items">;
+
+export interface PersistedCart {
+	readonly items: CartItem[];
+	readonly requisitions?: CartRequisitionMeta[];
+	readonly lastActivityAt: string;
+}

package/app/interfaces/product-detail.ts

@@ -0,0 +1,54 @@
+export interface ProductDetailProduct {
+	id: string;
+	version: number;
+	name: string;
+	sku: string;
+	manufacturer: string;
+	createdAt: string;
+	updatedAt: string;
+	deletedAt: string | null;
+	available: boolean;
+}
+
+export interface ProductDetailStock {
+	quantity: number;
+	maxOrderQuantity: number;
+}
+
+export interface ProductDetailTax {
+	rate: number;
+	includedInPrice?: boolean;
+}
+
+export interface ProductDetailDescription {
+	type: string;
+	content: string;
+}
+
+export interface ProductDetailCategory {
+	type: string;
+	name: string;
+}
+
+export interface ProductDetailImage {
+	type: string;
+	priority: number;
+	url: string;
+}
+
+export interface ProductDetailAttribute {
+	id: number;
+	name: string;
+	value: string;
+}
+
+export interface ProductDetail {
+	product: ProductDetailProduct[];
+	stocks: ProductDetailStock[];
+	tax: ProductDetailTax;
+	descriptions: ProductDetailDescription[];
+	categories: ProductDetailCategory[];
+	images: ProductDetailImage[];
+	attributes: ProductDetailAttribute[];
+	prices: { [key: string]: number }[];
+}

package/app/interfaces/product-list.ts

@@ -0,0 +1,33 @@
+export interface ProductListStock {
+	quantity: number;
+	maxOrderQuantity: number;
+}
+
+export interface ProductListTax {
+	rate: number;
+	includedInPrice?: boolean;
+}
+
+export interface ProductList {
+	/** Platform entity id — UUID live, numeric string in demo data. */
+	id: string;
+	sku: string;
+	name: string;
+	available: boolean;
+	isOutOfStock?: boolean;
+	prices: { [key: string]: number }[];
+	stocks?: ProductListStock[];
+	tax: ProductListTax;
+	maxOrderQuantity?: number;
+	image: string;
+	category: string;
+	categorySlug: string;
+	subcategory?: string;
+	subcategorySlug?: string;
+}
+
+export interface ProductPriceTier {
+	quantity: number;
+	totalCents: number;
+	unitCents: number;
+}

package/app/interfaces/search-facets.ts

@@ -0,0 +1,14 @@
+export interface FacetCount {
+	value: string;
+	count: number;
+}
+
+export interface SearchFacet {
+	fieldName: string;
+	counts: FacetCount[];
+}
+
+export interface PriceRange {
+	min?: number;
+	max?: number;
+}

package/app/interfaces/validation.ts

@@ -0,0 +1,14 @@
+import type { CrossFieldValidator, SimpleValidator } from "../validations/types";
+
+export type FormKey = "login" | "register" | "forgotPassword" | "resetPassword" | "accountProfile" | "accountAddress";
+
+export interface FieldValidationRule {
+	readonly kind: "simple" | "cross";
+	readonly fn: SimpleValidator | CrossFieldValidator;
+	readonly options?: Readonly<Record<string, unknown>>;
+}
+
+export interface FieldConfig {
+	readonly field: string;
+	readonly rules: ReadonlyArray<FieldValidationRule>;
+}

package/app/layouts/default.vue

@@ -0,0 +1,78 @@
+<script setup lang="ts">
+const head = useLocaleHead({ seo: true });
+const { query: searchQuery } = useSearch();
+const route = useRoute();
+const cart = useCartStore();
+
+const isCartOrCheckoutPage = computed(() => /\/(cart|checkout)(\/|$)/.test(route.path));
+
+watch(isCartOrCheckoutPage, (isRestrictedPage) => {
+	if (isRestrictedPage) {
+		cart.closeCart();
+	}
+}, { immediate: true });
+
+async function handleSearch(q: string): Promise<void> {
+	searchQuery.value = q;
+	await navigateTo("/search");
+}
+</script>
+
+<template>
+	<Html
+		:lang="head.htmlAttrs?.lang"
+		:dir="head.htmlAttrs?.dir"
+	>
+		<Head>
+			<template
+				v-for="link in head.link"
+				:key="link.id"
+			>
+				<Link
+					:id="link.id"
+					:rel="link.rel"
+					:href="link.href"
+					:hreflang="link.hreflang"
+				/>
+			</template>
+			<template
+				v-for="meta in head.meta"
+				:key="meta.id"
+			>
+				<Meta
+					:id="meta.id"
+					:property="meta.property"
+					:content="meta.content"
+				/>
+			</template>
+		</Head>
+		<Body>
+			<div class="flex flex-col min-h-screen">
+				<a
+					href="#main-content"
+					tabindex="0"
+					class="sr-only focus:not-sr-only focus:absolute focus:z-50 focus:top-4 focus:left-4
+				focus:px-4 focus:py-2 focus:bg-(--ui-primary) focus:text-white focus:rounded-lg"
+				>
+					Skip to main content
+				</a>
+				<LayoutHeaderTopBar />
+				<LayoutHeaderAppBar />
+				<div class="md:hidden border-b border-(--ui-border) px-4 py-2">
+					<UiFormsSearchInput
+						class="w-full"
+						@search="handleSearch"
+					/>
+				</div>
+				<LayoutHeaderMainNav />
+				<UiDebugPiniaStateCard v-if="false" />
+				<UMain id="main-content">
+					<slot />
+				</UMain>
+				<LayoutFooter />
+				<CartDrawer v-if="!isCartOrCheckoutPage" />
+				<CartTargetModal />
+			</div>
+		</Body>
+	</Html>
+</template>

package/app/layouts/focus.vue

@@ -0,0 +1,80 @@
+<script setup lang="ts">
+import { legalLinks, shopContact } from "../config/navigation";
+
+// Distraction-free layout for conversion-critical pages — authentication
+// (login, register, recovery) and the checkout funnel. No shop chrome:
+// logo + back link on top, the page content, and a slim footer with the
+// essential links (contact + legal).
+const { t } = useI18n();
+const localePath = useLocalePath();
+const head = useLocaleHead({ seo: true });
+const year = new Date().getFullYear();
+
+// Checkout gets a subtly tinted page background so the white section
+// cards and the summary stand out from the canvas.
+const route = useRoute();
+const tinted = computed(() => /\/checkout(\/|$)/.test(route.path));
+</script>
+
+<template>
+	<Html
+		:lang="head.htmlAttrs?.lang"
+		:dir="head.htmlAttrs?.dir"
+	>
+		<Body>
+			<div
+				class="min-h-screen flex flex-col"
+				:class="tinted ? 'bg-elevated/50' : ''"
+			>
+				<div class="w-full max-w-(--ui-container) mx-auto px-4 sm:px-6 lg:px-8 flex-1 pb-20">
+					<header class="pt-10 flex items-center">
+						<div class="flex-1">
+							<LayoutAppLogo />
+						</div>
+						<NuxtLink
+							:to="localePath('/')"
+							tabindex="0"
+							class="hover:underline underline-offset-4 decoration-2 text-sm"
+						>
+							{{ t('nav.backToShop') }}
+						</NuxtLink>
+					</header>
+					<main>
+						<slot />
+					</main>
+				</div>
+
+				<footer class="border-t border-default mt-auto">
+					<div
+						class="w-full max-w-(--ui-container) mx-auto px-4 sm:px-6 lg:px-8 py-5
+						flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3"
+					>
+						<p class="text-xs text-dimmed">
+							{{ t('footer.copyright', { year }) }}
+						</p>
+						<nav
+							class="flex flex-wrap gap-x-5 gap-y-2"
+							aria-label="Legal"
+						>
+							<a
+								:href="`mailto:${shopContact.email}`"
+								class="text-xs text-dimmed hover:text-default transition-colors"
+							>
+								{{ shopContact.email }}
+							</a>
+							<NuxtLink
+								v-for="link in legalLinks"
+								:key="link.to"
+								:to="link.to"
+								tabindex="0"
+								class="text-xs text-dimmed hover:text-default transition-colors"
+							>
+								{{ link.label }}
+							</NuxtLink>
+						</nav>
+					</div>
+				</footer>
+			</div>
+		</Body>
+	</Html>
+</template>

package/app/plugins/formkit-locale.client.ts

@@ -0,0 +1,23 @@
+import type { Composer } from "vue-i18n";
+
+import { changeLocale } from "@formkit/vue";
+
+/**
+ * Keeps FormKit's built-in validation messages (required, matches, …) in
+ * sync with the app locale. The form schemas themselves are translated
+ * server-side per request; this only switches FormKit's locale pack.
+ */
+export default defineNuxtPlugin((nuxtApp) => {
+	const i18n = nuxtApp.$i18n as Composer | undefined;
+	if (!i18n) {
+		return;
+	}
+
+	watch(
+		i18n.locale,
+		(locale) => {
+			changeLocale(locale);
+		},
+		{ immediate: true },
+	);
+});

package/app/shared/constants.ts

@@ -0,0 +1 @@
+export const EMAIL_VALIDATION_REGEX = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\.[a-zA-Z]{2,}$/;

package/app/validations/companyName.ts

@@ -0,0 +1,18 @@
+import type { SimpleValidator } from "./types";
+
+// checks if the input is a valid company name (basic validation)
+export const companyName: SimpleValidator = (value) => {
+	const companyNameRegex = /^[a-zA-Z0-9äöüÄÖÜß\s.,'-]+$/;
+
+	if (typeof value !== "string") {
+		return null; // Not a string, let other validators handle this
+	}
+
+	const trimmedValue = value.trim();
+
+	if (!companyNameRegex.test(trimmedValue)) {
+		return "invalidCompanyName"; // Invalid company name format
+	}
+
+	return null; // Valid company name
+};

package/app/validations/emailFormat.ts

@@ -0,0 +1,10 @@
+import { EMAIL_VALIDATION_REGEX } from "../shared/constants";
+
+import type { SimpleValidator } from "./types";
+
+export const emailFormat: SimpleValidator = (value) => {
+	if (typeof value !== "string" || !EMAIL_VALIDATION_REGEX.test(value)) {
+		return "auth.register.errors.emailFormat";
+	}
+	return null;
+};

package/app/validations/formValidationConfig.ts

@@ -0,0 +1,50 @@
+import type { FieldConfig, FormKey } from "../interfaces/validation";
+
+import { companyName } from "./companyName";
+import { emailFormat } from "./emailFormat";
+import { maxLength } from "./maxLength";
+import { minLength } from "./minLength";
+import { optionalCompanyName } from "./optionalCompanyName";
+import { passwordsMatch } from "./passwordsMatch";
+import { phoneNumber } from "./phoneNumber";
+import { required } from "./required";
+import { termsRequired } from "./termsRequired";
+import { zipCode } from "./zipCode";
+
+export const formValidationConfig: Record<FormKey, FieldConfig[]> = {
+	login: [
+		{ field: "email", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: emailFormat }] },
+		{ field: "password", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 8 } }] },
+	],
+	register: [
+		{ field: "email", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: emailFormat }] },
+		{ field: "password", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 8 } }] },
+		{ field: "passwordConfirm", rules: [{ kind: "cross", fn: passwordsMatch }] },
+		{ field: "firstName", rules: [{ kind: "simple", fn: required }] },
+		{ field: "lastName", rules: [{ kind: "simple", fn: required }] },
+		{ field: "company", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: companyName }] },
+		{ field: "acceptTerms", rules: [{ kind: "simple", fn: termsRequired }] },
+	],
+	forgotPassword: [
+		{ field: "email", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: emailFormat }] },
+	],
+	resetPassword: [
+		{ field: "password", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 8 } }] },
+		{ field: "passwordConfirm", rules: [{ kind: "cross", fn: passwordsMatch }] },
+	],
+	accountProfile: [
+		{ field: "phone", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: maxLength, options: { max: 16 } }, { kind: "simple", fn: phoneNumber }, { kind: "simple", fn: minLength, options: { min: 8 } }] },
+		{ field: "company", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: maxLength, options: { max: 64 } }, { kind: "simple", fn: minLength, options: { min: 3 } }, { kind: "simple", fn: companyName }] },
+	],
+	accountAddress: [
+		{ field: "label", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 2 } }] },
+		{ field: "firstName", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 2 } }] },
+		{ field: "lastName", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 2 } }] },
+		{ field: "street", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 2 } }] },
+		{ field: "streetNumber", rules: [{ kind: "simple", fn: required }] },
+		{ field: "city", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: minLength, options: { min: 2 } }] },
+		{ field: "zip", rules: [{ kind: "simple", fn: required }, { kind: "simple", fn: zipCode }] },
+		{ field: "country", rules: [{ kind: "simple", fn: required }] },
+		{ field: "company", rules: [{ kind: "simple", fn: optionalCompanyName, options: { min: 3, max: 64 } }] },
+	],
+};

package/app/validations/maxLength.ts

@@ -0,0 +1,12 @@
+import type { SimpleValidator } from "./types";
+
+export const maxLength: SimpleValidator = (value, options) => {
+	const max = (options?.max as number) ?? Infinity;
+	if (typeof value !== "string") {
+		return null;
+	}
+	if (value.trim().length > max) {
+		return "maxLength";
+	}
+	return null;
+};

package/app/validations/minLength.ts

@@ -0,0 +1,9 @@
+import type { SimpleValidator } from "./types";
+
+export const minLength: SimpleValidator = (value, options) => {
+	const min = (options?.min as number) ?? 0;
+	if (typeof value !== "string" || value.length < min) {
+		return "minLength";
+	}
+	return null;
+};

package/app/validations/optionalCompanyName.ts

@@ -0,0 +1,23 @@
+import type { SimpleValidator } from "./types";
+
+// Validates company name only when a value is present — field is optional.
+// Options { min, max } are forwarded to minLength/maxLength translation keys.
+export const optionalCompanyName: SimpleValidator = (value) => {
+	if (typeof value !== "string" || value.trim() === "") {
+		return null;
+	}
+	const trimmed = value.trim();
+	const min = 3;
+	const max = 64;
+	if (trimmed.length < min) {
+		return "minLength";
+	}
+	if (trimmed.length > max) {
+		return "maxLength";
+	}
+	const companyNameRegex = /^[a-zA-Z0-9äöüÄÖÜß\s.,'-]+$/;
+	if (!companyNameRegex.test(trimmed)) {
+		return "invalidCompanyName";
+	}
+	return null;
+};

package/app/validations/passwordsMatch.ts

@@ -0,0 +1,5 @@
+import type { CrossFieldValidator } from "./types";
+
+export const passwordsMatch: CrossFieldValidator = (value, state) => {
+	return value !== state.password ? "auth.register.errors.passwordsMismatch" : null;
+};

package/app/validations/phoneNumber.ts

@@ -0,0 +1,19 @@
+import type { SimpleValidator } from "./types";
+
+// checks if the input is a valid phone number (basic validation)
+export const phoneNumber: SimpleValidator = (value) => {
+	if (typeof value !== "string") {
+		return null; // Not a string, let other validators handle this
+	}
+
+	const trimmedValue = value.trim();
+
+	// Basic regex for phone numbers (allows digits, spaces, dashes, parentheses, and plus sign)
+	const phoneRegex = /^[+\d]?(?:[\d\s-().]*)$/;
+
+	if (!phoneRegex.test(trimmedValue)) {
+		return "invalidPhoneNumber"; // Invalid phone number format
+	}
+
+	return null; // Valid phone number
+};

package/app/validations/required.ts

@@ -0,0 +1,11 @@
+import type { SimpleValidator } from "./types";
+
+export const required: SimpleValidator = (value) => {
+	if (typeof value === "boolean") {
+		return value === false ? "required" : null;
+	}
+	if (typeof value === "string") {
+		return value.trim() === "" ? "required" : null;
+	}
+	return value === null || value === undefined ? "required" : null;
+};

package/app/validations/termsRequired.ts

@@ -0,0 +1,4 @@
+import type { SimpleValidator } from "./types";
+
+export const termsRequired: SimpleValidator = value =>
+	value !== true ? "termsRequired" : null;

package/app/validations/types.ts

@@ -0,0 +1,10 @@
+export type SimpleValidator = (
+	value: unknown,
+	options?: Record<string, unknown>,
+) => string | null;
+
+export type CrossFieldValidator = (
+	value: unknown,
+	state: Record<string, unknown>,
+	options?: Record<string, unknown>,
+) => string | null;

package/app/validations/zipCode.ts

@@ -0,0 +1,15 @@
+import type { SimpleValidator } from "./types";
+
+export const zipCode: SimpleValidator = (value) => {
+	if (typeof value !== "string") {
+		return "invalidZipCode";
+	}
+	const trimmed = value.trim();
+	if (!/^\d{3,5}$/.test(trimmed)) {
+		return "invalidZipCode";
+	}
+	if (/^0+$/.test(trimmed) || trimmed === "99999") {
+		return "invalidZipCode";
+	}
+	return null;
+};