@saasicat/ui-vue 0.5.0 → 0.7.0

package/src/pages-standard/plan-versions/VersionDiffPreview.vue

@@ -1,167 +0,0 @@
-<template>
-    <div v-if="!changes || changes.length === 0" class="sa-pv-diff-preview__empty">
-        Keine Änderungen gegenüber der Vorgängerversion.
-    </div>
-    <div v-else class="sa-pv-diff-preview__list">
-        <div
-            v-for="(c, idx) in changes"
-            :key="idx"
-            class="sa-pv-diff-preview__row"
-            :class="rowClass(c.direction)"
-        >
-            <div class="sa-pv-diff-preview__direction">
-                <q-icon :name="iconFor(c.direction)" size="16px" />
-                <span>{{ labelFor(c.direction) }}</span>
-            </div>
-            <div class="sa-pv-diff-preview__field">{{ humanFieldLabel(c.field) }}</div>
-            <div class="sa-pv-diff-preview__values">
-                <span v-if="c.field !== 'features.added'" class="old">{{
-                    formatValue(c.oldValue)
-                }}</span>
-                <q-icon
-                    v-if="c.field !== 'features.added' && c.field !== 'features.removed'"
-                    name="arrow_forward"
-                    size="14px"
-                />
-                <span v-if="c.field !== 'features.removed'" class="new">{{
-                    formatValue(c.newValue)
-                }}</span>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import type { VersionChange } from '@saasicat/types';
-
-const props = defineProps<{
-    changes?: VersionChange[] | null;
-    /**
-     * Optional: field labels (e.g. `{ maxUsers: 'Max. Benutzer' }`).
-     * Apps map their own Quota fields here; the default covers the generic
-     * platform fields.
-     */
-    fieldLabels?: Record<string, string>;
-}>();
-
-const DEFAULT_FIELD_LABELS: Record<string, string> = {
-    'features.added': 'Hinzugefügte Features',
-    'features.removed': 'Entfernte Features',
-    maxUsers: 'Max. Benutzer',
-    maxStorageGb: 'Speicher (GB)',
-    monthlyNet: 'Preis monatlich (netto)',
-    yearlyNet: 'Preis jährlich (netto)',
-    unitSize: 'Einheitsgröße',
-};
-
-const mergedFieldLabels = computed(() => ({
-    ...DEFAULT_FIELD_LABELS,
-    ...(props.fieldLabels ?? {}),
-}));
-
-function iconFor(direction: VersionChange['direction']): string {
-    if (direction === 'IMPROVEMENT') return 'trending_up';
-    if (direction === 'REGRESSION') return 'trending_down';
-    return 'remove';
-}
-
-function labelFor(direction: VersionChange['direction']): string {
-    if (direction === 'IMPROVEMENT') return 'Verbesserung';
-    if (direction === 'REGRESSION') return 'Verschlechterung';
-    return 'Neutral';
-}
-
-function rowClass(direction: VersionChange['direction']): string {
-    if (direction === 'IMPROVEMENT') return 'sa-pv-diff-preview__row--improvement';
-    if (direction === 'REGRESSION') return 'sa-pv-diff-preview__row--regression';
-    return 'sa-pv-diff-preview__row--neutral';
-}
-
-function humanFieldLabel(field: string): string {
-    return mergedFieldLabels.value[field] ?? field;
-}
-
-function formatValue(value: unknown): string {
-    if (value === null || value === undefined) return '–';
-    if (Array.isArray(value)) {
-        if (value.length === 0) return '–';
-        return value.join(', ');
-    }
-    if (typeof value === 'string' && /^\d+\.\d{2}$/.test(value)) {
-        return `${value} €`;
-    }
-    return String(value);
-}
-</script>
-
-<style scoped>
-.sa-pv-diff-preview__empty {
-    color: #64748b;
-    font-style: italic;
-    padding: 12px;
-    background: #f8fafc;
-    border-radius: 8px;
-    border: 1px dashed #cbd5e1;
-}
-.sa-pv-diff-preview__list {
-    display: flex;
-    flex-direction: column;
-    gap: 6px;
-}
-.sa-pv-diff-preview__row {
-    display: grid;
-    grid-template-columns: 160px 200px 1fr;
-    gap: 12px;
-    padding: 8px 12px;
-    border-radius: 8px;
-    border: 1px solid;
-    font-size: 13px;
-    align-items: center;
-}
-.sa-pv-diff-preview__row--improvement {
-    background: #f0fdf4;
-    border-color: #bbf7d0;
-    color: #166534;
-}
-.sa-pv-diff-preview__row--regression {
-    background: #fef2f2;
-    border-color: #fecaca;
-    color: #991b1b;
-}
-.sa-pv-diff-preview__row--neutral {
-    background: #f8fafc;
-    border-color: #e2e8f0;
-    color: #475569;
-}
-.sa-pv-diff-preview__direction {
-    display: flex;
-    align-items: center;
-    gap: 6px;
-    font-weight: 600;
-    font-size: 12px;
-    text-transform: uppercase;
-    letter-spacing: 0.04em;
-}
-.sa-pv-diff-preview__field {
-    color: #0f172a;
-    font-weight: 500;
-}
-.sa-pv-diff-preview__values {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-}
-.sa-pv-diff-preview__values .old {
-    color: #94a3b8;
-    text-decoration: line-through;
-    font-family: ui-monospace, 'SF Mono', Menlo, monospace;
-    font-size: 12px;
-}
-.sa-pv-diff-preview__values .new {
-    color: inherit;
-    font-weight: 600;
-    font-family: ui-monospace, 'SF Mono', Menlo, monospace;
-    font-size: 12px;
-}
-</style>

