5htp-core 0.5.1-3 → 0.5.1-5

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "5htp-core",
 	"description": "Convenient TypeScript framework designed for Performance and Productivity.",
-	"version": "0.5.1-3",
+	"version": "0.5.1-5",
 	"author": "Gaetan Le Gac (https://github.com/gaetanlegac)",
 	"repository": "git://github.com/gaetanlegac/5htp-core.git",
 	"license": "MIT",

package/src/client/components/inputv3/Rte/nodes/ReferenceLinkNode.tsx

@@ -0,0 +1,56 @@
+
+import { HeadingNode, HeadingTagType } from '@lexical/rich-text';
+import { AutoLinkNode, LinkNode } from '@lexical/link';
+
+export default class ReferenceLinkNode extends LinkNode {
+
+    public referenceTo?: string; 
+
+    // Adding a static method to register the custom node
+    static getType() {
+        return 'reference-link';
+    }
+
+    static clone(node) {
+        return new ReferenceLinkNode(node.__url, {
+            rel: node.__rel,
+            target: node.__target,
+            title: node.__title
+          }, node.__key);
+    }
+
+    // Add a `referenceTo` attribute to the serialized JSON
+    static importJSON(serializedNode) {
+        const node = new ReferenceLinkNode(serializedNode.url);
+        node.referenceTo = serializedNode.referenceTo;
+        return node;
+    }
+
+    // Ensure the `referenceTo` attribute is serialized in JSON
+    exportJSON() {
+        return {
+            ...super.exportJSON(),
+            type: ReferenceLinkNode.getType(),
+            referenceTo: this.referenceTo
+        };
+    }
+
+    // Override createDOM to set the `referenceTo` attribute
+    createDOM(config) {
+        const dom = super.createDOM(config);
+        if (this.referenceTo) {
+            dom.setAttribute('class', this.referenceTo);
+        }
+        return dom;
+    }
+
+    // Update the DOM to reflect changes in the `referenceTo` attribute
+    updateDOM(prevNode, dom, config) {
+        const updated = super.updateDOM(prevNode, dom, config);
+        if (this.referenceTo !== prevNode.referenceTo) {
+            dom.setAttribute('class', this.referenceTo);
+            return true;
+        }
+        return updated;
+    }
+}

package/src/client/components/inputv3/file/index.less

@@ -5,14 +5,16 @@
     position: relative;
     overflow: hidden;
 
-    border-radius: @radius;
-    border: dashed 3px var(--cLine);
-    background: @cBgPage + #090909;
-
-    padding: @spacing;
-    width: 100%;
-    min-height: 200px;
-    height: 14.15rem;
+    &.box {
+        border-radius: @radius;
+        border: dashed 3px var(--cLine);
+        background: @cBgPage + #090909;
+    
+        padding: @spacing;
+        width: 100%;
+        min-height: 200px;
+        height: 14.15rem;
+    }
 
     .preview,
     .indication,

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

@@ -6,7 +6,7 @@ import React from 'react';
 import { ComponentChild } from 'preact';
 
 // Composants généraux
-import Bouton from '@client/components/button';
+import Button, { Props as BtnProps } from '@client/components/button';
 
 // Core libs
 import { InputWrapper } from '../base';
