5htp-core 0.1.2 → 0.2.0

package/src/common/router/index.ts

@@ -2,70 +2,89 @@
 - DEPENDANCES
 ----------------------------------*/
 
-// Npm
-import { pathToRegexp, Key } from 'path-to-regexp';
-import type { ComponentChild } from 'preact';
+import { Layout } from './layouts';
 
 // types
 import type {
-    TRegisterPageArgs,
-    TClientRoute, 
-    TFrontRenderer 
-} from '@client/router';
+    default as ClientRouter,
+    TRouterContext as ClientRouterContext,
+    TRegisterPageArgs
+} from '@client/services/router';
 
-import type { ClientContext } from '@client/context';
+import type { 
+    default as ServerRouter, 
+    TRouterContext as ServerRouterContext,
+    TRouteHttpMethod 
+} from '@server/services/router';
 
-import type { TSchema } from '@common/data/input/validate';
+import type { TUserRole } from '@server/services/users';
 
-import type { TApiServerRoute } from '@server/services/router';
+import type { TAppArrowFunction } from '@common/app';
 
-import type { TUserRole } from '@server/services/auth/base';
+// Specfic
+import type ApiClient from './request/api';
+import type Request from './request';
+import type Response from './response';
+import type { default as Page, TFrontRenderer } from './response/page';
 
 /*----------------------------------
-- TYPES: layouts
+- TYPES: ROUTES
 ----------------------------------*/
 
-import layouts from '@/client/pages/**/_layout/index.tsx';
-
-type LayoutComponent = (attributes: { context: ClientContext }) => ComponentChild;
-export type Layout = { path: string, Component: LayoutComponent }
-const getLayout = (routePath: string | undefined): Layout | undefined => {
-    
-    let layout: Layout | undefined = layouts[''];
-    if (routePath) {
-        for (const layoutPath in layouts)
-            if (routePath === layoutPath || routePath.startsWith( layoutPath + '/' ))
-                layout = { path: layoutPath, Component: layouts[layoutPath] };
-    }
-    //layout && console.log(`${routePath}: Using Layout: ${layout.path}`);
-    return layout;
-}
+export type { Layout } from './layouts';
 
-/*----------------------------------
-- TYPES: ROUTES
-----------------------------------*/
+export type { default as Request } from './request';
+export type { default as Response } from './response';
 
