@liorian/sdk 0.28.0-alpha.56010ca

package/src/infrastructure/library/motion-utils.ts

@@ -0,0 +1,77 @@
+// src/core/presentation/motion-utils.ts
+// Motion utilities for elastic, organic, and spring-based animations (GSAP-backed)
+
+import gsap from "gsap";
+import { tokens } from "./design-system";
+
+export interface EnterAnimation {
+    from: gsap.TweenVars;
+    to: gsap.TweenVars;
+}
+
+// The design-system spring tokens (stiffness/damping) describe a bouncy spring
+// that settles in ~0.6-0.7s and overshoots slightly. GSAP's elastic ease is the
+// closest built-in equivalent.
+const ease = "elastic.out(1, 0.5)";
+const easeSoft = "elastic.out(1, 0.75)";
+const easeBouncy = "elastic.out(1.3, 0.4)";
+const duration = 0.7;
+const durationSoft = 0.45;
+
+export const elasticEnter = (delay: number = 0): EnterAnimation => ({
+    from: { opacity: 0, y: 20, scale: 0.95 },
+    to: { opacity: 1, y: 0, scale: 1, duration, ease, delay },
+});
+
+export const elasticExit = (): EnterAnimation => ({
+    from: { opacity: 1, y: 0, scale: 1 },
+    to: { opacity: 0, y: -20, scale: 0.95, duration: durationSoft, ease: easeSoft },
+});
+
+export const elasticPulse = (): EnterAnimation => ({
+    from: { scale: 1 },
+    to: { scale: 1.05, duration: 0.6, ease: "sine.inOut", repeat: -1, yoyo: true },
+});
+
+export const elasticScaleEnter = (): EnterAnimation => ({
+    from: { opacity: 0, scale: 0.92 },
+    to: { opacity: 1, scale: 1, duration: 0.6, ease: easeBouncy },
+});
+
+export const elasticSlideUp = (delay: number = 0): EnterAnimation => ({
+    from: { opacity: 0, y: 40 },
+    to: { opacity: 1, y: 0, duration, ease, delay },
+});
+
+export const elasticSlideInLeft = (): EnterAnimation => ({
+    from: { opacity: 0, x: -40 },
+    to: { opacity: 1, x: 0, duration, ease },
+});
+
+export const elasticSlideInRight = (): EnterAnimation => ({
+    from: { opacity: 0, x: 40 },
+    to: { opacity: 1, x: 0, duration, ease },
+});
+
+export const elasticContainer = (delay: number = 0, stagger: number = 0.08): EnterAnimation => ({
+    from: { opacity: 0 },
+    to: { opacity: 1, duration: 0.6, ease: "power2.out", delay, stagger },
+});
+
+export const elasticChild = (): EnterAnimation => ({
+    from: { opacity: 0, y: 20, scale: 0.95 },
+    to: { opacity: 1, y: 0, scale: 1, duration, ease },
+});
+
+export const staggeredSpringList = (motionConfig: {
+    delay: number;
+    stiffness?: number;
+    damping?: number;
+}) => {
+    const { delay } = motionConfig;
+
+    return {
+        from: { opacity: 0, y: 20 },
+        to: { opacity: 1, y: 0, duration, ease, delay, stagger: 0.1 },
+    };
+};

package/src/infrastructure/library/motion.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import { ElementType, ReactNode, useRef } from "react";
+import gsap from "gsap";
+import { useGSAP } from "@gsap/react";
+import { EnterAnimation } from "./motion-utils";
+
+export interface MotionProps {
+    as?: ElementType;
+    children?: ReactNode;
+    animation?: EnterAnimation | null;
+    className?: string;
+    [key: string]: unknown;
+}
+
+export function Motion({ as, children, animation, className, ...rest }: MotionProps) {
+    const ref = useRef<any>(null);
+
+    useGSAP(() => {
+        if (!animation || !ref.current) return;
+        gsap.fromTo(ref.current, animation.from, animation.to);
+    }, { scope: ref });
+
+    const Comp = (as ?? "div") as ElementType;
+
+    return (
+        <Comp ref={ref} className={className} {...rest}>
+            {children}
+        </Comp>
+    );
+}

