From 481b98784d3360879d6775f6f6d661f8b548cb10 Mon Sep 17 00:00:00 2001 From: Rizky Date: Tue, 7 Nov 2023 18:35:22 +0700 Subject: [PATCH] wip mobile cap --- app/srv/ws/sync/editor/prep-code.ts | 7 +- app/web/src/index.tsx | 9 ++- .../editor/panel/script/monaco/types/base.ts | 75 ------------------- .../editor/panel/script/monaco/typings.ts | 2 +- app/web/src/render/live/logic/init.tsx | 13 ++-- app/web/src/render/live/logic/mobile.ts | 49 ++++++++++++ app/web/src/utils/script/types/base.ts | 17 +++++ 7 files changed, 88 insertions(+), 84 deletions(-) delete mode 100644 app/web/src/render/editor/panel/script/monaco/types/base.ts create mode 100644 app/web/src/render/live/logic/mobile.ts diff --git a/app/srv/ws/sync/editor/prep-code.ts b/app/srv/ws/sync/editor/prep-code.ts index 15330027..0074734d 100644 --- a/app/srv/ws/sync/editor/prep-code.ts +++ b/app/srv/ws/sync/editor/prep-code.ts @@ -1 +1,6 @@ -export const prepCode = async (site_id: string, name: string) => {}; +export const prepCode = async (site_id: string, name: string) => { + // cek folder code + // pastikan struktur folder code + // create jika ga ada + // nyalain bun file watcher +}; diff --git a/app/web/src/index.tsx b/app/web/src/index.tsx index 3904369b..b269cb87 100644 --- a/app/web/src/index.tsx +++ b/app/web/src/index.tsx @@ -5,6 +5,7 @@ import "./index.css"; import { createAPI, createDB, reloadDBAPI } from "./utils/script/init-api"; import { w } from "./utils/types/general"; import * as Y from "yjs"; +import { registerMobile } from "./render/live/logic/mobile"; (window as any).Y = Y; @@ -13,7 +14,13 @@ const start = async () => { let react = { root: null as null | ReactRoot, }; - if (!["localhost", "127.0.0.1"].includes(location.hostname)) { + (window as any).mobile = registerMobile(); + + if ( + !["localhost", "127.0.0.1", "trycloudflare.com", "ngrok"].find((e) => + location.hostname.includes(e) + ) + ) { const sw = await registerServiceWorker(); const cacheCurrentPage = () => { diff --git a/app/web/src/render/editor/panel/script/monaco/types/base.ts b/app/web/src/render/editor/panel/script/monaco/types/base.ts deleted file mode 100644 index 4c6595e1..00000000 --- a/app/web/src/render/editor/panel/script/monaco/types/base.ts +++ /dev/null @@ -1,75 +0,0 @@ -export const baseTypings = ` -type FC = React.FC; -const Fragment = React.Fragment; -const ReactNode = React.ReactNode; -const useCallback = React.useCallback; -const useMemo = React.useMemo; -const ReactElement = React.ReactElement; -const isValidElement = React.isValidElement; -const useEffect = React.useEffect; -const useState = React.useState; - -const pathname: string; -const isEditor: boolean; -const isLayout: boolean; -const isMobile: boolean; -const isDesktop: boolean; -const preload: (pathname: string) => void; -const apiHeaders: Record; -const navigate: (url:string) => void; -const params: any; -const cx = (...classNames: any[]) => string; -const css = ( - tag: CSSAttribute | TemplateStringsArray | string, - ...props: Array -) => string; - -const props: { - className: string; - onPointerDown?: () => void; - onPointerMove?: () => void; - onPointerLeave?: () => void; -}; -const children: ReactNode; - -const PassProp: FC & {children: React.ReactNode; }>; -const PassChild: FC<{name: string}>; -const Preload: FC<{url: string[]}>; -const apiurl: string; -const pageid: string; -type ITEM = { - id: string - name: string; - type: 'item' | 'text'; - adv?: { - js?: string; - jsBuilt?: string; - css?: string; - html?: string; - }, - text: string, - html: string, - component?: { id:string, props: Record}, - childs: ITEM[] -} -const newElement: (gen?: (item: ITEM) => ITEM | ITEM[]) => React.ReactNode; -const Local: >(arg: { - name: string; - value: T; - idx?: any; - children: ((local: T & { render: () => void }) => any); - deps?: any[]; - effect?: ( - local: T & { render: () => void } - ) => void | (() => void) | Promise void)>; - hook?: ( - local: T & { render: () => void } - ) => void | (() => void) | Promise void)>; - cache?: boolean; -}) => ReactNode; - -`; diff --git a/app/web/src/render/editor/panel/script/monaco/typings.ts b/app/web/src/render/editor/panel/script/monaco/typings.ts index 7b5faaf3..44f7d505 100644 --- a/app/web/src/render/editor/panel/script/monaco/typings.ts +++ b/app/web/src/render/editor/panel/script/monaco/typings.ts @@ -1,8 +1,8 @@ import type { OnMount } from "@monaco-editor/react"; import { w } from "../../../../../utils/types/general"; import { PG } from "../../../logic/global"; -import { baseTypings } from "./types/base"; import { extractProp } from "./types/prop"; +import { baseTypings } from "../../../../../utils/script/types/base"; export type MonacoEditor = Parameters[0]; type Monaco = Parameters[1]; diff --git a/app/web/src/render/live/logic/init.tsx b/app/web/src/render/live/logic/init.tsx index 18f17f08..1dbe0dc8 100644 --- a/app/web/src/render/live/logic/init.tsx +++ b/app/web/src/render/live/logic/init.tsx @@ -1,14 +1,11 @@ import { createRouter } from "radix3"; import { validate } from "uuid"; import { type apiClient } from "web-utils"; -import { - createAPI, - createDB, - initApi -} from "../../../utils/script/init-api"; +import { createAPI, createDB, initApi } from "../../../utils/script/init-api"; import importModule from "../../editor/tools/dynamic-import"; import { LSite, PG } from "./global"; import { validateLayout } from "./layout"; +import { registerMobile } from "./mobile"; export const w = window as unknown as { basepath: string; @@ -23,7 +20,7 @@ export const w = window as unknown as { apiClient: typeof apiClient; apiurl: string; preload: (path: string) => void; - + mobile?: ReturnType; externalAPI: { mode: "dev" | "prod"; devUrl: string; @@ -35,6 +32,10 @@ export const initLive = async (p: PG, domain_or_siteid: string) => { if (p.status === "init") { p.status = "loading"; + if (w.mobile && w.mobile.send) { + w.mobile.send({ type: "ready" }); + } + w.isEditor = false; w.isLayout = true; w.apiHeaders = {}; diff --git a/app/web/src/render/live/logic/mobile.ts b/app/web/src/render/live/logic/mobile.ts new file mode 100644 index 00000000..3a604660 --- /dev/null +++ b/app/web/src/render/live/logic/mobile.ts @@ -0,0 +1,49 @@ +type NOTIF_ARG = { + user_id: string; + body: string; + title: string; + data?: any; +}; +export const registerMobile = () => { + const default_mobile = { + notif: { + register: (user_id: string) => {}, + send: (data: NOTIF_ARG) => {}, + onTap: (data: NOTIF_ARG) => {}, + }, + }; + if (window.parent) { + let config = { notif_token: "" }; + window.addEventListener("message", ({ data: raw }) => { + if (typeof raw === "object" && raw.mobile) { + const data = raw as unknown as { + type: "notification-token"; + token: string; + }; + + console.log("mobile receive", data); + + switch (data.type) { + case "notification-token": + config.notif_token = data.token; + break; + } + } + }); + + return { + send: (msg: { type: "ready" }) => { + window.parent.postMessage({ mobile: true, ...msg }, "*"); + }, + config, + notif: { + register: (user_id: string) => {}, + send: (data: NOTIF_ARG) => {}, + onTap: (data: NOTIF_ARG) => {}, + }, + }; + } + return { + ...default_mobile, + }; +}; diff --git a/app/web/src/utils/script/types/base.ts b/app/web/src/utils/script/types/base.ts index a981ad7e..5ae694f2 100644 --- a/app/web/src/utils/script/types/base.ts +++ b/app/web/src/utils/script/types/base.ts @@ -57,6 +57,23 @@ type ITEM = { childs: ITEM[] } const newElement: (gen?: (item: ITEM) => ITEM | ITEM[]) => React.ReactNode; +const mobile: { + notif: { + register: (user_id: string) => void; + send: (data: { + user_id: string, + title: string, + body: string, + data: any + }) => void; + onTap: (data: { + user_id: string, + title: string, + body: string, + data: any + }) => void | Promise + } +}; const Local: >(arg: { name: string; idx?: any;