proteum 1.0.0-1

package/common/router/layouts.ts

@@ -0,0 +1,93 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import type { ComponentChild } from 'preact';
+
+// Core
+import type { ClientContext } from '@/client/context';
+import type { TRouteOptions } from '.';
+import type { TDataProvider } from './response/page';
+
+// App
+import internalLayout from '@client/pages/_layout';
+
+import * as layouts from '@/client/pages/**/_layout/index.tsx';
+
+/*----------------------------------
+- CONST
+----------------------------------*/
+
+export const layoutsList = layouts as ImportedLayouts;
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+type LayoutComponent = (attributes: { context: ClientContext }) => ComponentChild;
+
+export type Layout = { 
+    path: string, 
+    Component: LayoutComponent,
+    data?: TDataProvider
+}
+
+export type ImportedLayouts = {
+    [chunkId: string]: Layout["Component"]
+}
+
+/*----------------------------------
+- UTILS
+----------------------------------*/
+// TODO: getLayot only on server side, and pass the layout chunk id
+export const getLayout = (routePath: string, routeOptions?: TRouteOptions): Layout | undefined => {
+
+    if (routeOptions === undefined)
+        return undefined;
+    // W don't want a layout on this page
+    if (routeOptions.layout === false)
+        return undefined;
+
+    // options.id has been injected via the babel plugon
+    const chunkId = routeOptions["id"];
+    if (chunkId === undefined) {
+        console.error("Route informations where ID cas not injected:", routeOptions);
+        throw new Error(`ID has not injected for the following page route: ${routePath}`);
+    }
+    
+    // Layout via name
+    if (routeOptions.layout !== undefined) {
+
+        const { default: LayoutComponent, data } = layouts[routeOptions.layout];
+        if (LayoutComponent === undefined)
+            throw new Error(`No layout found with ID: ${routeOptions.layout}. registered layouts: ${Object.keys(layouts)}`);
+
+        return { 
+            path: routeOptions.layout, 
+            Component: layouts[routeOptions.layout].default,
+            data
+        }
+    } 
+            
+    // Automatic layout via the nearest _layout folder
+    for (const layoutPath in layouts)
+        if (
+            // The layout is nammed '' when it's at the root (@/client/pages/_layout)
+            layoutPath === '' // Root layout
+            // Exact match
+            || chunkId === layoutPath 
+            // Parent
+            || chunkId.startsWith( layoutPath + '_' )
+        )
+            return { 
+                path: layoutPath, 
+                Component: layouts[layoutPath].default,
+                data: layouts[layoutPath].data,
+            };
+
+    // Internal layout
+    return {
+        path: '/',
+        Component: internalLayout
+    }
+}

package/common/router/register.ts

@@ -0,0 +1,55 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import { pathToRegexp, Key } from 'path-to-regexp';
+
+// Core
+import { getLayout } from './layouts';
+
+// types
+import type { TRouteOptions } from '.';
+import type { TFrontRenderer } from './response/page';
+import type { TRegisterPageArgs } from '@client/services/router';
+
+/*----------------------------------
+- UTILS
+----------------------------------*/
+
+export const getRegisterPageArgs = (...args: TRegisterPageArgs) => {
+
+    let path: string;
+    let options: Partial<TRouteOptions> = {};
+    let renderer: TFrontRenderer;
+
+    if (args.length === 2)
+        ([path, renderer] = args)
+    else
+        ([path, options, renderer] = args)
+
+    // Automatic layout form the nearest _layout folder
+    const layout = getLayout(path, options);
+
+    return { path, options, renderer, layout }
+
+}
+
+export const buildRegex = ( path: string ) => {
+
+    // pathToRegexp ne supporte plus les wildcards depuis 4.0
+    if (path.endsWith('*'))
+        path = path.substring(0, path.length - 1) + '(.*)';
+
+    // path => regex
+    const keys: Key[] = []
+    const regex = pathToRegexp(path, keys, {
+        sensitive: true
+    }); 
+
+    return { 
+        keys: keys.map(k => k.name), 
+        regex 
+    }
+
+}

package/common/router/request/api.ts