package/src/infrastructure/library/scroll-progress.tsx

@@ -0,0 +1,93 @@
+"use client"
+
+import { useEffect, useRef } from "react"
+import gsap from "gsap"
+import { cn } from "../utilities/utils"
+
+interface ScrollProgressProps extends React.HTMLAttributes<HTMLDivElement> {
+  /**
+   * Height of the progress bar in pixels
+   * @default 2
+   */
+  height?: number
+  /**
+   * Color of the progress bar
+   * @default "bg-primary"
+   */
+  color?: string
+  /**
+   * Position of the progress bar
+   * @default "top"
+   */
+  position?: "top" | "bottom"
+  /**
+   * Container element to track scroll progress for
+   * If not provided, tracks the entire viewport
+   */
+  container?: React.RefObject<HTMLElement | null>
+}
+
+function ScrollProgress({
+  height = 4,
+  color = "bg-primary",
+  position = "top",
+  className,
+  container,
+  ...props
+}: ScrollProgressProps) {
+  const ref = useRef<HTMLDivElement>(null)
+
+  useEffect(() => {
+    const el = ref.current
+    if (!el) return
+
+    const update = () => {
+      const scroller = container?.current ?? null
+      let progress = 0
+
+      if (scroller) {
+        const max = scroller.scrollHeight - scroller.clientHeight
+        progress = max > 0 ? scroller.scrollTop / max : 0
+      } else {
+        const doc = document.documentElement
+        const max = doc.scrollHeight - doc.clientHeight
+        progress = max > 0 ? (window.scrollY || doc.scrollTop) / max : 0
+      }
+
+      gsap.set(el, { scaleX: progress })
+    }
+
+    update()
+
+    const target = container?.current ?? window
+    target.addEventListener("scroll", update, { passive: true })
+    window.addEventListener("resize", update)
+
+    return () => {
+      target.removeEventListener("scroll", update)
+      window.removeEventListener("resize", update)
+    }
+  }, [container])
+
+  return (
+    <div
+      ref={ref}
+      data-slot="scroll-progress"
+      className={cn(
+        "left-0 right-0 z-50 origin-left",
+        // Use fixed positioning for viewport scroll, allow override for container scroll
+        !container && "fixed",
+        position === "top" ? "top-0" : "bottom-0",
+        color,
+        className,
+      )}
+      style={{
+        transform: "scaleX(0)",
+        height: `${height}px`,
+      }}
+      {...props}
+    />
+  )
+}
+
+export { ScrollProgress }

package/src/infrastructure/providers/auth-guard.provider.tsx

@@ -0,0 +1,47 @@
+"use client"
+
+import React, {useEffect, useState} from "react"
+import {usePathname} from "next/navigation"
+import {AuthUserService} from "../../application/service/auth-user.service"
+import {AuthSessionView} from "../../presentation/components/auth-session.view"
+import {AuthLockScreen} from "../../presentation/components/auth-lock-screen"
+import {AuthConfig} from "../../domain/config/auth.config";
+import {useAuth} from "../hooks/use-auth";
+import {activityLockStore} from "../stores/activity-lock.store";
+
+interface AuthGuardProps {
+    children: React.ReactNode
+}
+
+/**
+ * Garde d'accès par défaut : affiche l'écran de verrouillage SSO tant que
+ * l'utilisateur n'est pas authentifié (les routes `/auth/*` et publiques sont
+ * exemptées via `AuthConfig.excludes`).
+ */
+export function AuthGuard({children}: AuthGuardProps) {
+    const {isLocked} = activityLockStore();
+    const {user} = useAuth()
+    const [status, setStatus] = useState<'checking' | 'locked' | 'authorized'>('checking')
+    const pathname = usePathname()
+
+    useEffect(() => {
+        const isAuthenticated = AuthUserService.isAuthenticated()
+        const isAuthRoute = AuthConfig.excludes.some((route) => pathname.startsWith(route))
+
+        if ((!isAuthenticated && !isAuthRoute) || isLocked) {
+            setStatus('locked')
+        } else {
+            setStatus('authorized')
+        }
+    }, [pathname, user, isLocked])
+
+    if (status === 'checking') {
+        return <AuthSessionView/>
+    }
+
+    if (status === 'locked') {
+        return <AuthLockScreen/>
+    }
+
+    return <>{children}</>
+}