-export type TBaseRoute = {
-    path: string,
+export type ClientOrServerRouter = ClientRouter | ServerRouter;
+
+export type TRoute<RouterContext extends TClientOrServerContext = TClientOrServerContext> = {
 
+    // Match
+    method: TRouteHttpMethod,
+    path: string,
     regex: RegExp,
     keys: (number | string)[],
 
+    // Execute
+    controller: TRouteController<RouterContext>,//TServerController<TRouter> | TFrontRenderer<TRouter>,
     options: TRouteOptions
 }
 
-export type TRoute = TApiServerRoute | TClientRoute;
-
-export type TErrorRoute = {
-    type: 'PAGE',
-    renderer: TFrontRenderer,
-    options: {}
+export type TErrorRoute<RouterContext extends TClientOrServerContext = TClientOrServerContext> = {
+    code,
+    controller: TRouteController<RouterContext>,
+    options: TRouteOptions
 }
 
+export type TClientOrServerContext<
+    TClientOnlyContextKeys extends keyof ClientRouterContext = keyof (ClientRouterContext | ServerRouterContext)
+> = (
+    (
+        {[serverContextKey in keyof ServerRouterContext/*Omit<ClientRouterContext, TClientOnlyContextKeys>*/]: undefined} 
+        & 
+        ClientRouterContext
+    )
+    | 
+    (
+        // Tell that all the keys of client context are existing but undefined
+        //  This avoids errors: "Property 'page' is optional in type '{ app: Application; ..."
+        //  When we destructure the context from the page controller
+        //  While making reference to a key only available in client context
+        // So here, we put the
+        {[clientContextKey in keyof ClientRouterContext/*Omit<ClientRouterContext, TClientOnlyContextKeys>*/]: undefined} 
+        & 
+        ServerRouterContext
+    )
+)
+
+export type TRouteController<RouterContext extends TClientOrServerContext = TClientOrServerContext> = 
+    (context: RouterContext) => /* Page to render */Page | /* Any data (html, json) */Promise<any>
+
 export type TRouteOptions = {
 
     // Injected by the page plugin
-    filepath: string,
+    filepath?: string,
 
     // Indexing
     bodyId?: string,
@@ -78,7 +97,7 @@ export type TRouteOptions = {
 
     // Access Restriction
     auth?: TUserRole | boolean,
-    form?: TSchema,
+    //form?: TSchema,
     layout?: false | Layout,
 
     TESTING?: boolean,
@@ -86,6 +105,11 @@ export type TRouteOptions = {
 
 }
 
+export type TRouteModule<TRegisteredRoute = any> = { 
+    // exporing __register is a way to know we axport a TAppArrowFunction
+    __register?: TAppArrowFunction<TRegisteredRoute> 
+}
+
 export const defaultOptions = {
     priority: 0,
 }
@@ -94,55 +118,10 @@ export const defaultOptions = {
 - BASE ROUTER
 ----------------------------------*/
 
-export default abstract class BaseRouter {
-
-    public page = <TControllerData extends TObjetDonnees = {}>(...args: TRegisterPageArgs<TControllerData>) =>
-        this.registerPage(...args);
-
-    public error = (code: number, options, renderer: TFrontRenderer<{ message: string }>) =>
-        this.registerErrorPage(code, options, renderer);
-
-    protected abstract registerPage(...page: TRegisterPageArgs ): any;
-
-    public errors: { [code: number]: TErrorRoute } = {};
-    protected registerErrorPage( code: number, options, renderer: TFrontRenderer ) {
-        return this.errors[code] = {
-            type: 'PAGE',
-            renderer,
-            options
-        };
-    }
-
-    protected getRegisterPageArgs(...args: TRegisterPageArgs) {
-
-        const [path, options, controller, renderer] = args;
-
-        // S'il s'agit d'une page, son id doit avoir été injecté via le plugin babel
-        if (options["id"] === undefined)
-            throw new Error(`ID not found for the following page route: ${path}`);
-
-        // Bind layout
-        if (options.layout !== false)
-            options.layout = getLayout(options.filepath);
-
-        return { path, options, controller, renderer }
-
-    }
-
-    protected 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
-        }); 
+export default abstract class RouterInterface {
 
-        return { keys, regex }
+    public abstract page<TControllerData extends TObjetDonnees = {}>(...args: TRegisterPageArgs<TControllerData>);
 
-    }
+    public abstract error(code: number, options, renderer: TFrontRenderer<{}, { message: string }>);
 
 }

package/src/common/router/layouts.ts

@@ -0,0 +1,50 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import type { ComponentChild } from 'preact';
+// Core
+import type { ClientContext } from '@/client/context';
+// App
+import 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 }
+
+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 | undefined): Layout | undefined => {
+
+    //console.log(`[router][layouts] Get layout for "${routePath}".`);
+    
+    let layout: Layout | undefined;
+    if (routePath) {
+        for (const layoutPath in layouts)
+            if (routePath === layoutPath || routePath.startsWith( layoutPath + '_' ))
+                layout = { 
+                    path: layoutPath, 
+                    Component: layouts[layoutPath] 
+                };
+    }
+
+    //console.log(`[router][layouts] Get layout for "${routePath}". Found:`, layout);
+
+    return layout;
+}

package/src/common/router/register.ts

@@ -0,0 +1,62 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+// Npm
+import { pathToRegexp, Key } from 'path-to-regexp';
+
+// Core
+import { getLayout } from './layouts';
+
+// types
+import type { TRouteOptions } from '.';
+import type { TDataProvider, 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 controller: TDataProvider|null;
+    let renderer: TFrontRenderer;
+
+    if (args.length === 3)
+        ([path, controller, renderer] = args)
+    else
+        ([path, options, controller, renderer] = args)
+
+    // S'il s'agit d'une page, son id doit avoir été injecté via le plugin babel
+    const chunkId = options["id"];
+    if (chunkId === undefined)
+        throw new Error(`ID has not injected for the following page route: ${path}`);
+
+    // Bind layout
+    if (options.layout !== false)
+        options.layout = getLayout(chunkId);
+
+    return { path, options, controller, renderer }
+
+}
+
+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/src/common/router/request/api.ts

@@ -0,0 +1,72 @@
+/*----------------------------------
+- DEPENDANCES
+----------------------------------*/
+
+import type { HttpMethod } from '@server/services/router';
+
+/*----------------------------------
+- TYPES
+----------------------------------*/
+
+export type TFetcherList = { [id: string]: TFetcher }
+
+export type TFetcher<TData extends unknown = unknown> = {
+
+    // For async calls: api.post(...).then((data) => ...)
+    then: (callback: (data: TData) => void) => Promise<TData>,
+    run: () => Promise<TData>,
+    
+    method: HttpMethod,
+    path: string,
+    data?: object,
+    options?: TApiFetchOptions
+}
+
+export type TFetcherArgs = [
+    method: HttpMethod,
+    path: string,
+    data?: object,
+    options?: TApiFetchOptions
+]
+
+export type TApiFetchOptions = {
+    captcha?: string, // Action id (required by recaptcha)
+    onProgress?: (percent: number) => void
+}
+
+// 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]: undefined | (extractGeneric<TProvidedData[Property]> extends ((...args: any[]) => any) 
+        ? ThenArg<ReturnType< extractGeneric<TProvidedData[Property]> >>
+        : extractGeneric<TProvidedData[Property]>
+    )
+}
+
+/*----------------------------------
+- CLASS
+----------------------------------*/
+export default abstract class ApiClient {
+
+    /*----------------------------------
+    - TOP LEVEL
+    ----------------------------------*/
+
+    public abstract get<TData extends unknown = unknown>(path: string, data?: TObjetDonnees, opts?: TApiFetchOptions): TFetcher<TData>;
+
+    public abstract post<TData extends unknown = unknown>(path: string, data?: TObjetDonnees, opts?: TApiFetchOptions): TFetcher<TData>;
+
+    public abstract put<TData extends unknown = unknown>(path: string, data?: TObjetDonnees, opts?: TApiFetchOptions): TFetcher<TData>;
+
+    public abstract delete<TData extends unknown = unknown>(path: string, data?: TObjetDonnees, opts?: TApiFetchOptions): TFetcher<TData>;
+
+    /*----------------------------------
+    - LOW LEVEL
+    ----------------------------------*/
+
+    public abstract createFetcher<TData extends unknown = unknown>(...args: TFetcherArgs): TFetcher<TData>;
+
+    public abstract fetchSync(fetchers: TFetcherList): Promise<TObjetDonnees>;
+}