@@ -0,0 +1,77 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+import type { HttpMethod } from '@server/services/router';
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+
+// The fetcher can be undefined if we put a condition on it
+// By example if we want to fetch an api endpoint only if the url contains a certain url parameter
+export type TFetcherList = { [id: string]: /*TFetcher | */Promise<any> | undefined }
+
+export type TFetcher<TData extends any = unknown> = {
+
+    // For async calls: api.post(...).then((data) => ...)
+    then: (callback: (data: TData) => void) => Promise<TData>,
+    catch: (callback: (data: any) => false | void) => Promise<TData>,
+    finally: (callback: () => void) => Promise<TData>,
+    run: () => Promise<TData>,
+    
+    method: HttpMethod,
+    path: string,
+    data?: TPostDataWithFile,
+    options?: TApiFetchOptions
+}
+
+export type TFetcherArgs = [
+    method: HttpMethod,
+    path: string,
+    data?: TPostDataWithFile,
+    options?: TApiFetchOptions
+]
+
+export type TApiFetchOptions = {
+    captcha?: string, // Action id (required by recaptcha)
+    onProgress?: (percent: number) => void,
+    // Default: json
+    encoding?: 'json' | 'multipart'
+}
+
+export type TPostData = TPostDataWithFile
+
+export type TPostDataWithFile = { [key: string]: PrimitiveValue }
+
+export type TPostDataWithoutFile = { [key: string]: PrimitiveValue }
+
+// https://stackoverflow.com/questions/44851268/typescript-how-to-extract-the-generic-parameter-from-a-type
+type TypeWithGeneric<T> = TFetcher<T>
+type extractGeneric<Type> = Type extends TypeWithGeneric<infer X> ? X : never
+
+export type TDataReturnedByFetchers<TProvidedData extends TFetcherList = {}> = {
+    [Property in keyof TProvidedData]: ThenArg< TProvidedData[Property] >
+}
+
+/*----------------------------------
+- CLASS
+----------------------------------*/
+export default abstract class ApiClient {
+
+    /*----------------------------------
+    - TOP LEVEL
+    ----------------------------------*/
+
+    public abstract set( newData: TObjetDonnees );
+
+    public abstract reload( ids?: string | string[], params?: TObjetDonnees );
+
+    /*----------------------------------
+    - LOW LEVEL
+    ----------------------------------*/
+
+    public abstract createFetcher<TData extends unknown = unknown>(...args: TFetcherArgs): TFetcher<TData>;
+
+    public abstract fetchSync(fetchers: TFetcherList, alreadyLoadedData: {}): Promise<TObjetDonnees>;
+}

package/common/router/request/index.ts

@@ -0,0 +1,35 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Core
+import Response from '../response';
+
+// Types
+import type { TBasicUser } from '@server/services/auth';
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+
+
+/*----------------------------------
+- CONTEXT
+----------------------------------*/
+export default abstract class BaseRequest {
+
+    // Permet d'accèder à l'instance complète via spread
+    public request: this = this;
+    public url!: string;
+    public host!: string;
+
+    public data: TObjetDonnees = {};
+    public abstract response?: Response;
+    public user: TBasicUser | null = null;
+
+    public constructor(
+        public path: string,
+    ) {
+
+    }
+}

package/common/router/response/index.ts

@@ -0,0 +1,45 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import { FunctionalComponent } from "preact";
+
+// Core
+import { TAnyRoute } from "..";
+import type ClientRequest from '@client/services/router/request';
+import Page from '@client/services/router/response/page'
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+
+export type TResponseData = Page
+
+/*----------------------------------
+- CONTEXT
+----------------------------------*/
+export default abstract class BaseResponse<
+    TData extends TResponseData = Page,
+    TRequest extends ClientRequest = ClientRequest
+> {
+
+    public data?: TData;
+    public request: TRequest;
+    public route?: TAnyRoute;
+
+    public constructor(
+        request: TRequest,
+    ) {
+        // ServerResponse et ClientResponse assignent request.response
+        request.response = this;
+        this.request = request as TRequest;
+    }
+
+    public setRoute(route: TAnyRoute) {
+        this.route = route;
+        return this;
+    }
+
+    public abstract redirect(url: string, code: number);
+}

package/common/router/response/page.ts