package/src/infrastructure/providers/auth.provider.tsx

@@ -0,0 +1,168 @@
+"use client"
+
+import React, {useCallback, useEffect, useState} from "react"
+import {useRouter, usePathname} from "next/navigation"
+import {authUserConnectedStore} from "../stores/auth-user-connected.store"
+import {AuthUserService} from "../../application/service/auth-user.service"
+import {AuthApiService} from "../../application/service/auth-api-service"
+import {AuthSessionView} from "../../presentation/components/auth-session.view"
+import {AuthLockScreen} from "../../presentation/components/auth-lock-screen"
+import {AuthConfig} from "../../domain/config/auth.config";
+import {AppConfig} from "../../domain/config/app.config";
+import {ActivityLockService} from "../utilities/activity-lock.service";
+import {toast} from "sonner";
+
+export interface AuthProviderProps {
+    children: React.ReactNode
+    /**
+     * Si `true` (défaut), un utilisateur connecté sans organisation courante est
+     * redirigé vers la sélection d'organisation. Les applications ne reposant pas
+     * sur les organisations (ex. liorian-connect) doivent passer `false`.
+     */
+    requireOrganization?: boolean
+}
+
+export function AuthProvider({children, requireOrganization = true}: AuthProviderProps) {
+    const {setCurrentUser, setOrganizations, setCurrentOrganization, getCurrentUser} = authUserConnectedStore()
+    const [isInitialized, setIsInitialized] = useState(false)
+    const [locked, setLocked] = useState(false)
+    const router = useRouter()
+    const pathname = usePathname()
+
+    /** (Ré)arme le verrouillage par inactivité pour l'utilisateur courant. */
+    const armActivityLock = useCallback((userId: string, disposed: { current: boolean }) => {
+        const armed = () => !disposed.current && !ActivityLockService.isLocked(userId)
+
+        ActivityLockService.getTimeout(userId)
+            .then((timeout) => {
+                if (!armed()) return
+                ActivityLockService.start({
+                    userId,
+                    timeout,
+                    onLocked: () => setLocked(true),
+                })
+            })
+            .catch(() => {
+                if (!armed()) return
+                ActivityLockService.start({
+                    userId,
+                    timeout: Number(AppConfig.UI_ACTIVITY_TRACKER_TIMEOUT),
+                    onLocked: () => setLocked(true),
+                })
+            })
+    }, [])
+
+    useEffect(() => {
+        let timeoutId: NodeJS.Timeout;
+
+        const initAuth = async () => {
+            try {
+                // Les tokens/infos de l'utilisateur doivent être disponibles en local
+                // avant de vérifier la validité de la session.
+                await AuthUserService.ready();
+                const token = AuthUserService.getToken()
+                const user = AuthUserService.getUser()
+                const organizations = AuthUserService.getOrganizations()
+                const currentOrganization = AuthUserService.getCurrentOrganization()
+
+                if (token && user) {
+                    setCurrentUser(user)
+                    setOrganizations(organizations)
+                    if (currentOrganization) setCurrentOrganization(currentOrganization)
+
+                    try {
+                        // Vérification de session via le SSO Liorian Auth : valide le
+                        // jeton d'accès OAuth sur `/oauth/userinfo`.
+                        await AuthApiService.userinfo()
+                    } catch (e) {
+                        console.error("Session verification failed", e)
+                        await AuthUserService.clear()
+                        toast.error("Votre session a expiré")
+                        return
+                    }
+                }
+            } catch (error) {
+                console.error("Auth initialization error", error)
+            } finally {
+                setIsInitialized(true)
+                timeoutId = setTimeout(initAuth, AppConfig.AUTH_CHECK_SESSION_TIMEOUT || 30000)
+            }
+        }
+
+        initAuth()
+
+        return () => {
+            if (timeoutId) clearTimeout(timeoutId)
+        }
+    }, [setCurrentUser, setOrganizations, setCurrentOrganization, router])
+
+    useEffect(() => {
+        if (isInitialized) {
+            const token = AuthUserService.getToken()
+            const currentOrganization = AuthUserService.getCurrentOrganization()
+            const isAuthRoute = pathname.startsWith('/auth')
+            const isPublicRoute = AuthConfig.excludes.some((route) => pathname.startsWith(route))
+
+            if (!token && !isAuthRoute && !isPublicRoute) {
+                setLocked(true)
+            } else if (!ActivityLockService.isLocked()) {
+                setLocked(false)
+            }
+
+            if (requireOrganization && token && !currentOrganization && !isAuthRoute && !isPublicRoute && pathname !== '/') {
+                router.push(`${AuthConfig.routes.selectOrganization}?callbackUrl=${encodeURIComponent(pathname)}`)
+            }
+        }
+    }, [isInitialized, pathname, router, requireOrganization])
+
+    useEffect(() => {
+        if (!isInitialized) return;
+
+        const token = AuthUserService.getToken();
+        const user = AuthUserService.getUser();
+
+        // Pas d'utilisateur connecté : aucun verrouillage par inactivité à surveiller.
+        if (!token || !user) {
+            ActivityLockService.stop();
+            return;
+        }
+
+        let disposed = {current: false};
+
+        // Restaure un verrou persistant (l'écran reste verrouillé même après rafraîchissement).
+        if (ActivityLockService.isLocked(user.id)) {
+            setLocked(true);
+            return;
+        }
+
+        if (user.id) armActivityLock(user.id, disposed)
+
+        return () => {
+            disposed.current = true;
+            ActivityLockService.stop();
+        };
+    }, [isInitialized, getCurrentUser?.id, armActivityLock]);
+
+    if (!isInitialized) {
+        return <AuthSessionView/>
+    }
+
+    if (locked) {
+        const restartActivityLock = () => {
+            const user = AuthUserService.getUser()
+            if (!user?.id) return
+            ActivityLockService.unlock()
+            setLocked(false)
+            armActivityLock(user.id, {current: false})
+        }
+
+        return (
+            <AuthLockScreen
+                onAuthenticated={restartActivityLock}
+                onUnlocked={restartActivityLock}
+            />
+        )
+    }
+
+    return <>{children}</>
+}