package/src/vue/use-business-types.ts

@@ -1,269 +0,0 @@
-// useBusinessTypes + useBusinessTypeVersions — Vue 3 composables for
-// SuperAdmin business-type management (backend: BusinessTypesController under
-// /admin/catalog/business-types + /admin/catalog/business-type-versions).
-//
-// Pattern analogous to use-bundles.ts.
-
-import { ref, type Ref } from 'vue';
-import type {
-    BusinessTypeRow,
-    BusinessTypeVersionMutationResult,
-    BusinessTypeVersionRow,
-    CreateBusinessTypeData,
-    CreateBusinessTypeVersionDraftData,
-    UpdateBusinessTypeData,
-    UpdateBusinessTypeVersionDraftData,
-} from '@saasicat/types';
-import { defaultHttpClient, type HttpClient } from '../client/types.js';
-
-export interface UseBusinessTypesOptions {
-    adminEndpoint: string;
-    http?: HttpClient;
-    getAuthToken?: () => string | null;
-    projectKey: string;
-    autoLoad?: boolean;
-}
-
-export class BusinessTypesApiError extends Error {
-    constructor(
-        public readonly status: number,
-        public readonly body: unknown,
-        message: string,
-    ) {
-        super(message);
-        this.name = 'BusinessTypesApiError';
-    }
-}
-
-export interface UseBusinessTypesResult {
-    businessTypes: Ref<BusinessTypeRow[]>;
-    loading: Ref<boolean>;
-    error: Ref<Error | null>;
-
-    load: () => Promise<void>;
-    create: (data: CreateBusinessTypeData) => Promise<BusinessTypeRow>;
-    update: (businessTypeId: string, data: UpdateBusinessTypeData) => Promise<BusinessTypeRow>;
-    softDelete: (businessTypeId: string) => Promise<void>;
-}
-
-export function useBusinessTypes(options: UseBusinessTypesOptions): UseBusinessTypesResult {
-    if (!options?.adminEndpoint) {
-        throw new Error('useBusinessTypes: `adminEndpoint` ist Pflicht.');
-    }
-    if (!options?.projectKey) {
-        throw new Error('useBusinessTypes: `projectKey` ist Pflicht.');
-    }
-
-    const http = options.http ?? defaultHttpClient();
-    const businessTypes = ref<BusinessTypeRow[]>([]);
-    const loading = ref(false);
-    const error = ref<Error | null>(null);
-
-    const baseUrl = `${options.adminEndpoint}/catalog/business-types`;
-
-    function authHeaders(): Record<string, string> {
-        const token = options.getAuthToken?.();
-        return token ? { Authorization: `Bearer ${token}` } : {};
-    }
-
-    async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
-        const res = await http(url, {
-            method: init?.method ?? 'GET',
-            headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
-            body: init?.body,
-        });
-        if (res.status === 204) return null;
-        const body = await res.json().catch(() => null);
-        if (res.status >= 400) {
-            throw new BusinessTypesApiError(
-                res.status,
-                body,
-                `BusinessTypes-API antwortete mit HTTP ${res.status}`,
-            );
-        }
-        return body as T;
-    }
-
-    async function load(): Promise<void> {
-        loading.value = true;
-        error.value = null;
-        try {
-            const data = await fetchJson<BusinessTypeRow[]>(
-                `${baseUrl}?projectKey=${encodeURIComponent(options.projectKey)}`,
-            );
-            businessTypes.value = data ?? [];
-        } catch (err) {
-            error.value = err instanceof Error ? err : new Error(String(err));
-        } finally {
-            loading.value = false;
-        }
-    }
-
-    async function create(data: CreateBusinessTypeData): Promise<BusinessTypeRow> {
-        const created = await fetchJson<BusinessTypeRow>(baseUrl, {
-            method: 'POST',
-            body: JSON.stringify(data),
-        });
-        if (!created) throw new BusinessTypesApiError(0, null, 'Create gab keinen Body zurück');
-        businessTypes.value = [...businessTypes.value, created];
-        return created;
-    }
-
-    async function update(
-        businessTypeId: string,
-        data: UpdateBusinessTypeData,
-    ): Promise<BusinessTypeRow> {
-        const updated = await fetchJson<BusinessTypeRow>(`${baseUrl}/${businessTypeId}`, {
-            method: 'PATCH',
-            body: JSON.stringify(data),
-        });
-        if (!updated) throw new BusinessTypesApiError(0, null, 'Update gab keinen Body zurück');
-        businessTypes.value = businessTypes.value.map((b) =>
-            b.id === businessTypeId ? updated : b,
-        );
-        return updated;
-    }
-
-    async function softDelete(businessTypeId: string): Promise<void> {
-        await fetchJson<null>(`${baseUrl}/${businessTypeId}`, { method: 'DELETE' });
-        businessTypes.value = businessTypes.value.filter((b) => b.id !== businessTypeId);
-    }
-
-    if (options.autoLoad) {
-        void load();
-    }
-
-    return { businessTypes, loading, error, load, create, update, softDelete };
-}
-
-// =============================================================================
-// useBusinessTypeVersions
-// =============================================================================
-
-export interface UseBusinessTypeVersionsOptions {
-    adminEndpoint: string;
-    businessTypeId: string;
-    http?: HttpClient;
-    getAuthToken?: () => string | null;
-    autoLoad?: boolean;
-}
-
-export interface UseBusinessTypeVersionsResult {
-    versions: Ref<BusinessTypeVersionRow[]>;
-    loading: Ref<boolean>;
-    error: Ref<Error | null>;
-
-    load: () => Promise<void>;
-    createDraft: (
-        data: Omit<CreateBusinessTypeVersionDraftData, 'businessTypeId'>,
-    ) => Promise<BusinessTypeVersionMutationResult>;
-    updateDraft: (
-        versionId: string,
-        data: UpdateBusinessTypeVersionDraftData,
-    ) => Promise<BusinessTypeVersionMutationResult>;
-    publish: (
-        versionId: string,
-        opts?: { forceRegressive?: boolean },
-    ) => Promise<BusinessTypeVersionMutationResult>;
-}
-
-export function useBusinessTypeVersions(
-    options: UseBusinessTypeVersionsOptions,
-): UseBusinessTypeVersionsResult {
-    if (!options?.adminEndpoint) {
-        throw new Error('useBusinessTypeVersions: `adminEndpoint` ist Pflicht.');
-    }
-    if (!options?.businessTypeId) {
-        throw new Error('useBusinessTypeVersions: `businessTypeId` ist Pflicht.');
-    }
-
-    const http = options.http ?? defaultHttpClient();
-    const versions = ref<BusinessTypeVersionRow[]>([]);
-    const loading = ref(false);
-    const error = ref<Error | null>(null);
-
-    const versionsUrl = `${options.adminEndpoint}/catalog/business-types/${options.businessTypeId}/versions`;
-    const versionUrlBase = `${options.adminEndpoint}/catalog/business-type-versions`;
-
-    function authHeaders(): Record<string, string> {
-        const token = options.getAuthToken?.();
-        return token ? { Authorization: `Bearer ${token}` } : {};
-    }
-
-    async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
-        const res = await http(url, {
-            method: init?.method ?? 'GET',
-            headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
-            body: init?.body,
-        });
-        if (res.status === 204) return null;
-        const body = await res.json().catch(() => null);
-        if (res.status >= 400) {
-            throw new BusinessTypesApiError(
-                res.status,
-                body,
-                `BusinessTypeVersions-API antwortete mit HTTP ${res.status}`,
-            );
-        }
-        return body as T;
-    }
-
-    async function load(): Promise<void> {
-        loading.value = true;
-        error.value = null;
-        try {
-            const data = await fetchJson<BusinessTypeVersionRow[]>(versionsUrl);
-            versions.value = data ?? [];
-        } catch (err) {
-            error.value = err instanceof Error ? err : new Error(String(err));
-        } finally {
-            loading.value = false;
-        }
-    }
-
-    async function createDraft(
-        data: Omit<CreateBusinessTypeVersionDraftData, 'businessTypeId'>,
-    ): Promise<BusinessTypeVersionMutationResult> {
-        const result = await fetchJson<BusinessTypeVersionMutationResult>(versionsUrl, {
-            method: 'POST',
-            body: JSON.stringify(data),
-        });
-        if (!result) throw new BusinessTypesApiError(0, null, 'CreateDraft gab keinen Body zurück');
-        versions.value = [...versions.value, result.businessTypeVersion];
-        return result;
-    }
-
-    async function updateDraft(
-        versionId: string,
-        data: UpdateBusinessTypeVersionDraftData,
-    ): Promise<BusinessTypeVersionMutationResult> {
-        const result = await fetchJson<BusinessTypeVersionMutationResult>(
-            `${versionUrlBase}/${versionId}`,
-            { method: 'PATCH', body: JSON.stringify(data) },
-        );
-        if (!result) throw new BusinessTypesApiError(0, null, 'UpdateDraft gab keinen Body zurück');
-        versions.value = versions.value.map((v) =>
-            v.id === versionId ? result.businessTypeVersion : v,
-        );
-        return result;
-    }
-
-    async function publish(
-        versionId: string,
-        opts: { forceRegressive?: boolean } = {},
-    ): Promise<BusinessTypeVersionMutationResult> {
-        const result = await fetchJson<BusinessTypeVersionMutationResult>(
-            `${versionUrlBase}/${versionId}/publish`,
-            { method: 'POST', body: JSON.stringify(opts) },
-        );
-        if (!result) throw new BusinessTypesApiError(0, null, 'Publish gab keinen Body zurück');
-        await load();
-        return result;
-    }
-
-    if (options.autoLoad) {
-        void load();
-    }
-
-    return { versions, loading, error, load, createDraft, updateDraft, publish };
-}