@@ -0,0 +1,128 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import type { VNode } from 'preact';
+import type { Thing } from 'schema-dts';
+
+// Core libs
+import { ClientOrServerRouter, TClientOrServerContextForPage, TRoute, TErrorRoute } from '@common/router';
+import { TFetcherList, TDataReturnedByFetchers } from '@common/router/request/api';
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+
+// The function that fetch data from the api before to pass them as context to the renderer
+export type TDataProvider<TProvidedData extends TFetcherList = TFetcherList> = (
+    context: TClientOrServerContextForPage & {
+        // URL query parameters
+        // TODO: typings
+        data: {[key: string]: string | number}
+    }
+) => TProvidedData
+
+// The function that renders routes
+export type TFrontRenderer<
+    TProvidedData extends TFetcherList = TFetcherList, 
+    TAdditionnalData extends {} = {},
+    TRouter = ClientOrServerRouter,
+> = ( 
+    context: (
+        TClientOrServerContextForPage 
+        &
+        TAdditionnalData
+        &
+        {
+            context: TClientOrServerContextForPage,
+            data: {[key: string]: PrimitiveValue}
+        }
+    )
+) => VNode<any> | null
+
+// Script or CSS resource
+export type TPageResource = {
+    id: string,
+    attrs?: TObjetDonnees
+} & ({
+    inline: string
+} | {
+    url: string,
+    preload?: boolean
+    })
+
+type TMetasDict = {
+    [key: string]: string | Date | undefined | null
+}
+
+type TMetasList = ({ $: string } & TMetasDict)[]
+
+const debug = false;
+
+/*----------------------------------
+- CLASS
+----------------------------------*/
+export default abstract class PageResponse<TRouter extends ClientOrServerRouter = ClientOrServerRouter> {
+
+    // Metadata
+    public chunkId: string;
+    public title?: string;
+    public description?: string;
+    public bodyClass: Set<string> = new Set<string>();
+    public bodyId?: string;
+    public url: string;
+
+    // Resources
+    public head: TMetasList = [];
+    public metas: TMetasDict = {};
+    public jsonld: Thing[] = [];
+    public scripts: TPageResource[] = [];
+    public style: TPageResource[] = [];
+
+    // Data
+    public fetchers: TFetcherList = {};
+    public data: TObjetDonnees = {};
+
+    public constructor(
+        public route: TRoute | TErrorRoute,
+        public renderer: TFrontRenderer,
+        public context: TClientOrServerContextForPage
+    ) {
+
+        this.chunkId = context.route.options["id"];
+
+        this.url = context.request.url;
+
+        this.fetchers = this.createFetchers(route.options.data);
+       
+    }
+
+    private createFetchers( dataProvider?: TDataProvider ) {
+
+        // Load the fetchers list to load data if needed
+        if (dataProvider)
+            return dataProvider({
+                ...this.context,
+                data: this.context.request.data
+            });
+        else
+            return {}
+
+    }
+    
+    public async fetchData() {
+
+        // Fetch layout data
+        if (this.layout?.data) {
+            const fetchers = this.createFetchers(this.layout.data);
+            this.fetchers = { ...this.fetchers, ...fetchers };
+        }
+
+        // Fetch page data
+        debug && console.log(`[router][page] Fetching api data:` + Object.keys(this.fetchers));
+        this.data = await this.context.request.api.fetchSync( this.fetchers, this.data );
+
+        return this.data;
+    }
+}

package/common/utils/rte.ts

