From 6e1a46c04a70bb5ded7610fb3f9c4abd76dda526 Mon Sep 17 00:00:00 2001 From: CristianSpatari Date: Mon, 21 Aug 2023 08:44:20 +0300 Subject: [PATCH] feat(config) add wp --- public/editor-client/src/config.ts | 32 ++++++++++++++++++ .../editor-client/src/savedBlocks/common.ts | 19 +++++++++++ .../src/savedBlocks/savedBlocks.ts | 4 +-- .../src/savedBlocks/savedLayouts.ts | 4 +-- .../src/savedBlocks/savedPopups.ts | 4 +-- public/editor-client/src/screenshots/index.ts | 28 ++++++++++++++++ public/editor-client/src/screenshots/utils.ts | 33 +++++++++++++++++++ public/editor-client/src/types/Screenshots.ts | 25 ++++++++++++++ .../src/utils/url/urlContainerQueryString.ts | 2 ++ 9 files changed, 142 insertions(+), 9 deletions(-) create mode 100644 public/editor-client/src/savedBlocks/common.ts create mode 100644 public/editor-client/src/screenshots/index.ts create mode 100644 public/editor-client/src/screenshots/utils.ts create mode 100644 public/editor-client/src/types/Screenshots.ts create mode 100644 public/editor-client/src/utils/url/urlContainerQueryString.ts diff --git a/public/editor-client/src/config.ts b/public/editor-client/src/config.ts index b1ccf7df72..a520f1796c 100644 --- a/public/editor-client/src/config.ts +++ b/public/editor-client/src/config.ts @@ -14,6 +14,12 @@ interface DefaultTemplates { layoutsUrl: string; } +interface ScreenshotUrl { + globalScreenshotUrl: string; + layoutScreenshotUrl: string; + normalScreenshotUrl: string; + savedScreenshotUrl: string; +} interface Actions { getMediaUid: string; getAttachmentUid: string; @@ -37,6 +43,7 @@ interface API { mediaResizeUrl: string; customFileUrl: string; templates: DefaultTemplates; + screenshots: ScreenshotUrl; } export interface Config { hash: string; @@ -48,6 +55,27 @@ export interface Config { l10n?: Record; } +const screenshotUrlReader = parseStrict, ScreenshotUrl>( + { + globalScreenshotUrl: pipe( + mPipe(Obj.readKey("globalScreenshotUrl"), Str.read), + throwOnNullish("Invalid API Config: globalScreenshotUrl") + ), + layoutScreenshotUrl: pipe( + mPipe(Obj.readKey("layoutScreenshotUrl"), Str.read), + throwOnNullish("Invalid API Config: layoutScreenshotUrl") + ), + normalScreenshotUrl: pipe( + mPipe(Obj.readKey("normalScreenshotUrl"), Str.read), + throwOnNullish("Invalid API Config: normalScreenshotUrl") + ), + savedScreenshotUrl: pipe( + mPipe(Obj.readKey("savedScreenshotUrl"), Str.read), + throwOnNullish("Invalid API Config: savedScreenshotUrl") + ) + } +); + const templatesReader = parseStrict, DefaultTemplates>({ kitsUrl: pipe( mPipe(Obj.readKey("kitsUrl"), Str.read), @@ -89,6 +117,10 @@ const apiReader = parseStrict({ templates: pipe( mPipe(Obj.readKey("templates"), Obj.read, templatesReader), throwOnNullish("Invalid API: templates") + ), + screenshots: pipe( + mPipe(Obj.readKey("screenshots"), Obj.read, screenshotUrlReader), + throwOnNullish("Invalid API: screenshots") ) }); diff --git a/public/editor-client/src/savedBlocks/common.ts b/public/editor-client/src/savedBlocks/common.ts new file mode 100644 index 0000000000..fb16786f25 --- /dev/null +++ b/public/editor-client/src/savedBlocks/common.ts @@ -0,0 +1,19 @@ +import { SavedLayoutMeta } from "../types/SavedBlocks"; +// Limitation API for getBlocks +export const TOTAL_COUNT = 200; +export const normalBlocks = ( + data: SavedLayoutMeta[], + screenshotUrl: string +) => { + return data + .filter((item) => item.meta.type === "normal") + .map((item) => { + return { + ...item, + meta: { + ...item.meta, + _thumbnailSrc: `${screenshotUrl}/${item.meta._thumbnailSrc}` + } + }; + }); +}; diff --git a/public/editor-client/src/savedBlocks/savedBlocks.ts b/public/editor-client/src/savedBlocks/savedBlocks.ts index dd58a7e7ef..1fe565c2f6 100644 --- a/public/editor-client/src/savedBlocks/savedBlocks.ts +++ b/public/editor-client/src/savedBlocks/savedBlocks.ts @@ -9,9 +9,7 @@ import { import { SavedBlockMeta, SavedBlocks } from "../types/SavedBlocks"; import { createUpload } from "../utils/createUpload"; import { t } from "../utils/i18n"; - -// Limitation API for getBlocks -const TOTAL_COUNT = 200; +import { TOTAL_COUNT } from "./common"; export const savedBlocks: SavedBlocks = { async get(res, rej) { diff --git a/public/editor-client/src/savedBlocks/savedLayouts.ts b/public/editor-client/src/savedBlocks/savedLayouts.ts index 66630c75c6..a949e1edc6 100644 --- a/public/editor-client/src/savedBlocks/savedLayouts.ts +++ b/public/editor-client/src/savedBlocks/savedLayouts.ts @@ -9,9 +9,7 @@ import { import { SavedLayoutMeta, SavedLayouts } from "../types/SavedBlocks"; import { createUpload } from "../utils/createUpload"; import { t } from "../utils/i18n"; - -// Limitation API for getBlocks -const TOTAL_COUNT = 200; +import { TOTAL_COUNT } from "./common"; export const savedLayouts: SavedLayouts = { async get(res, rej) { diff --git a/public/editor-client/src/savedBlocks/savedPopups.ts b/public/editor-client/src/savedBlocks/savedPopups.ts index 41655dc443..c27fa9f5b4 100644 --- a/public/editor-client/src/savedBlocks/savedPopups.ts +++ b/public/editor-client/src/savedBlocks/savedPopups.ts @@ -9,9 +9,7 @@ import { import { SavedBlockMeta, SavedPopups } from "../types/SavedBlocks"; import { createUpload } from "../utils/createUpload"; import { t } from "../utils/i18n"; - -// Limitation API for getBlocks -const TOTAL_COUNT = 200; +import { TOTAL_COUNT } from "./common"; export const savedPopups: SavedPopups = { async get(res, rej) { diff --git a/public/editor-client/src/screenshots/index.ts b/public/editor-client/src/screenshots/index.ts new file mode 100644 index 0000000000..ce301c51c6 --- /dev/null +++ b/public/editor-client/src/screenshots/index.ts @@ -0,0 +1,28 @@ +import { createBlockScreenshot, updateBlockScreenshot } from "../api"; +import { Screenshots } from "../types/Screenshots"; +import { t } from "../utils/i18n"; +import { getScreenshotUrl } from "./utils"; + +export const screenshots = (): Screenshots => { + return { + getScreenshotUrl, + async create(res, rej, data) { + try { + const r = await createBlockScreenshot(data); + res(r); + } catch (e) { + console.error("API Client Create Screenshots:", e); + rej(t("Failed to create screenshot")); + } + }, + async update(res, rej, data) { + try { + const r = await updateBlockScreenshot(data); + res(r); + } catch (e) { + console.error("API Client Update Screenshots:", e); + rej(t("Failed to update screenshot")); + } + } + }; +}; diff --git a/public/editor-client/src/screenshots/utils.ts b/public/editor-client/src/screenshots/utils.ts new file mode 100644 index 0000000000..5aba28037b --- /dev/null +++ b/public/editor-client/src/screenshots/utils.ts @@ -0,0 +1,33 @@ +import { Config, getConfig } from "../config"; +import { ScreenshotType } from "../types/Screenshots"; +import { MValue } from "../utils/types"; +import { urlContainsQueryString } from "../utils/url/urlContainerQueryString"; +export const getScreenshotUrl = ({ + _thumbnailSrc, + type +}: ScreenshotType): string => { + const config = getConfig(); + const siteUrl = determineScreenshotUrl(type, config); + + return urlContainsQueryString(siteUrl) + ? `${siteUrl}&${_thumbnailSrc}` + : `${siteUrl}?${_thumbnailSrc}`; +}; + +const determineScreenshotUrl = ( + type: string, + config: MValue +): string => { + switch (type) { + case "normal": + return config?.api.screenshots.normalScreenshotUrl ?? ""; + case "global": + return config?.api.screenshots.globalScreenshotUrl ?? ""; + case "saved": + return config?.api.screenshots.savedScreenshotUrl ?? ""; + case "layout": + return config?.api.screenshots.layoutScreenshotUrl ?? ""; + default: + return ""; + } +}; diff --git a/public/editor-client/src/types/Screenshots.ts b/public/editor-client/src/types/Screenshots.ts new file mode 100644 index 0000000000..16b6e65923 --- /dev/null +++ b/public/editor-client/src/types/Screenshots.ts @@ -0,0 +1,25 @@ +import { Response } from "./Response"; + +export interface ScreenshotData { + base64: string; + blockType: "normal" | "global" | "saved" | "layout"; +} + +export type ScreenshotType = { + _thumbnailSrc: string; + type: string; +}; + +export interface Screenshots { + getScreenshotUrl?: ({ _thumbnailSrc, type }: ScreenshotType) => string; + create?: ( + res: Response<{ id: string }>, + rej: Response, + extra: ScreenshotData + ) => void; + update?: ( + res: Response<{ id: string }>, + rej: Response, + extra: ScreenshotData & { id: string } + ) => void; +} diff --git a/public/editor-client/src/utils/url/urlContainerQueryString.ts b/public/editor-client/src/utils/url/urlContainerQueryString.ts new file mode 100644 index 0000000000..d37a9db548 --- /dev/null +++ b/public/editor-client/src/utils/url/urlContainerQueryString.ts @@ -0,0 +1,2 @@ +export const urlContainsQueryString = (url: string): boolean => + url.includes("?");