package/src/infrastructure/providers/index.tsx

@@ -0,0 +1,8 @@
+// @liorian/sdk/infrastructure/providers — cross-cutting React providers.
+export * from "./auth-guard.provider";
+export * from "./auth.provider";
+export * from "./module-usage.provider";
+export * from "./modules-guard.provider";
+export * from "./modules-routines.provider";
+export * from "./modules-switcher.provider";
+export * from "./query.provider";

package/src/infrastructure/providers/module-usage.provider.tsx

@@ -0,0 +1,95 @@
+"use client"
+
+import {useEffect, useRef} from "react";
+import {useModuleStore} from "../stores/module.store";
+import {ModuleActivationApiService} from "../../application/service/module-activation-api.service";
+import {useAuth} from "../hooks/use-auth";
+
+const FLUSH_INTERVAL_MS = 30_000;
+
+/**
+ * Suit le temps d'utilisation et la fréquence d'activation des modules actifs
+ * et les envoie au backend (analytics). Le backend n'enregistre rien tant que
+ * l'organisation/l'utilisateur n'a pas activé le partage de données anonymes ;
+ * dans ce cas l'envoi est interrompu automatiquement.
+ */
+export function ModuleUsageProvider() {
+    const currentModuleId = useModuleStore((state) => state.selectedModule?.identifier ?? null);
+    const {currentOrganization} = useAuth();
+
+    const moduleIdRef = useRef<string | null>(null);
+    const lastTickRef = useRef<number>(Date.now());
+    const pendingRef = useRef<Map<string, number>>(new Map());
+    const trackingEnabledRef = useRef<boolean | null>(null);
+
+    const collectPending = () => {
+        const now = Date.now();
+        const elapsed = now - lastTickRef.current;
+        lastTickRef.current = now;
+        const current = moduleIdRef.current;
+        if (current && elapsed > 0) {
+            pendingRef.current.set(current, (pendingRef.current.get(current) ?? 0) + elapsed);
+        }
+    };
+
+    useEffect(() => {
+        collectPending();
+        moduleIdRef.current = currentModuleId;
+    }, [currentModuleId]);
+
+    const flush = async () => {
+        collectPending();
+
+        const orgId = currentOrganization?.id;
+        if (!orgId) return;
+        if (trackingEnabledRef.current === false) {
+            pendingRef.current.clear();
+            return;
+        }
+
+        const entries = Array.from(pendingRef.current.entries());
+        pendingRef.current.clear();
+
+        for (const [moduleId, usageTimeMs] of entries) {
+            if (usageTimeMs <= 0) continue;
+            try {
+                const res = await ModuleActivationApiService.recordModuleUsage(orgId, {
+                    moduleId,
+                    usageTimeMs,
+                    useCount: 1,
+                });
+                const tracked = res?.data?.data?.tracked;
+                if (tracked === false) {
+                    trackingEnabledRef.current = false;
+                    break;
+                }
+                if (tracked === true) {
+                    trackingEnabledRef.current = true;
+                }
+            } catch {
+                pendingRef.current.set(moduleId, (pendingRef.current.get(moduleId) ?? 0) + usageTimeMs);
+            }
+        }
+    };
+
+    useEffect(() => {
+        const id = setInterval(flush, FLUSH_INTERVAL_MS);
+        const onHide = () => void flush();
+        const onVisibility = () => {
+            if (document.visibilityState === 'hidden') void flush();
+        };
+        window.addEventListener('pagehide', onHide);
+        document.addEventListener('visibilitychange', onVisibility);
+
+        return () => {
+            clearInterval(id);
+            window.removeEventListener('pagehide', onHide);
+            document.removeEventListener('visibilitychange', onVisibility);
+            void flush();
+        };
+
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [currentOrganization?.id, currentModuleId]);
+
+    return null;
+}

package/src/infrastructure/providers/modules-guard.provider.tsx

@@ -0,0 +1,64 @@
+"use client"
+
+import {usePathname} from "next/navigation"
+import {useEffect, useState} from "react"
+import {useModuleStore} from "../stores/module.store"
+import {useAuth} from "../hooks/use-auth"
+import {DomainsEnum} from "../../domain/enums/domains.enum"
+import {ModuleDeclarationInterface} from "../../domain/entities/module.interface"
+import {UserInterface} from "../../domain/entities/user.interface"
+import {ModulesGuardForbiddenView} from "../../presentation/components/modules-guard-forbidden"
+
+const MODULE_DOMAINS: Record<string, DomainsEnum[]> = {
+    DASHBOARD: [DomainsEnum.Analytics, DomainsEnum.Activity, DomainsEnum.UserActivity],
+    ACCESS_CONTROL: [DomainsEnum.Role],
+    IDENTITY: [DomainsEnum.User, DomainsEnum.UserDevice],
+    BILLING: [DomainsEnum.Invoice, DomainsEnum.PaymentMethod],
+    BLOGGING: [DomainsEnum.Post, DomainsEnum.PostCategory, DomainsEnum.PostCollaborator],
+    CRM: [DomainsEnum.Deal, DomainsEnum.Lead, DomainsEnum.Contact, DomainsEnum.SalesTeam],
+    NOTIFICATION: [DomainsEnum.Notification],
+    ORGANIZATION: [DomainsEnum.Organization, DomainsEnum.OrganizationMember, DomainsEnum.OrganizationPreference],
+    PROJECT_MANAGEMENT: [DomainsEnum.Project, DomainsEnum.Task, DomainsEnum.TaskReminder],
+    RESTAURANT: [DomainsEnum.RestaurantDish, DomainsEnum.RestaurantMenu, DomainsEnum.RestaurantOrder, DomainsEnum.RestaurantCustomer, DomainsEnum.RestaurantSalesSession],
+    STOCK_MANAGEMENT: [DomainsEnum.Stock, DomainsEnum.StockMovement, DomainsEnum.Order, DomainsEnum.Product],
+    MEDIA_LIBRARY: [DomainsEnum.Media],
+    USER_ACTIVITY: [DomainsEnum.UserActivity, DomainsEnum.Activity],
+}
+
+// function findCurrentModule(pathname: string, modules: ModuleDeclarationInterface[]): ModuleDeclarationInterface | undefined {
+//     const sortedModules = [...modules].sort((a, b) => b.uri.length - a.uri.length)
+//     return sortedModules.find(module => pathname.startsWith(module.uri))
+// }
+
+function hasReadAccess(user: UserInterface | null | undefined, domains: DomainsEnum[]): boolean {
+    if (!user?.permissions) return false
+    return domains.every(domain => user.permissions?.[domain]?.read)
+}
+
+export function ModulesGuardProvider({children}: { children: React.ReactNode }) {
+    const pathname = usePathname()
+    const {modules, selectedModule: currentModule} = useModuleStore()
+    const {user} = useAuth()
+    const [mounted, setMounted] = useState(false)
+
+    useEffect(() => {
+        setMounted(true)
+    }, [])
+
+    if (!mounted) return <>{children}</>
+
+    const isExcluded = pathname === '/' || pathname === '/dashboard' || pathname === '/store' || pathname.startsWith('/store/') || pathname.startsWith('/auth')
+    if (isExcluded) return <>{children}</>
+
+    // const currentModule = findCurrentModule(pathname, modules)
+    if (!currentModule) return <>{children}</>
+
+    const domains = MODULE_DOMAINS[currentModule.key ?? currentModule.identifier] || []
+    if (!domains || domains.length === 0) return <>{children}</>
+
+    if (!hasReadAccess(user, domains)) {
+        return <ModulesGuardForbiddenView module={currentModule}/>
+    }
+
+    return <>{children}</>
+}

package/src/infrastructure/providers/modules-routines.provider.tsx

@@ -0,0 +1,33 @@
+"use client"
+
+import {useEffect} from "react";
+import {useModuleStore} from "../stores/module.store";
+import {RoutineInterface} from "../../domain/typing/routine.types";
+import {useRoutines} from "../routines/routine.hook";
+import {toast} from "sonner";
+
+export function ModulesRoutinesProvider() {
+    const {enqueue, clear, run} = useRoutines()
+    const selectedModule = useModuleStore((state) => state.selectedModule);
+
+    useEffect(() => {
+        clear(false);
+
+        if (!selectedModule?.routines) return;
+
+        selectedModule.routines.forEach(
+            (routine: RoutineInterface<any>) =>
+                enqueue(routine).start(routine.id)
+        );
+
+        run()
+            .then((routines) => {
+
+            })
+            .catch(err => {
+                toast.error(err.message || err.toString())
+            })
+    }, [selectedModule]);
+
+    return null;
+}

package/src/infrastructure/providers/modules-switcher.provider.tsx

@@ -0,0 +1,25 @@
+"use client"
+
+import {usePathname} from "next/navigation";
+import {useEffect, useMemo} from "react";
+import {useModuleStore} from "../stores/module.store";
+
+export function ModulesSwitcherProvider() {
+    const {modules, selectModule} = useModuleStore();
+    const pathname = usePathname();
+
+    const selectedModuleKey = useMemo(() => {
+        if (!modules || !pathname) return null;
+
+        return modules
+            .filter(module => module.key && pathname.startsWith(module.uri))
+            .sort((a, b) => b.uri.length - a.uri.length)[0]?.key ?? null;
+    }, [modules, pathname]);
+
+    useEffect(() => {
+        if (!selectedModuleKey) return;
+        selectModule(selectedModuleKey);
+    }, [selectedModuleKey, selectModule]);
+
+    return null;
+}

package/src/infrastructure/providers/query.provider.tsx

@@ -0,0 +1,27 @@
+"use client"
+
+import {QueryClient, QueryClientProvider} from "@tanstack/react-query";
+import {ReactNode} from "react";
+
+export interface QueryProviderProps{
+    children: ReactNode
+}
+
+const queryClient = new QueryClient({
+    defaultOptions: {
+        queries: {
+            staleTime: 30_000,
+            gcTime: 5 * 60_000,
+            refetchOnWindowFocus: false,
+            retry: 1,
+        },
+    },
+})
+export function QueryProvider({children}: QueryProviderProps){
+    return (
+
+        <QueryClientProvider client={queryClient}>
+            {children}
+        </QueryClientProvider>
+    )
+}