metaowl 0.4.1 → 0.6.0

package/build/runtime/modules/composables.js

@@ -0,0 +1,353 @@
+/**
+ * @module Composables
+ *
+ * Reusable composables/hooks for MetaOwl OWL applications.
+ */
+import { onMounted, onWillUnmount, useState } from '@odoo/owl';
+import Cache from './cache.js';
+import Fetch from './fetch.js';
+function createRef(initialValue) {
+    const resolvedValue = typeof initialValue === 'function'
+        ? initialValue()
+        : initialValue;
+    const state = useState({
+        value: resolvedValue,
+        __value: resolvedValue
+    });
+    if (state.__value === undefined) {
+        state.__value = resolvedValue;
+    }
+    return state;
+}
+function getRefValue(value) {
+    return typeof value === 'object' && value !== null && 'value' in value
+        ? value.value
+        : value;
+}
+export function useAuth() {
+    const user = createRef(null);
+    const isLoggedIn = createRef(false);
+    const isLoading = createRef(false);
+    let unsubscribe = null;
+    onMounted(async () => {
+        try {
+            const { OdooService } = await import('./odoo-rpc.js');
+            isLoggedIn.value = OdooService.isAuthenticated();
+            user.value = OdooService.getSession();
+            unsubscribe = OdooService.onAuthChange((session) => {
+                user.value = session;
+                isLoggedIn.value = session !== null;
+            });
+        }
+        catch {
+            // OdooService not available, auth stays false
+        }
+    });
+    onWillUnmount(() => {
+        if (unsubscribe) {
+            unsubscribe();
+        }
+    });
+    const login = async (credentials) => {
+        isLoading.value = true;
+        try {
+            const { OdooService } = await import('./odoo-rpc.js');
+            await OdooService.authenticate(credentials?.username, credentials?.password);
+            return true;
+        }
+        catch {
+            return false;
+        }
+        finally {
+            isLoading.value = false;
+        }
+    };
+    const logout = async () => {
+        try {
+            const { OdooService } = await import('./odoo-rpc.js');
+            OdooService.logout();
+        }
+        catch {
+            // Ignore errors
+        }
+    };
+    const checkAuth = async () => {
+        try {
+            const { OdooService } = await import('./odoo-rpc.js');
+            return OdooService.isAuthenticated();
+        }
+        catch {
+            return false;
+        }
+    };
+    return {
+        user,
+        isLoggedIn,
+        isLoading,
+        login,
+        logout,
+        checkAuth
+    };
+}
+export function useLocalStorage(key, defaultValue = null) {
+    const state = createRef(() => {
+        try {
+            const item = localStorage.getItem(key);
+            return item !== null ? JSON.parse(item) : defaultValue;
+        }
+        catch {
+            return defaultValue;
+        }
+    });
+    Object.defineProperty(state, 'value', {
+        get() {
+            return state.__value;
+        },
+        set(newValue) {
+            state.__value = newValue;
+            try {
+                if (newValue === null) {
+                    localStorage.removeItem(key);
+                }
+                else {
+                    localStorage.setItem(key, JSON.stringify(newValue));
+                }
+            }
+            catch {
+                // Ignore storage errors
+            }
+        }
+    });
+    const handleStorage = (event) => {
+        if (event.key === key) {
+            try {
+                state.__value = event.newValue !== null
+                    ? JSON.parse(event.newValue)
+                    : defaultValue;
+            }
+            catch {
+                state.__value = defaultValue;
+            }
+        }
+    };
+    onMounted(() => {
+        window.addEventListener('storage', handleStorage);
+    });
+    onWillUnmount(() => {
+        window.removeEventListener('storage', handleStorage);
+    });
+    return state;
+}
+export function useFetch(url, options = {}) {
+    const { initialData = null, immediate = true, transform = (data) => data, onError = null, method = 'GET', data: requestData = null, internal = true, triggerErrorHandler = true } = options;
+    const data = createRef(initialData);
+    const loading = createRef(false);
+    const error = createRef(null);
+    const execute = async (executeUrl = null) => {
+        const fetchUrl = executeUrl || getRefValue(url);
+        if (!fetchUrl)
+            return undefined;
+        loading.value = true;
+        error.value = null;
+        try {
+            const result = await Fetch.url(String(fetchUrl), method, requestData, internal, triggerErrorHandler);
+            if (result === null) {
+                throw new Error('Request failed');
+            }
+            data.value = transform(result);
+            return data.value;
+        }
+        catch (err) {
+            error.value = err;
+            if (onError) {
+                onError(err);
+            }
+            throw err;
+        }
+        finally {
+            loading.value = false;
+        }
+    };
+    const refresh = () => execute();
+    onMounted(() => {
+        if (immediate) {
+            void execute();
+        }
+    });
+    return {
+        data,
+        loading,
+        error,
+        refresh,
+        execute
+    };
+}
+export function useDebounce(value, wait = 300) {
+    const debouncedValue = createRef(value.value);
+    let timeout = null;
+    Object.defineProperty(value, 'value', {
+        get() {
+            return value.__value;
+        },
+        set(newValue) {
+            value.__value = newValue;
+            if (timeout) {
+                clearTimeout(timeout);
+            }
+            timeout = setTimeout(() => {
+                debouncedValue.value = newValue;
+            }, wait);
+        }
+    });
+    onWillUnmount(() => {
+        if (timeout) {
+            clearTimeout(timeout);
+        }
+    });
+    return debouncedValue;
+}
+export function useThrottle(fn, wait = 300) {
+    let lastCall = 0;
+    let timeout = null;
+    const throttled = (...args) => {
+        const now = Date.now();
+        const remaining = wait - (now - lastCall);
+        if (remaining <= 0) {
+            if (timeout) {
+                clearTimeout(timeout);
+                timeout = null;
+            }
+            lastCall = now;
+            fn(...args);
+        }
+        else if (!timeout) {
+            timeout = setTimeout(() => {
+                lastCall = Date.now();
+                timeout = null;
+                fn(...args);
+            }, remaining);
+        }
+    };
+    onWillUnmount(() => {
+        if (timeout) {
+            clearTimeout(timeout);
+        }
+    });
+    return throttled;
+}
+export function useWindowSize() {
+    const width = createRef(window.innerWidth);
+    const height = createRef(window.innerHeight);
+    const handleResize = () => {
+        width.value = window.innerWidth;
+        height.value = window.innerHeight;
+    };
+    onMounted(() => {
+        window.addEventListener('resize', handleResize);
+    });
+    onWillUnmount(() => {
+        window.removeEventListener('resize', handleResize);
+    });
+    return { width, height };
+}
+export function useOnlineStatus() {
+    const isOnline = createRef(navigator.onLine);
+    const handleOnline = () => {
+        isOnline.value = true;
+    };
+    const handleOffline = () => {
+        isOnline.value = false;
+    };
+    onMounted(() => {
+        window.addEventListener('online', handleOnline);
+        window.addEventListener('offline', handleOffline);
+    });
+    onWillUnmount(() => {
+        window.removeEventListener('online', handleOnline);
+        window.removeEventListener('offline', handleOffline);
+    });
+    return isOnline;
+}
+export function useAsyncState(asyncFn, options = {}) {
+    const { immediate = false, initialData = null } = options;
+    const state = createRef(null);
+    const data = createRef(initialData);
+    const error = createRef(null);
+    const execute = async (...args) => {
+        state.value = 'loading';
+        error.value = null;
+        try {
+            const result = await asyncFn(...args);
+            data.value = result;
+            state.value = 'success';
+            return result;
+        }
+        catch (err) {
+            error.value = err;
+            state.value = 'error';
+            throw err;
+        }
+    };
+    if (immediate) {
+        onMounted(() => {
+            void execute(...[]);
+        });
+    }
+    return {
+        state,
+        data,
+        error,
+        execute,
+        isLoading: () => state.value === 'loading',
+        isSuccess: () => state.value === 'success',
+        isError: () => state.value === 'error'
+    };
+}
+export function useCache(key, defaultValue = null) {
+    const value = createRef(defaultValue);
+    onMounted(() => {
+        void Cache.get(key)
+            .then((cached) => {
+            value.value = cached ?? defaultValue;
+        })
+            .catch(() => {
+            value.value = defaultValue;
+        });
+    });
+    const set = (newValue) => {
+        value.value = newValue;
+        void Cache.set(key, newValue);
+    };
+    const get = async () => {
+        const cached = await Cache.get(key);
+        value.value = cached ?? defaultValue;
+        return cached;
+    };
+    const remove = () => {
+        value.value = defaultValue;
+        void Cache.remove(key);
+    };
+    const clear = () => {
+        value.value = defaultValue;
+        void Cache.clear();
+    };
+    return {
+        value,
+        set,
+        get,
+        remove,
+        clear
+    };
+}
+export const Composables = {
+    useAuth,
+    useLocalStorage,
+    useFetch,
+    useDebounce,
+    useThrottle,
+    useWindowSize,
+    useOnlineStatus,
+    useAsyncState,
+    useCache
+};
+export default Composables;