package/src/common/router/request/index.ts

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

package/src/common/router/{response.ts → response/index.ts}

@@ -6,30 +6,26 @@
 import { FunctionalComponent } from "preact";
 
 // Core
-import { TRoute } from ".";
-import BaseRequest from './request';
-import { TClientRoute, TFrontRenderer } from '@client/router';
-import PageResponse from './response/page';
-import { ClientContext } from '@client/context';
+import { TRoute } from "..";
+import type ClientRequest from '@client/services/router';
+import Page from '@client/services/router/response/page'
 
 /*----------------------------------
 - TYPES
 ----------------------------------*/
 
-export { default as PageResponse } from './response/page';
-
-export type TResponseData = PageResponse | unknown
+type TResponseData = Page
 
 /*----------------------------------
 - CONTEXT
 ----------------------------------*/
 export default abstract class BaseResponse<
-    TData extends TResponseData = TResponseData,
-    TRequest extends BaseRequest = BaseRequest
+    TData extends TResponseData = Page,
+    TRequest extends ClientRequest = ClientRequest
 > {
 
-    public data?: any;
-    public request: With<TRequest, 'response'>;
+    public data?: TData;
+    public request: TRequest;
     public route?: TRoute;
 
     public constructor(
@@ -37,7 +33,7 @@ export default abstract class BaseResponse<
     ) {
         // ServerResponse et ClientResponse assignent request.response
         request.response = this;
-        this.request = request as With<TRequest, 'response'>;
+        this.request = request as TRequest;
     }
 
     public setRoute(route: TRoute) {

package/src/common/router/response/page.ts

@@ -2,19 +2,38 @@
 - DEPENDANCES
 ----------------------------------*/
 
-import type { ComponentChild } from 'preact';
+import type { ComponentChild, FunctionComponent } from 'preact';
 
 // Core libs
-import { TClientRoute, TFrontRenderer } from '@client/router';
-import { TFetcherList } from '@common/router/request';
-import { history } from '@client/router/request/history';
-import { ClientContext } from '@client/context';
+import { ClientOrServerRouter, TClientOrServerContext } from '@common/router';
+import { TFetcherList, TDataReturnedByFetchers } from '@common/router/request/api';
+import { history } from '@client/services/router/request/history';
 
 /*----------------------------------
 - TYPES
 ----------------------------------*/
 
-type TResource = {
+// The function that fetch data from the api before to pass them as context to the renderer
+export type TDataProvider<TProvidedData extends TFetcherList = {}> = 
+    (context: TClientOrServerContext/* & TUrlData */) => TProvidedData
+
+
+
+// The function that renders routes
+export type TFrontRenderer<
+    TProvidedData extends TFetcherList = {}, 
+    TAdditionnalData = {},
+    TRouter = ClientOrServerRouter,
+> = FunctionComponent<(
+    TClientOrServerContext 
+    & 
+    TDataReturnedByFetchers<TProvidedData>
+    &
+    TAdditionnalData
+)>;
+
+// Script or CSS resource
+export type TPageResource = {
     id: string,
     attrs?: TObjetDonnees
 } & ({
@@ -27,70 +46,35 @@ type TResource = {
 /*----------------------------------
 - CLASS
 ----------------------------------*/
-export default class PageResponse {
-
-    // Render
-    public id: string;
-    public data: TObjetDonnees = {};
-    public loading: ComponentChild = false;
-    public component: TFrontRenderer;
+export default 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;
 
-    // resources
+    // Resources
     public amp?: boolean;
-    public scripts: TResource[] = [];
-    public style: TResource[] = [];
-
-    // State
-    public hash?: string; // Element id to scroll to
-
-    public constructor( 
-        public context: ClientContext,
-        public route: TClientRoute,
-        data: TObjetDonnees = {},
-    ) {
-        this.id = route.options.id; // Binded by the pages babel plugin
-        this.bodyId = route.options.bodyId;
-        this.component = route.renderer;
-        this.data = data;
-        this.hash = context.request.hash;
-    }
+    public scripts: TPageResource[] = [];
+    public style: TPageResource[] = [];
 
-    // API data fetchers
+    // Data
     public fetchers: TFetcherList = {};
+    public data: TObjetDonnees = {};
 
-    // Should be called AFTER rendering the page
-    public updateClient() {
+    public constructor(
+        public dataProvider: TDataProvider | null,
+        public renderer: TFrontRenderer,
+        public context: TClientOrServerContext
+    ) {
 
-        document.body.id = this.bodyId || this.id;
-        document.title = this.title || APP_NAME;
-        document.body.className = [...this.bodyClass].join(' ');
-        
+        this.chunkId = context.route.options["id"];
+       
     }
     
-
     public async fetchData() {
-        this.isDataLoaded = true;
-        this.data = await this.context.request.fetchSync(this.fetchers);
-        return this.data;
-    }
-
-    public setAllData( callback: (data: {[k: string]: any}) => void) { 
-        console.warn(`page.setAllData not yet attached to the page Reatc component.`); 
-    }
-    public setData( key: string, value: ((value: any) => void) | any ) {
-        this.setAllData(old => ({ 
-            ...old, 
-            [key]: typeof value === 'function' ? value(old[key]) : value 
-        }));
-    }
-
-    public go( url: string ) {
-        history?.replace(url);
+        return await this.context.request.api.fetchSync( this.fetchers );
     }
 }

package/src/common/validation/index.ts

@@ -0,0 +1,3 @@
+export { default as Schema } from './schema';
+export { default as Validators } from './validators';
+export { default as Validator } from './validator';