jinrai 1.1.3 → 1.1.4

package/front.config.json

@@ -19,6 +19,7 @@
         "index.ts",
         "src/front/url/adapter/rrd6.tsx",
         "src/front/url/adapter/rrd7.tsx",
-        "src/front/url/adapter/def.tsx"
+        "src/front/url/adapter/def.tsx",
+        "src/front/translate/TranslateConfig.tsx"
     ]
 }

package/index.ts

@@ -1,10 +1,11 @@
 export type { ServerKey } from "./src/front/server-state/useServerState"
 
 export { useServerState } from "./src/front/server-state/useServerState"
-export { real } from "./src/front/server-state/real"
+export { orig, original } from "./src/front/server-state/orig"
 export { useParamsIndex } from "./src/front/url/params/useParamsIndex"
 export { useSearchValue, useSearchArray } from "./src/front/url/search/useSearchValue"
 export { useSearch } from "./src/front/url/search/useSearch"
 export { Custom } from "./src/front/wrapper/Custom"
 
 export { stringifyInput } from "./src/front/server-state/SSR"
+export {useIsServer} from "./src/front/server/useIsServer"

package/lib/bin/bin.js

@@ -33,11 +33,14 @@ class Parser {
     options;
     openVar = "{{";
     createVar = "}}";
+    openTVar = "{!";
+    createTVar = "!}";
     createArray = "</loopwrapper";
     createCustom = "</custom";
     deepUp = "<loopwrapper";
     deepUp2 = "<custom";
     templates = {};
+    custom = [];
     constructor(options) {
         this.options = options;
     }
@@ -50,43 +53,62 @@ class Parser {
         let match;
         let deep = 0;
         let lastIndex = 0;
-        const tagPattern = new RegExp(`(<loopwrapper(\\s+[^>]*)?>|</loopwrapper>|\{\{|\}\}|<custom(\\s+[^>]*)?>|</custom>)`, "gi");
+        let translate = false;
+        const tagPattern = new RegExp(`(<loopwrapper(\\s+[^>]*)?>|</loopwrapper>|\{\{|\}\}|\{\!|\!\}|<custom(\\s+[^>]*)?>|</custom>)`, "gi");
         while ((match = tagPattern.exec(content)) !== null) {
             const currentTag = match[0];
             const value = content.substring(lastIndex, match.index);
-            if (currentTag.startsWith(this.createArray)) {
-                deep--;
-                if (deep > 0)
+            if (translate) {
+                if (currentTag.startsWith(this.createTVar)) {
+                    translate = false;
+                    this.createTranslate(tree, value);
+                }
+                else {
                     continue;
-                this.createElement(tree, value);
-            }
-            else if (currentTag.startsWith(this.deepUp)) {
-                deep++;
-                if (deep > 1)
-                    continue;
-                this.createElement(tree, value);
-            }
-            else if (currentTag.startsWith(this.createCustom)) {
-                deep--;
-                if (deep != 0)
-                    continue;
-                this.createCustomElement(tree, value);
-            }
-            else if (currentTag.startsWith(this.deepUp2)) {
-                deep++;
-                if (deep > 1)
-                    continue;
-                this.createElement(tree, value);
-            }
-            else if (currentTag == this.createVar) {
-                if (deep != 0)
-                    continue;
-                this.createElement(tree, value, true);
+                }
             }
             else {
-                if (deep != 0)
-                    continue;
-                this.createElement(tree, value);
+                if (currentTag.startsWith(this.createArray)) {
+                    deep--;
+                    if (deep > 0)
+                        continue;
+                    this.createElement(tree, value);
+                }
+                else if (currentTag.startsWith(this.deepUp)) {
+                    deep++;
+                    if (deep > 1)
+                        continue;
+                    this.createElement(tree, value);
+                }
+                else if (currentTag.startsWith(this.createCustom)) {
+                    deep--;
+                    if (deep != 0)
+                        continue;
+                    this.createCustomElement(tree, value);
+                }
+                else if (currentTag.startsWith(this.deepUp2)) {
+                    deep++;
+                    if (deep > 1)
+                        continue;
+                    this.createElement(tree, value);
+                }
+                else if (currentTag.startsWith(this.openTVar)) {
+                    ////////////// >>>>
+                    if (deep != 0)
+                        continue;
+                    translate = true;
+                    this.createElement(tree, value);
+                }
+                else if (currentTag == this.createVar) {
+                    if (deep != 0)
+                        continue;
+                    this.createElement(tree, value, true);
+                }
+                else {
+                    if (deep != 0)
+                        continue;
+                    this.createElement(tree, value);
+                }
             }
             lastIndex = match.index + currentTag.length;
         }
@@ -98,18 +120,41 @@ class Parser {
     createCustomElement(parent, value) {
         const [customProps, exampleProps, children] = value.split(SPLIT);
         const custom = JSON.parse(customProps);
+        if (this.custom.find(itm => itm.name == custom.name) == undefined) {
+            this.custom.push({
+                name: custom.name,
+                html: children,
+                props: exampleProps,
+            });
+        }
         parent.push({
             type: "custom",
             name: custom.name,
             props: custom.props,
         });
     }
-    createElement(parent, value, isVarible) {
-        if (isVarible)
+    createVarible(parent, value) {
+        return parent.push({
+            type: "value",
+            key: value,
+        });
+    }
+    createTranslate(parent, value) {
+        if (value.startsWith("{{") && value.endsWith("}}")) {
             return parent.push({
-                type: "value",
-                key: value,
+                type: "tvalue",
+                value: value.slice(2, -2),
             });
+        }
+        return parent.push({
+            type: "t",
+            text: value,
+        });
+    }
+    createElement(parent, value, isVarible) {
+        if (isVarible) {
+            return this.createVarible(parent, value);
+        }
         if (value.trimStart().startsWith("ArrayDataKey=")) {
             const [key, ...val] = value.trimStart().substring(13).split("|");
             value = val.join("|");
@@ -140,7 +185,10 @@ const getRoutesAndTemplates = (pages, normalize = true, templates = true) => {
     const parser = new Parser({ normalize, templates });
     for (const [id, template] of pages.entries()) {
         const content = parser.parse(template.root);
-        const mask = template.mask.replaceAll("/", "\\/").replace(/{(.*?)}/, ".+?");
+        const mask = template.mask
+            .replaceAll("/", "\\/")
+            .replace(/{(.*?)}/, ".+?")
+            .replace("\/*", "\/?.*");
         routes.push({
             id,
             content,
@@ -151,6 +199,7 @@ const getRoutesAndTemplates = (pages, normalize = true, templates = true) => {
     return {
         routes,
         templates: parser.templates,
+        customComponents: parser.custom,
     };
 };
 
@@ -194,12 +243,13 @@ class Task {
 }
 
 const pageCollector = async (page) => {
-    const state = await page.evaluate(() => {
+    const [state, lang] = await page.evaluate(() => {
         const state = Object.fromEntries(window.$exportServerStates);
-        return state;
+        const lang = window.$langDefaultConfig;
+        return [state, lang];
     });
     const root = await page.locator("#root").innerHTML();
-    return { root, state };
+    return { root, state, lang };
 };
 
 const JinraiAgent = "____JINRAI_AGENT____";
@@ -208,6 +258,7 @@ const getRawPageData = async (url, pages, test = false, debug = false) => {
     const task = new Task();
     task.next("Router analysis", "yellow", spinners.dotsCircle);
     const result = [];
+    let defaultLang = undefined;
     const browser = await chromium.launch({ headless: !debug, devtools: true, channel: "chrome" });
     // const test_browser = await chromium.launch({ headless: true, channel: "chrome" })
     const context = await browser.newContext({
@@ -217,11 +268,14 @@ const getRawPageData = async (url, pages, test = false, debug = false) => {
     for await (const [id, mask] of pages.entries()) {
         task.next(mask, "yellow", spinners.dotsCircle, 1);
         const page = await context.newPage();
-        const path = mask.replaceAll("{", "").replaceAll("}", "");
+        const path = mask.replaceAll("{", "").replaceAll("}", "").replace("\/*", "");
         await page.goto(url + path);
         await page.waitForLoadState("networkidle");
         await page.waitForTimeout(1000);
-        const { state, root } = await pageCollector(page);
+        const { state, root, lang } = await pageCollector(page);
+        if (defaultLang == undefined) {
+            defaultLang = lang;
+        }
         // if (debug) console.log({ input })
         let testRoot = undefined;
         // if (test) {
@@ -246,7 +300,7 @@ const getRawPageData = async (url, pages, test = false, debug = false) => {
     await browser.close();
     // await test_browser.close()
     task.success();
-    return result;
+    return { pages: result, lang: defaultLang };
 };
 
 const vitePreview = async () => {
@@ -267,15 +321,16 @@ const runBuild = async (options) => {
     const config = await getUserConfig(configName);
     task.success();
     const [serverUrl, close] = await vitePreview();
-    const pages = await getRawPageData(serverUrl, config.pages, config.test, options.debug);
+    const { pages, lang } = await getRawPageData(serverUrl, config.pages, config.test, options.debug);
+    console.log({ lang });
     close();
     const outputcashe = path.join(config.dist ?? "dist", ".cached");
     task.do("Format");
-    const { routes, templates } = getRoutesAndTemplates(pages);
+    const { routes, templates, customComponents } = getRoutesAndTemplates(pages);
     task.next(`Export: (${templates.length})`);
     await mkdir(outputcashe, { recursive: true });
     console.log("dev");
-    const exportConfig = { routes, proxy: config.proxy, meta: config.meta };
+    const exportConfig = { routes, proxy: config.proxy, meta: config.meta, lang };
     await writeFile(path.join(outputcashe, "config.json"), JSON.stringify(exportConfig, null, 2));
     // await writeFile(
     //     path.join(outputcashe, "index.html"),
@@ -284,15 +339,23 @@ const runBuild = async (options) => {
     for await (const [template, name] of Object.entries(templates)) {
         await writeFile(path.join(outputcashe, `${name}.html`), template);
     }
-    if (config.test) {
-        task.next(`Tests`);
-        for await (const page of pages) {
-            if (!page.test) {
-                continue;
-            }
-            await writeFile(path.join(outputcashe, `test_${page.id}.html`), normalizeHtmlWhitespace(page.test));
+    if (customComponents.length) {
+        task.next(`Custom`);
+        await mkdir(path.join(outputcashe, "custom"), { recursive: true });
+        for await (const component of customComponents) {
+            await writeFile(path.join(outputcashe, "custom", `${component.name}.html`), component.html);
+            await writeFile(path.join(outputcashe, "custom", `${component.name}.json`), component.props);
         }
     }
+    // if (config.test) {
+    //     task.next(`Tests`)
+    //     for await (const page of pages) {
+    //         if (!page.test) {
+    //             continue
+    //         }
+    //         await writeFile(path.join(outputcashe, `test_${page.id}.html`), normalizeHtmlWhitespace(page.test))
+    //     }
+    // }
     task.success();
 };
 

package/lib/index.d.ts

@@ -1,8 +1,9 @@
 export type { ServerKey } from "./src/front/server-state/useServerState";
 export { useServerState } from "./src/front/server-state/useServerState";
-export { real } from "./src/front/server-state/real";
+export { orig, original } from "./src/front/server-state/orig";
 export { useParamsIndex } from "./src/front/url/params/useParamsIndex";
 export { useSearchValue, useSearchArray } from "./src/front/url/search/useSearchValue";
 export { useSearch } from "./src/front/url/search/useSearch";
 export { Custom } from "./src/front/wrapper/Custom";
 export { stringifyInput } from "./src/front/server-state/SSR";
+export { useIsServer } from "./src/front/server/useIsServer";

package/lib/index.js

@@ -1,7 +1,8 @@
 export { useServerState } from './src/front/server-state/useServerState.js';
-export { real } from './src/front/server-state/real.js';
+export { orig, original } from './src/front/server-state/orig.js';
 export { useParamsIndex } from './src/front/url/params/useParamsIndex.js';
 export { useSearchArray, useSearchValue } from './src/front/url/search/useSearchValue.js';
 export { useSearch } from './src/front/url/search/useSearch.js';
 export { Custom } from './src/front/wrapper/Custom.js';
 export { stringifyInput } from './src/front/server-state/SSR.js';
+export { useIsServer } from './src/front/server/useIsServer.js';

package/lib/src/bin/agent/agent.d.ts

@@ -1 +1,2 @@
 export declare const JinraiAgent = "____JINRAI_AGENT____";
+export declare const ViteAgent = "____JINRAI_VITE_AGENT____";

package/lib/src/bin/agent/agent.js

@@ -1,3 +1,4 @@
 const JinraiAgent = "____JINRAI_AGENT____";
+const ViteAgent = "____JINRAI_VITE_AGENT____";
 
-export { JinraiAgent };
+export { JinraiAgent, ViteAgent };

package/lib/src/bin/playwright/pageCollector.d.ts

@@ -1,6 +1,8 @@
 import { Page } from "playwright";
 import { ServerStateMap } from "../../front/server-state/useServerState";
+import { DefaultLangType } from "../../front/translate/TranslateConfig";
 export declare const pageCollector: (page: Page) => Promise<{
     state: ServerStateMap;
     root: string;
+    lang: DefaultLangType;
 }>;

package/lib/src/bin/playwright/pageTestCollector.d.ts

@@ -0,0 +1,6 @@
+import { Page } from "playwright";
+import { ServerStateMap } from "../../front/server-state/useServerState";
+export declare const pageTestCollector: (page: Page) => Promise<{
+    state: ServerStateMap;
+    root: string;
+}>;

package/lib/src/bin/playwright/templates.d.ts

@@ -1,4 +1,5 @@
 import { ServerValue } from "../../front/server-state/serverStates";
+import { DefaultLangType } from "../../front/translate/TranslateConfig";
 export interface PageData {
     id: number;
     mask: string;
@@ -6,4 +7,8 @@ export interface PageData {
     state: Record<string, ServerValue>;
     test?: string;
 }
-export declare const getRawPageData: (url: string, pages: string[], test?: boolean, debug?: boolean) => Promise<PageData[]>;
+export interface Pages {
+    pages: PageData[];
+    lang?: DefaultLangType;
+}
+export declare const getRawPageData: (url: string, pages: string[], test?: boolean, debug?: boolean) => Promise<Pages>;

package/lib/src/bin/routes/Parser.d.ts

@@ -7,7 +7,7 @@ interface ParserOptions {
     templates?: boolean;
     normalize?: boolean;
 }
-export type Element = ArrayElement | HtmlElement | ValueElement | CustomElement;
+export type Element = ArrayElement | HtmlElement | ValueElement | CustomElement | TranslateText | TValueElement;
 interface ArrayElement {
     type: "array";
     key: string;
@@ -21,24 +21,42 @@ interface ValueElement {
     type: "value";
     key: string;
 }
+interface TValueElement {
+    type: "tvalue";
+    value: string;
+}
+interface TranslateText {
+    type: "t";
+    text: string;
+}
 interface CustomElement {
     type: "custom";
     name: string;
     props: object;
 }
+export interface CustomExample {
+    name: string;
+    html: string;
+    props: any;
+}
 export declare class Parser {
     options?: ParserOptions;
     openVar: string;
     createVar: string;
+    openTVar: string;
+    createTVar: string;
     createArray: string;
     createCustom: string;
     deepUp: string;
     deepUp2: string;
     templates: Record<string, string>;
+    custom: CustomExample[];
     constructor(options?: ParserOptions);
     parse(content: string): Element[];
     handle(content: string, tree: Element[]): void;
     createCustomElement(parent: Element[], value: string): void;
+    createVarible(parent: Element[], value: string): number;
+    createTranslate(parent: Element[], value: string): number;
     createElement(parent: Element[], value: string, isVarible?: boolean): number;
     createTemplate(html: string): string;
 }

package/lib/src/bin/routes/getRoutes.d.ts

@@ -10,5 +10,6 @@ interface Route {
 export declare const getRoutesAndTemplates: (pages: PageData[], normalize?: boolean, templates?: boolean) => {
     routes: Route[];
     templates: Record<string, string>;
+    customComponents: import("./Parser").CustomExample[];
 };
 export {};

package/lib/src/front/server/useIsServer.d.ts

@@ -0,0 +1 @@
+export declare const useIsServer: () => boolean;

package/lib/src/front/server/useIsServer.js

@@ -0,0 +1,7 @@
+import { ssr } from '../server-state/SSR.js';
+
+const useIsServer = () => {
+    return ssr.current;
+};
+
+export { useIsServer };

package/lib/src/front/server-state/DataProxy.js

@@ -135,6 +135,9 @@ function createDataProxy(data, path = "") {
             // ---------------------------
             // 8. Nested object
             // ---------------------------
+            if (data === null) {
+                return undefined;
+            }
             const value = data[prop];
             if (!ssr.exportParams) {
                 return value;

package/lib/src/front/server-state/SSR.d.ts

@@ -1,5 +1,6 @@
 export declare const ssr: {
     current: boolean;
+    test: boolean;
     exportParams: boolean;
     exportToJV: boolean;
 };

package/lib/src/front/server-state/SSR.js

@@ -1,7 +1,9 @@
-import { JinraiAgent } from '../../bin/agent/agent.js';
+import { ViteAgent, JinraiAgent } from '../../bin/agent/agent.js';
 
 const ssr = {
     current: navigator.userAgent == JinraiAgent,
+    // current: true,
+    test: navigator.userAgent == ViteAgent,
     exportParams: true,
     exportToJV: false,
 };

package/lib/src/front/server-state/orig.d.ts

@@ -0,0 +1,2 @@
+export declare function orig<T>(value: T): T;
+export declare const original: typeof orig;

package/lib/src/front/server-state/{real.js → orig.js}

@@ -2,7 +2,7 @@ import { ssr } from './SSR.js';
 import { sources } from './DataProxy.js';
 import { getJinraiValue } from '../url/search/useSearchValue.js';
 
-function real(value) {
+function orig(value) {
     if (!ssr.current)
         return value;
     switch (typeof value) {
@@ -25,6 +25,7 @@ function real(value) {
             return value;
     }
 }
+const original = orig;
 const wrapSource = (value, source) => {
     if (typeof value == "string") {
         return value.bindSource(source);
@@ -44,4 +45,4 @@ const getArrayByPath = (path) => {
     return link;
 };
 
-export { real };
+export { orig, original };

package/lib/src/front/server-state/serverStates.d.ts

@@ -14,6 +14,7 @@ export type ServerValue = {
     key: ServerKey;
 };
 export declare const serverStates: Map<string, ServerValue>;
+export declare const getIdent: (key: ServerKey) => string;
 export declare const getServerValue: (key?: ServerKey, def?: ServerValue["value"], options?: ServerValue["options"]) => any[];
 export declare const setServerValue: (key: ServerKey, value: ServerValue["value"], options?: ServerValue["options"]) => any;
 export {};

package/lib/src/front/server-state/serverStates.js

@@ -26,11 +26,15 @@ const getServerValue = (key, def, options) => {
     }
     const ident = getIdent(key);
     serverStates.set(ident, { options, value: !options?.source ? def : undefined, key });
+    console.log("CHECK", ident);
     if (ident in initialState) {
         const result = initialState[ident];
         // delete initialState[ident]
         console.log("HAS", ident, result);
-        return ["data" in result ? result.data : result, true];
+        if (result != null && typeof result == 'object' && "data" in result) {
+            return [result.data, true];
+        }
+        return [result, true];
     }
     return [def, false];
 };
@@ -40,4 +44,4 @@ const setServerValue = (key, value, options) => {
     return createDataProxy(value, `${ident}@`);
 };
 
-export { getServerValue, serverStates, setServerValue };
+export { getIdent, getServerValue, serverStates, setServerValue };

package/lib/src/front/server-state/testState.d.ts

@@ -0,0 +1,3 @@
+import { ServerValue } from "./serverStates";
+import { ServerKey } from "./useServerState";
+export declare const setTestState: (key: ServerKey, value: ServerValue["value"], options?: ServerValue["options"]) => void;

package/lib/src/front/server-state/testState.js

@@ -0,0 +1,14 @@
+import { getIdent } from './serverStates.js';
+import { ssr } from './SSR.js';
+
+const test_states = new Map();
+if (window != undefined && ssr.test) {
+    // @ts-ignore
+    window.$testStates = test_states;
+}
+const setTestState = (key, value, options) => {
+    const ident = getIdent(key);
+    test_states.set(ident, value);
+};
+
+export { setTestState };

package/lib/src/front/server-state/useServerState.js

@@ -1,27 +1,23 @@
-import { useState, useRef } from 'react';
+import { useState } from 'react';
 import { ssr } from './SSR.js';
 import { getServerValue, setServerValue } from './serverStates.js';
+import { setTestState } from './testState.js';
 
 const useServerState = (serverKey, initialValue, options) => {
     const [serverValue, isInitOnServer] = getServerValue(serverKey, initialValue, options);
     const [value, setStateValue] = useState(serverValue);
-    useRef(isInitOnServer);
     const setValue = (value) => {
         setStateValue((prev) => {
             const result = value instanceof Function ? value(prev) : value;
             if (serverKey != undefined && ssr.current) {
                 return setServerValue(serverKey, result, options);
             }
+            if (serverKey != undefined && ssr.test) {
+                setTestState(serverKey, result);
+            }
             return result;
         });
     };
-    // const initOnServer = () => {
-    //     if (isInit.current) {
-    //         isInit.current = false
-    //         return true
-    //     }
-    //     return false
-    // }
     return [value, setValue, isInitOnServer];
 };
 

package/lib/src/front/translate/TranslateConfig.d.ts

@@ -0,0 +1,21 @@
+import { type ReactNode } from "react";
+export type DefaultLangType = {
+    defaultLang: string;
+    langBaseUrl: string;
+    source: TranslateSource;
+};
+interface TranslateContextProps {
+    translate: (text: string, context?: string) => string;
+    changeLang: (lang: string) => void;
+    lang: string;
+}
+export declare const useTranslate: () => TranslateContextProps;
+interface TranslateSource {
+    from: "cookie" | "url";
+    key: string;
+}
+type TranslateConfigProps = DefaultLangType & {
+    children: ReactNode;
+};
+export declare const TranslateConfig: ({ children, defaultLang, langBaseUrl, source }: TranslateConfigProps) => import("react/jsx-runtime").JSX.Element;
+export {};