package/build/runtime/modules/constants.js

@@ -0,0 +1,38 @@
+export const MAGIC_STRINGS = {
+    STORE_SESSION_KEY: 'metaowl:odoo:session',
+    STORE_CSRF_KEY: 'metaowl:odoo:csrf',
+    MOUNT_ELEMENT_ID: 'metaowl',
+    LINK_TEMPLATE_NAME: 'Link'
+};
+export const ROUTE_PATTERN_CONFIG = {
+    optionalParam: /\/:([^/(]+)\?/g,
+    catchAll: /\/:([^/(]+)\(\.\*\)/g,
+    namedParam: /:([^/(?\s]+)/g,
+    wildcard: /\*/g,
+    separator: /\//g
+};
+export function buildRouteRegexPattern(path) {
+    const pattern = path
+        .replace(ROUTE_PATTERN_CONFIG.separator, '\\/')
+        .replace(ROUTE_PATTERN_CONFIG.catchAll, '/(.*)')
+        .replace(ROUTE_PATTERN_CONFIG.optionalParam, '(?:/([^/]+))?')
+        .replace(ROUTE_PATTERN_CONFIG.namedParam, '([^/]+)')
+        .replace(ROUTE_PATTERN_CONFIG.wildcard, '(.*)');
+    return '^' + pattern + '$';
+}
+export function buildSimpleRoutePattern(routePath) {
+    const pattern = routePath
+        .replace(ROUTE_PATTERN_CONFIG.separator, '\\/')
+        .replace(ROUTE_PATTERN_CONFIG.catchAll, '(.*)')
+        .replace(ROUTE_PATTERN_CONFIG.optionalParam, '(?:/([^/]+))?')
+        .replace(ROUTE_PATTERN_CONFIG.namedParam, '([^/]+)')
+        .replace(ROUTE_PATTERN_CONFIG.wildcard, '(.*)');
+    return '^' + pattern + '$';
+}
+export function normalizeRoutePath(path) {
+    return (path.replace(/\/$/, '') || '/');
+}
+export function normalizePathForComparison(path) {
+    return normalizeRoutePath(path);
+}
+export const EXTERNAL_URL_REGEX = /^(https?:|\/\/|mailto:|tel:|ftp:|file:|javascript:)/i;

package/build/runtime/modules/error-boundary.js

@@ -0,0 +1,116 @@
+/**
+ * @module ErrorBoundary
+ *
+ * Error boundaries for OWL applications.
+ */
+import { Component, useState, xml } from '@odoo/owl';
+const globalErrorHandlers = [];
+let errorContext = {};
+export class ErrorBoundary extends Component {
+    static template = xml `
+    <t t-if="state.hasError">
+      <t t-component="props.Fallback || fallback"
+         t-props="{ error: state.error, errorInfo: state.errorInfo }"/>
+    </t>
+    <t t-else="">
+      <t t-slot="default"/>
+    </t>
+  `;
+    static defaultProps = {
+        Fallback: null
+    };
+    state;
+    setup() {
+        this.state = useState({
+            hasError: false,
+            error: null,
+            errorInfo: null
+        });
+    }
+    onError(error, errorInfo) {
+        this.state.hasError = true;
+        this.state.error = error;
+        this.state.errorInfo = errorInfo;
+        for (const handler of globalErrorHandlers) {
+            handler(error, { ...errorContext, ...errorInfo });
+        }
+    }
+}
+export class DefaultErrorFallback extends Component {
+    static template = xml `
+    <div class="error-boundary-fallback">
+      <h2>Something went wrong</h2>
+      <t t-if="props.error">
+        <details>
+          <summary>Error details</summary>
+          <pre t-esc="props.error.stack || props.error.message || props.error"/>
+        </details>
+      </t>
+    </div>
+  `;
+}
+export function onError(handler) {
+    globalErrorHandlers.push(handler);
+    return () => {
+        const index = globalErrorHandlers.indexOf(handler);
+        if (index > -1) {
+            globalErrorHandlers.splice(index, 1);
+        }
+    };
+}
+export function setErrorContext(context) {
+    errorContext = { ...errorContext, ...context };
+}
+export function getErrorContext() {
+    return { ...errorContext };
+}
+export function clearErrorContext() {
+    errorContext = {};
+}
+export function captureError(error, context = {}) {
+    const fullContext = { ...errorContext, ...context };
+    for (const handler of globalErrorHandlers) {
+        handler(error, fullContext);
+    }
+}
+export function errorBoundary(options = {}) {
+    return function decorator(componentClass) {
+        componentClass.errorBoundary = true;
+        if (options.Fallback) {
+            componentClass.fallback = options.Fallback;
+        }
+        return componentClass;
+    };
+}
+export function withErrorBoundary(componentClass, options = {}) {
+    return class WithErrorBoundary extends Component {
+        static template = xml `
+      <ErrorBoundary Fallback="props.Fallback || fallback">
+        <t t-component="Component" t-props="props"/>
+      </ErrorBoundary>
+    `;
+        static components = { ErrorBoundary };
+        Component;
+        fallback;
+        setup() {
+            this.Component = componentClass;
+            this.fallback = options.Fallback || DefaultErrorFallback;
+        }
+    };
+}
+export function initGlobalErrorHandling() {
+    window.onerror = (message, source, lineno, colno, error) => {
+        captureError(error || new Error(String(message)), {
+            type: 'window.onerror',
+            source,
+            lineno,
+            colno
+        });
+        return false;
+    };
+    window.onunhandledrejection = (event) => {
+        captureError(event.reason, {
+            type: 'unhandledrejection'
+        });
+    };
+}

package/build/runtime/modules/fetch.js

@@ -0,0 +1,31 @@
+/**
+ * @module Fetch
+ *
+ * A static class wrapping the Fetch API with a configurable base URL and
+ * error handling. All internal requests automatically prepend the configured
+ * baseUrl and return parsed JSON.
+ */
+export default class Fetch {
+    static _baseUrl = '';
+    static _onError = null;
+    static configure({ baseUrl = '', onError = null } = {}) {
+        Fetch._baseUrl = baseUrl;
+        Fetch._onError = onError;
+    }
+    static async url(url, method = 'GET', data = null, internal = true, triggerErrorHandler = true) {
+        const fullUrl = `${internal ? Fetch._baseUrl : ''}${url}`;
+        const response = await fetch(fullUrl, {
+            method,
+            body: data ? JSON.stringify(data) : null
+        }).catch((error) => {
+            console.warn('[metaowl] Fetch error:', error);
+            if (triggerErrorHandler && Fetch._onError) {
+                Fetch._onError(error);
+            }
+            return null;
+        });
+        if (!response)
+            return null;
+        return await response.json();
+    }
+}