@@ -0,0 +1,183 @@
+
+import type Driver from '@server/services/disks/driver';
+import { Anomaly } from '@common/errors';
+
+export type LexicalNode = {
+    version: number,
+    type: string,
+    children?: LexicalNode[],
+    // Attachement
+    src?: string;
+    // Headhing
+    text?: string;
+    anchor?: string;
+    tag?: string;
+}
+
+export type LexicalState = {
+    root: LexicalNode
+}
+
+export type TRenderOptions = {
+
+    format?: 'html' | 'text', // Default = html
+    transform?: RteUtils["transformNode"],
+
+    render?: (
+        node: LexicalNode, 
+        parent: LexicalNode | null, 
+        options: TRenderOptions
+    ) => Promise<LexicalNode>,
+
+    attachements?: {
+        disk: Driver,
+        directory: string,
+        prevVersion?: string | LexicalState | null,
+    }
+}
+
+export type TSkeleton = { 
+    id: string,
+    title: string, 
+    level: number, 
+    childrens: TSkeleton 
+}[];
+
+export type TContentAssets = {
+    attachements: string[],
+    skeleton: TSkeleton
+}
+
+export default abstract class RteUtils {
+
+    public async render( 
+        content: string | LexicalState, 
+        options: TRenderOptions = {}
+    ): Promise<TContentAssets & {
+        html: string | null,
+        json: string | LexicalState,
+    }> {
+
+        // Transform content
+        const assets: TContentAssets = {
+            attachements: [],
+            skeleton: []
+        }
+
+        // Parse content if string
+        let json = this.parseState(content);
+        if (json === false)
+            return { html: '', json: content, ...assets }
+
+        // Parse prev version if string
+        if (typeof options?.attachements?.prevVersion === 'string') {
+            try {
+                options.attachements.prevVersion = JSON.parse(options.attachements.prevVersion) as LexicalState;
+            } catch (error) {
+                throw new Anomaly("Invalid JSON format for the given JSON RTE prev version.");
+            }
+        }
+
+        const root = await this.processContent(json.root, null, async (node, parent) => {
+            return await this.transformNode(node, parent, assets, options);
+        });
+
+        json = { ...json, root };
+
+        // Delete unused attachements
+        const attachementOptions = options?.attachements;
+        if (attachementOptions && attachementOptions.prevVersion !== undefined) {
+
+            await this.processContent(root, null, async (node) => {
+                return await this.deleteUnusedFile(node, assets, attachementOptions);
+            });
+        }
+
+        // Convert json to HTML
+        let html: string | null;
+        if (options.format === 'text')
+            html = await this.jsonToText( json.root );
+        else
+            html = await this.jsonToHtml( json, options );
+
+        return { html, json: content, ...assets };
+    }
+
+    private parseState( content: string | LexicalState ): LexicalState | false {
+
+        if (typeof content === 'string' && content.trim().startsWith('{')) {
+            try {
+                return JSON.parse(content) as LexicalState;
+            } catch (error) { 
+                throw new Anomaly("Invalid JSON format for the given JSON RTE content.");
+            }
+        } else if (content && typeof content === 'object' && content.root)
+            return content;
+        else
+            return false;
+        
+    }
+
+    protected jsonToText(root: LexicalNode): string {
+        let result = '';
+
+        function traverse(node: LexicalNode) {
+            switch (node.type) {
+                case 'text':
+                    // Leaf text node
+                    result += node.text ?? '';
+                    break;
+                case 'linebreak':
+                    // Explicit line break node
+                    result += '\n';
+                    break;
+                default:
+                    // Container or block node: dive into children if any
+                    if (node.children) {
+                        node.children.forEach(traverse);
+                    }
+                    // After finishing a block-level node, append newline
+                    if (isBlockNode(node.type)) {
+                        result += '\n';
+                    }
+                    break;
+            }
+        }
+
+        // Heuristic: treat these as blocks
+        function isBlockNode(type: string): boolean {
+            return [
+                'root',
+                'paragraph',
+                'heading',
+                'listitem',
+                'unorderedlist',
+                'orderedlist',
+                'quote',
+                'codeblock',
+                'table',
+            ].includes(type);
+        }
+
+        traverse(root);
+
+        // Trim trailing whitespace/newlines
+        return result.replace(/\s+$/, '');
+    }
+    
+    public abstract jsonToHtml( json: LexicalState, options: TRenderOptions ): Promise<string | null>;
+
+    protected abstract processContent( 
+        node: LexicalNode, 
+        parent: LexicalNode | null, 
+        callback: (node: LexicalNode, parent: LexicalNode | null) => Promise<LexicalNode>
+    ): Promise<LexicalNode>;
+
+    protected abstract transformNode( node: LexicalNode, parent: LexicalNode | null, assets: TContentAssets, options: TRenderOptions ): Promise<LexicalNode>;
+
+    protected abstract deleteUnusedFile( 
+        node: LexicalNode, 
+        assets: TContentAssets, 
+        options: NonNullable<TRenderOptions["attachements"]>
+    ): Promise<LexicalNode>;
+}

package/common/utils.ts

@@ -0,0 +1,7 @@
+/**
+ * Helper to wait x seconds with promises
+ * Usage: await seconds(10); // Wait 10 seconds
+ * @param seconds The number of seconds to wait
+ * @returns A void promise
+ */
+export const seconds = (seconds: number) => new Promise((resolve) => setTimeout(resolve, seconds * 1000));

package/doc/TODO.md

@@ -0,0 +1,71 @@
+* Fix erreurs type Client / Server context
+    * Server side: ServerContext
+    * Client side: ClientContext | ServerContext
+    * PageResponse extends Response
+* Toast service
+* ClientApplication hooks
+    app.on('bug')
+    app.on('error')
+
+
+# Dependancies injection
+
+# Full stack Pages
+
+```typescript
+import Router from '@server/services/router';
+import { TRouterContext as ServerServices } from '@server/services/router/response';
+import { TRouterContext as ClientServices } from '@client/services/router/response';
+
+abstract class Controller< 
+    TRouter extends Router, 
+    TData extends any = any,
+    TUserAccess extends string = string
+> {
+
+    abstract auth: TUserAccess;
+
+    abstract get( services: ServerServices<TRouter> ): Promise<TData>;
+
+    abstract render( context: TData, services: ClientServices<TRouter> ): ComponentChild;
+
+}
+```
+
+```typescript
+//? /headhunter/missions/suggested'
+class Missions extends Controller<CrossPath["router"]> {
+
+    auth = 'USER';
+
+    async get({ headhunting, response, auth  }) {
+
+        const user = await auth.check('USER');
+
+        const suggested =  await headhunting.missions.Suggest( user );
+    
+        return { suggested }
+    }
+
+    render({ page, api, suggested }) {
+        return (
+            <Page title="App title here" subtitle="SEO description here">{page.loading || <>
+    
+                <section class="col">
+    
+                    <header class="row">
+                        <h2 class="col-1">Suggested Missions</h2>
+                    </header>
+    
+                    <div class="grid xa3">
+                        {suggested.map( mission => (
+                            <MissionCard mission={mission} />
+                        ))}
+                    </div>
+                </section>
+    
+            </>}</Page>
+        )
+    }
+}
+```