5htp-core 0.4.1 → 0.4.2

package/src/client/components/inputv3/date/Clock.css

@@ -0,0 +1,62 @@
+.react-clock {
+  display: block;
+  position: relative;
+}
+
+.react-clock,
+.react-clock *,
+.react-clock *:before,
+.react-clock *:after {
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.react-clock__face {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  border: 1px solid black;
+  border-radius: 50%;
+}
+
+.react-clock__hand {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  right: 50%;
+}
+
+.react-clock__hand__body {
+  position: absolute;
+  background-color: black;
+  transform: translateX(-50%);
+}
+
+.react-clock__mark {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  right: 50%;
+}
+
+.react-clock__mark__body {
+  position: absolute;
+  background-color: black;
+  transform: translateX(-50%);
+}
+
+.react-clock__mark__number {
+  position: absolute;
+  left: -40px;
+  width: 80px;
+  text-align: center;
+}
+
+.react-clock__second-hand__body {
+  background-color: red;
+}

package/src/client/components/inputv3/date/DateTimePicker.css

@@ -0,0 +1,132 @@
+.react-datetime-picker {
+  display: inline-flex;
+  position: relative;
+}
+
+.react-datetime-picker,
+.react-datetime-picker *,
+.react-datetime-picker *:before,
+.react-datetime-picker *:after {
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.react-datetime-picker--disabled {
+  background-color: #f0f0f0;
+  color: #6d6d6d;
+}
+
+.react-datetime-picker__wrapper {
+  display: flex;
+  flex-grow: 1;
+  flex-shrink: 0;
+  border: thin solid gray;
+}
+
+.react-datetime-picker__inputGroup {
+  min-width: calc(4px + (4px * 3) + 0.54em * 6 + 0.217em * 2);
+  flex-grow: 1;
+  padding: 0 2px;
+}
+
+.react-datetime-picker__inputGroup__divider {
+  padding: 1px 0;
+  white-space: pre;
+}
+
+.react-datetime-picker__inputGroup__divider,
+.react-datetime-picker__inputGroup__leadingZero {
+  display: inline-block;
+  font: inherit;
+}
+
+.react-datetime-picker__inputGroup__input {
+  min-width: 0.54em;
+  height: calc(100% - 2px);
+  position: relative;
+  padding: 1px;
+  border: 0;
+  background: none;
+  color: currentColor;
+  font: inherit;
+  box-sizing: content-box;
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+}
+
+.react-datetime-picker__inputGroup__input::-webkit-outer-spin-button,
+.react-datetime-picker__inputGroup__input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  margin: 0;
+}
+
+.react-datetime-picker__inputGroup__input:invalid {
+  background: rgba(255, 0, 0, 0.1);
+}
+
+.react-datetime-picker__inputGroup__input--hasLeadingZero {
+  margin-left: -0.54em;
+  padding-left: calc(1px + 0.54em);
+}
+
+.react-datetime-picker__inputGroup__amPm {
+  font: inherit;
+  -webkit-appearance: menulist;
+  -moz-appearance: menulist;
+  appearance: menulist;
+}
+
+.react-datetime-picker__button {
+  border: 0;
+  background: transparent;
+  padding: 4px 6px;
+}
+
+.react-datetime-picker__button:enabled {
+  cursor: pointer;
+}
+
+.react-datetime-picker__button:enabled:hover .react-datetime-picker__button__icon,
+.react-datetime-picker__button:enabled:focus .react-datetime-picker__button__icon {
+  stroke: #0078d7;
+}
+
+.react-datetime-picker__button:disabled .react-datetime-picker__button__icon {
+  stroke: #6d6d6d;
+}
+
+.react-datetime-picker__button svg {
+  display: inherit;
+}
+
+.react-datetime-picker__calendar,
+.react-datetime-picker__clock {
+  z-index: 1;
+}
+
+.react-datetime-picker__calendar--closed,
+.react-datetime-picker__clock--closed {
+  display: none;
+}
+
+.react-datetime-picker__calendar {
+  width: 350px;
+  max-width: 100vw;
+}
+
+.react-datetime-picker__calendar .react-calendar {
+  border-width: thin;
+}
+
+.react-datetime-picker__clock {
+  width: 200px;
+  height: 200px;
+  max-width: 100vw;
+  padding: 25px;
+  background-color: white;
+  border: thin solid #a0a096;
+}

package/src/client/components/inputv3/date/index.tsx

@@ -4,8 +4,7 @@
 
 // Npm
 import React from 'react';
-import type { StateUpdater } from 'preact/hooks';
-import DateRangePicker from '@wojtekmaj/react-daterange-picker';
+import DateRangePicker, { DateTimePickerProps } from 'react-datetime-picker';
 
 // Core
 
@@ -16,9 +15,9 @@ import DateRangePicker from '@wojtekmaj/react-daterange-picker';
 ----------------------------------*/
 
 type TValue = [Date, Date]
-export type Props = {
-    value: TValue,
-    onChange: StateUpdater<TValue>,
+export type Props = DateTimePickerProps & {
+    //value: TValue,
+    //onChange: StateUpdater<TValue>,
     placeholder?: string,
     min?: string,
     max?: string
@@ -27,9 +26,10 @@ export type Props = {
 /*----------------------------------
 - COMPOSANT
 ----------------------------------*/
-import './react-calendar.less';
-import './react-daterange-picker.less';
-export default ({ value, Props, min, max, onChange }) => {
+import './DateTimePicker.css';
+import './Calendar.css';
+import './Clock.css';
+export default ({ value, Props, min, max, onChange, ...otherProps }) => {
 
     const state = React.useState(false);
 
@@ -43,7 +43,7 @@ export default ({ value, Props, min, max, onChange }) => {
     ----------------------------------*/
     return (
         <div>
-            <DateRangePicker onChange={onChange} value={value || [null, null]} />
+            <DateRangePicker {...otherProps} onChange={onChange} value={value || [null, null]} />
         </div>
     )
 }

package/src/client/components/inputv3/index.tsx

@@ -168,44 +168,42 @@ export default ({
     /*----------------------------------
     - RENDER
     ----------------------------------*/
-    return (
-        <div class="col sp-05">
-            <div class={className} onClick={() => refInput.current?.focus()}>
-
-                {prefix}
-
-                <div class="contValue">
-
-                    <Tag {...fieldProps}
-                        // @ts-ignore: Property 'ref' does not exist on type 'IntrinsicAttributes'
-                        ref={refInput}
-                        value={value}
-                        onFocus={() => setState({ focus: true })}
-                        onBlur={() => setState({ focus: false })}
-                        onChange={(e) => updateValue(e.target.value)}
-
-                        onKeyDown={(e: KeyboardEvent) => {
-
-                            if (onPressEnter && e.key === 'Enter' && value !== undefined) {
-                                commitValue();
-                                onPressEnter(value)
-                            }
-                        }}
-                    />
-
-                    <label>{props.title}{required && (
-                        <span class="fg error">&nbsp;*</span>
-                    )}</label>
-                </div>
-
-                {suffix}
-                
+    return <>
+        <div class={className} onClick={() => refInput.current?.focus()}>
+
+            {prefix}
+
+            <div class="contValue">
+
+                <Tag {...fieldProps}
+                    // @ts-ignore: Property 'ref' does not exist on type 'IntrinsicAttributes'
+                    ref={refInput}
+                    value={value}
+                    onFocus={() => setState({ focus: true })}
+                    onBlur={() => setState({ focus: false })}
+                    onChange={(e) => updateValue(e.target.value)}
+
+                    onKeyDown={(e: KeyboardEvent) => {
+
+                        if (onPressEnter && e.key === 'Enter' && value !== undefined) {
+                            commitValue();
+                            onPressEnter(value)
+                        }
+                    }}
+                />
+
+                <label>{props.title}{required && (
+                    <span class="fg error">&nbsp;*</span>
+                )}</label>
             </div>
-            {errors?.length && (
-                <div class="fg error txt-left">
-                    {errors.join('. ')}
-                </div>
-            )}
+
+            {suffix}
+            
         </div>
-    )
+        {errors?.length && (
+            <div class="fg error txt-left">
+                {errors.join('. ')}
+            </div>
+        )}
+    </>
 }

package/src/client/services/router/index.tsx

@@ -159,7 +159,7 @@ export default class ClientRouter<
     public url = (path: string, params: {} = {}, absolute: boolean = true) => 
         buildUrl(path, params, this.domains, absolute);
 
-    public go( url: string, data: {}, opt: {
+    public go( url: string, data: {} = {}, opt: {
         newTab?: boolean
     } = {}) {
 
@@ -448,7 +448,8 @@ export default class ClientRouter<
         // Nor page configurated for this error
         if (route === undefined) {
             console.error(`Error page for http error code ${code} not found.`, this.errors, this.routes);
-            this.app.handleError(e, 404);
+            e.http = 404;
+            this.app.handleError(e);
             throw new Error(`Error page for http error code ${code} not found.`);
         }
 

package/src/client/services/router/request/api.ts

@@ -117,11 +117,28 @@ export default class ApiClient implements ApiClientService {
         const [method, path, data, options] = args;
         return {
             method, path, data, options,
+
             // For async calls: api.post(...).then((data) => ...)
-            then: (callback: (data: any) => void) => this.fetchAsync<TData>(...args).then(callback),
-            catch: (callback: (data: any) => void) => this.fetchAsync<TData>(...args).catch(callback),
-            finally: (callback: () => void) => this.fetchAsync<TData>(...args).finally(callback),
+            then: (callback: (data: any) => void) => this.fetchAsync<TData>(...args)
+                .then(callback)
+                .catch( e => this.app.handleError(e)),
+
+            // Default error behavior only if not handled before by the app
+            catch: (callback: (data: any) => void) => this.fetchAsync<TData>(...args)
+                .catch((e) => {
+                    try {
+                        callback(e);
+                    } catch (error) {
+                        this.app.handleError(e)
+                    }
+                }),
+
+            finally: (callback: () => void) => this.fetchAsync<TData>(...args)
+                .finally(callback)
+                .catch( e => this.app.handleError(e)),
+
             run: () => this.fetchAsync<TData>(...args)
+                .catch( e => this.app.handleError(e)),
         };
     }
 
@@ -132,10 +149,7 @@ export default class ApiClient implements ApiClientService {
         /*if (options?.captcha !== undefined)
             await this.gui.captcha.check(options?.captcha);*/
 
-        return await this.execute<TData>(method, path, data, options).catch((e) => {
-            this.app.handleError(e);
-            throw e; // Throw to break the loop
-        })
+        return await this.execute<TData>(method, path, data, options);
     }
 
     public async fetchSync(fetchers: TFetcherList, alreadyLoadedData: {}): Promise<TObjetDonnees> {
@@ -163,6 +177,12 @@ export default class ApiClient implements ApiClientService {
 
                 return data;
 
+            }).catch(e => {
+
+                // API Error hook
+                this.app.handleError(e);
+
+                throw e;
             })
 
         // Errors will be catched in the caller
@@ -239,9 +259,6 @@ export default class ApiClient implements ApiClientService {
                         e.response.data
                     );
 
-                    // API Error hook
-                    this.app.handleError(error, e.response.status);
-
                     throw error;
     
                 // Erreur réseau: l'utilisateur n'ets probablement plus connecté à internet

package/src/client/services/router/request/index.ts

@@ -4,7 +4,6 @@
 
 // Npm
 import { Location } from 'history'; 
-import type Bowser from 'bowser';
 
 // Core 
 import BaseRequest from '@common/router/request';
@@ -52,11 +51,4 @@ export default class ClientRequest<TRouter extends ClientRouter = ClientRouter>
         // Request services
         this.api = new ApiClient(this.app, this);
     }
-
-    // To move to a service
-    public device(): Bowser.Parser.ParsedResult | undefined {
-        // We load bowser only when required
-        const Bowser = require("bowser");
-        return Bowser.parse(window.navigator.userAgent);
-    }
 }

package/src/common/router/layouts.ts

@@ -9,6 +9,7 @@ import type { ClientContext } from '@/client/context';
 import type { TRouteOptions } from '.';
 // App
 import internalLayout from '@client/pages/_layout';
+
 import layouts from '@/client/pages/**/_layout/index.tsx';
 
 /*----------------------------------
@@ -63,8 +64,8 @@ export const getLayout = (routePath: string, routeOptions?: TRouteOptions): Layo
     // Automatic layout via the nearest _layout folder
     for (const layoutPath in layouts)
         if (
-            // The layout is nammed index when it's at the root (@/client/pages/_layout)
-            layoutPath === 'index' 
+            // The layout is nammed '' when it's at the root (@/client/pages/_layout)
+            layoutPath === '' // Root layout
             // Exact match
             || chunkId === layoutPath 
             // Parent

package/src/common/validation/schema.ts

@@ -102,10 +102,6 @@ export default class Schema<TFields extends TSchemaFields> {
             const cheminAstr = cheminA.join('.')
             const valOrigine = dataToValidate[fieldName];
 
-            // Key not in the input data, we don't create an entry in the output
-            if (!( fieldName in dataToValidate))
-                continue;
-
             // Validation
             try {
 
@@ -117,7 +113,8 @@ export default class Schema<TFields extends TSchemaFields> {
                 //      Exemple: undefinec = suppression fichier | Absende donnée = conservation fihcier actuel
                 if (val === EXCLUDE_VALUE)
                     opts.debug && console.log(LogPrefix, '[' + cheminA + '] Exclusion demandée');
-                else
+                // Key not in the input data, we don't create an entry in the output
+                else if (fieldName in dataToValidate)
                     output[fieldName] = val;
 
                 opts.debug && console.log(LogPrefix, '[' + cheminA + ']', valOrigine, '=>', val);

package/src/common/validation/validators.ts

@@ -3,12 +3,11 @@
 ----------------------------------*/
 
 // Npm
-import {
-    trim,
-    isISO8601, toDate,
-    isEmail, normalizeEmail,
-    isURL
-} from 'validator';
+import trim from 'validator/lib/trim';
+import isISO8601 from 'validator/lib/isISO8601';
+import toDate from 'validator/lib/toDate';
+import isEmail from 'validator/lib/isEmail';
+import isURL from 'validator/lib/isURL';
 
 import normalizeUrl, { Options as NormalizeUrlOptions } from 'normalize-url';
 

package/src/server/services/database/index.ts

@@ -279,12 +279,12 @@ export default class SQL extends Service<Config, Hooks, Application, Services> {
     public query = this.select;
 
     public first = <TRowData extends TObjetDonnees = {}>(query: string, opts: TSelectQueryOptions = {}): Promise<TRowData> =>
-        this.database.query(query, opts).then((resultatRequetes: any) => {
+        this.select(query, opts).then((resultatRequetes: any) => {
             return resultatRequetes[0] || null;
         });
 
     public firstOrFail = <TRowData extends TObjetDonnees = {}>(query: string, message?: string, opts: TSelectQueryOptions = {}): Promise<TRowData> =>
-        this.database.query(query, opts).then((resultatRequetes: any) => {
+        this.select(query, opts).then((resultatRequetes: any) => {
 
             if (resultatRequetes.length === 0)
                 throw new NotFound(message);

package/src/server/services/router/response/page/document.tsx

@@ -30,7 +30,7 @@ export default class DocumentRenderer<TRouter extends Router> {
 
     public staticDocument() {
         const routesForClient = JSON.stringify( this.router.ssrRoutes );
-        return renderToString(
+        return '<!doctype html>' + renderToString(
             <html lang="en">
                 <head>
                     {/* Format */}
@@ -63,7 +63,7 @@ export default class DocumentRenderer<TRouter extends Router> {
             className: [...page.bodyClass].join(' '),
         };
 
-        return renderToString(
+        return '<!doctype html>' + renderToString(
             <html lang="en" {...(page.amp ? { amp: "true" } : {})}>
                 <head>
                     {/* Format */}
@@ -114,14 +114,12 @@ export default class DocumentRenderer<TRouter extends Router> {
             <meta name="msapplication-TileColor" content={this.app.identity.maincolor} />
             <meta name="apple-mobile-web-app-capable" content="yes" />
             <meta name="apple-mobile-web-app-title" content={this.app.identity.web.title} />
+            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
 
             {/* Identité */}
             <meta name="mobile-web-app-capable" content="yes" />
             <meta name="application-name" content={this.app.identity.web.title} />
             <meta name="type" content="website" />
-            {/*app.identity.social?.facebook?.appId && (
-                <meta content={app.identity.social?.facebook?.appId} property="fb:appid" />
-            )*/}
 
             {/* https://stackoverflow.com/questions/48956465/favicon-standard-2019-svg-ico-png-and-dimensions */}
             {/*<link rel="manifest" href={RES['manifest.json']} />*/}
@@ -139,7 +137,7 @@ export default class DocumentRenderer<TRouter extends Router> {
 
     private styles( page: Page ) {
         return <>
-            <link rel="stylesheet" type="text/css" href="/public/icons.css" />
+            <link rel="stylesheet" type="text/css" href={"/public/icons.css?" + BUILD_ID} />
             <link rel="preload" href="/public/client.css" as="style" />
             <link rel="stylesheet" type="text/css" href="/public/client.css" />
 

package/src/client/assets/fonts/Lato/index.less

@@ -1,71 +0,0 @@
-// 
-/*
-    The use of Unicode range subsets and separate files for each stylistic variant of 
-    the font allows you to define a composite font family that is both faster and more 
-    efficient to download. Visitors only download the variants and subsets they need, 
-    and they aren't forced to download subsets that they may never see or use on the page.
-
-    https://web.dev/reduce-webfont-size/#unicode-range-subsetting
-
-    Original stylesheet: https://fonts.googleapis.com/css2?family=Rubik:wght@600&display=swap
-*/
-
-/* latin-ext */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 400;
-    font-display: swap;
-    src: url(./latin-ext-400.woff2) format('woff2');
-    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 400;
-    font-display: swap;
-    src: url(./latin-400.woff2) format('woff2');
-    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* latin-ext */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 700;
-    font-display: swap;
-    src: url(./latin-ext-700.woff2) format('woff2');
-    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 700;
-    font-display: swap;
-    src: url(./latin-700.woff2) format('woff2');
-    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* latin-ext */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 900;
-    font-display: swap;
-    src: url(./latin-ext-900.woff2) format('woff2');
-    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-    font-family: 'Lato';
-    font-style: normal;
-    font-weight: 900;
-    font-display: swap;
-    src: url(./latin-900.woff2) format('woff2');
-    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}