@@ -67,6 +67,7 @@ export type Props = {
     emptyText?: ComponentChild,
     className?: string,
     previewUrl?: string,
+    button?: boolean | BtnProps,
 
     // Actions
     onChange: (file: FileToUpload | undefined) => void
@@ -85,11 +86,12 @@ export default (props: Props) => {
     let {
         // Input
         value: file,
-        className,
+        className: customClassName,
 
         // Display
         emptyText = 'Click here to select a File',
         previewUrl: previewUrlInit,
+        button,
 
         // Actions
         onChange
@@ -97,7 +99,13 @@ export default (props: Props) => {
 
     const [previewUrl, setPreviewUrl] = React.useState<string | undefined>(previewUrlInit);
 
-    className = 'input upload ' + (className === undefined ? '' : ' ' + className);
+    let className = 'input upload';
+
+    if (!button)
+        className += ' box';
+
+    if (customClassName !== undefined)
+        className += ' ' + customClassName;
 
     /*----------------------------------
     - ACTIONS
@@ -131,33 +139,49 @@ export default (props: Props) => {
 
             <div class={className}>
 
-                {file && <>
-                    <div class="preview">
-
-                        {previewUrl ? (
-                            <img src={previewUrl} />
-                        ) : typeof file === 'string' ? <>
+                {button ? <> 
+
+                    <Button type="secondary" 
+                        {...button === true ? {} : button}
+                    >
+                        {emptyText}
+                    </Button>
+                
+                </> : <>
+
+                    {file && <>
+                        <div class="preview">
+
+                            {previewUrl ? (
+                                <img src={previewUrl} />
+                            ) : typeof file === 'string' ? <>
+                                <strong>A file has been selected</strong>
+                            </> : file ? <>
+                                <strong>{file.name}</strong>
+                            </> : null}
+                        </div>
+
+                        <div class="row actions sp-05">
+
+                            {typeof file === 'string' && <>
+                                <Button type="secondary" icon="eye" shape="pill" size="s" link={file} />
+                            </>}
+                            
+                            <Button class='bg error' icon="trash" shape="pill" size="s"  
+                                async onClick={() => onChange(undefined)} />
+                        </div>
+                    </>}
+
+                    <div class="indication col al-center">
+                        {typeof file === 'string' ? <>
                             <strong>A file has been selected</strong>
                         </> : file ? <>
                             <strong>{file.name}</strong>
-                        </> : null}
-                    </div>
-
-                    <div class="row actions sp-05">
-
-                        {typeof file === 'string' && <>
-                            <Bouton type="secondary" icon="eye" shape="pill" size="s" link={file} />
-                        </>}
-                        
-                        <Bouton class='bg error' icon="trash" shape="pill" size="s"  
-                            async onClick={() => onChange(undefined)} />
+                        </> : emptyText}
                     </div>
+                
                 </>}
 
-                <div class="indication col al-center">
-                    {emptyText}
-                </div>
-
                 <input type="file" onChange={selectFile} />
             </div>
         </InputWrapper>

package/src/common/data/rte/nodes.ts

@@ -36,6 +36,7 @@ import { TweetNode } from '@client/components/inputv3/Rte/nodes/TweetNode';
 import { YouTubeNode } from '@client/components/inputv3/Rte/nodes/YouTubeNode';
 
 import HeadingWithAnchorNode from '@client/components/inputv3/Rte/nodes/HeadingNode';
+import ReferenceLinkNode from '@client/components/inputv3/Rte/nodes/ReferenceLinkNode';
 
 const PlaygroundNodes: Array<Klass<LexicalNode>> = [
     /*HeadingNode, */HeadingWithAnchorNode,
@@ -74,6 +75,9 @@ const PlaygroundNodes: Array<Klass<LexicalNode>> = [
     PageBreakNode,
     LayoutContainerNode,
     LayoutItemNode,
+
+    // Custom
+    ReferenceLinkNode
 ];
 
 export default PlaygroundNodes;

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

@@ -24,7 +24,21 @@ import ServerResponse from '../response';
 - TYPES
 ----------------------------------*/
 
-const localeFilter = (input: any) => typeof input === 'string' && ISO6391.validate(input) ? input : undefined;
+const localeFilter = (input: any) => {
+
+    // Data type
+    if (typeof input !== 'string')
+        return;
+
+    // Extract ISO code
+    let lang = input.trim().split(/[-_]/)[0].toLowerCase();
+    
+    // Check size
+    if (!ISO6391.validate(lang))
+        return;
+
+    return lang.toUpperCase();
+}
 
 export type UploadedFile = With<FileToUpload, 'md5'|'ext'>
 
@@ -132,6 +146,9 @@ export default class ServerRequest<
             'EN'
         )
 
+        console.log("locale", this.req.acceptsLanguages(), locale);
+        
+
         return locale ? locale.toUpperCase() : 'EN'
     }
 

package/src/server/utils/rte.ts

@@ -29,7 +29,7 @@ type LexicalState = {
     root: LexicalNode
 }
 
-type LexicalNode = {
+export type LexicalNode = {
     version: number,
     type: string,
     children?: LexicalNode[],
@@ -42,6 +42,15 @@ type LexicalNode = {
 }
 
 type TRenderOptions = {
+
+    transform?: RteUtils["transformNode"],
+
+    render?: (
+        node: LexicalNode, 
+        parent: LexicalNode | null, 
+        options: TRenderOptions
+    ) => Promise<LexicalNode>,
+
     attachements?: {
         disk: Driver,
         directory: string,
@@ -103,8 +112,8 @@ export class RteUtils {
             }
         }
 
-        const root = await this.processContent(json.root, async (node) => {
-            return await this.transformNode(node, assets, options);
+        const root = await this.processContent(json.root, null, async (node, parent) => {
+            return await this.transformNode(node, parent, assets, options);
         });
 
         json = { ...json, root };
@@ -113,29 +122,30 @@ export class RteUtils {
         const attachementOptions = options?.attachements;
         if (attachementOptions && attachementOptions.prevVersion !== undefined) {
 
-            await this.processContent(root, async (node) => {
+            await this.processContent(root, null, async (node) => {
                 return await this.deleteUnusedFile(node, assets, attachementOptions);
             });
         }
 
         // Convert json to HTML
-        const html = await this.jsonToHtml( json );
+        const html = await this.jsonToHtml( json, options );
 
         return { html, json: content, ...assets };
     }
 
     private async processContent( 
         node: LexicalNode, 
-        callback: (node: LexicalNode) => Promise<LexicalNode>
+        parent: LexicalNode | null,
+        callback: (node: LexicalNode, parent: LexicalNode | null) => Promise<LexicalNode>
     ) {
 
-        node = await callback(node);
+        node = await callback(node, parent);
 
         // Recursion
         if (node.children) {
             for (let i = 0; i < node.children.length; i++) {
 
-                node.children[ i ] = await this.processContent( node.children[ i ], callback );
+                node.children[ i ] = await this.processContent( node.children[ i ], node, callback );
 
             }
         }
@@ -143,23 +153,34 @@ export class RteUtils {
         return node;
     }
 
-    private async transformNode(node: LexicalNode, assets: TContentAssets, options: TRenderOptions) {
+    private async transformNode(
+        node: LexicalNode, 
+        parent: LexicalNode | null, 
+        assets: TContentAssets, 
+        options: TRenderOptions
+    ): Promise<LexicalNode> {
 
-        // Attachment: Upload attachments and replace blobs by URLs
+        // Images and files
         if (node.type === 'image' || node.type === 'file') {
 
+            // Upload images and files and replace blobs by URLs
             await this.processAttachement(
                 node as With<LexicalNode, 'src'>,
                 assets,
                 options,
             );
 
+        // Headings
         } else if (node.type === 'anchored-heading') {
 
+            // Create skeleton
             await this.processHeading(node, assets);
 
         }
 
+        if (options.transform)
+            node = await options.transform(node, parent, assets, options);
+
         return node;
     }
 
@@ -261,7 +282,17 @@ export class RteUtils {
         return node;
     }
 
-    public async jsonToHtml( json: LexicalState ) {
+    public async jsonToHtml( json: LexicalState, options: TRenderOptions = {} ) {
+
+        // Transform before rendering
+        const renderTransform = options.render;
+        if (renderTransform)
+            json = {
+                ...json,
+                root: await this.processContent(json.root, null, async (node, parent) => {
+                    return await renderTransform(node, parent, options);
+                })
+            }
 
         // Server side: simulate DOM environment
         const dom = new JSDOM(`<!DOCTYPE html><body></body>`);

package/src/server/utils/slug.ts

@@ -37,31 +37,43 @@ export class Slug {
 
         // Check if already existing
         if (SQL !== undefined) {
-
-            const escapedSlug = escapeStringRegexp(slug);
-
-            const duplicates = await SQL.selectVal<number>(`
-                SELECT 
-                    IF( ${column} LIKE ${SQL.esc(slug)},
-                        1,
-                        CAST(SUBSTRING_INDEX(slug, '-', -1) AS UNSIGNED)
-                    ) AS duplicates
-                FROM ${table} 
-                WHERE 
-                    ${column} LIKE ${SQL.esc(slug)}
-                    OR
-                    ${column} REGEXP '^${escapedSlug}-[0-9]+$'
-                ORDER BY duplicates DESC
-                LIMIT 1
-            `);
-
-            if (duplicates && duplicates > 0)
-                slug += `-${duplicates + 1}`;
+            slug = await this.Correct(slug, SQL, table, column);
         }
 
         return slug;
     }
 
+    public async Correct( 
+        slug: string, 
+        SQL: SQL, 
+        table: string, 
+        column: string 
+    ) {
+        
+        const escapedSlug = escapeStringRegexp(slug);
+
+        const duplicates = await SQL.selectVal<number>(`
+            SELECT 
+                IF( ${column} LIKE ${SQL.esc(slug)},
+                    1,
+                    CAST(SUBSTRING_INDEX(slug, '-', -1) AS UNSIGNED)
+                ) AS duplicates
+            FROM ${table} 
+            WHERE 
+                ${column} LIKE ${SQL.esc(slug)}
+                OR
+                ${column} REGEXP '^${escapedSlug}-[0-9]+$'
+            ORDER BY duplicates DESC
+            LIMIT 1
+        `);
+
+        if (duplicates && duplicates > 0)
+            slug += `-${duplicates + 1}`;
+
+        return slug;
+
+    }
+
 }
 
 export default new Slug;