new api for kits

config.dev.php

@@ -25,6 +25,7 @@ class Brizy_Config {
 
 	const UPGRADE_TO_PRO_URL = "https://www.brizy.io/pricing/?utm_source=wp-menu&utm_campaign=gopro&utm_medium=wp-dash/";
     const EDITOR_TEMPLEATES_URL = "https://e-t-cloud.b-cdn.net/1.3.3-beta2/";
+    const EDITOR_NEW_TEMPLEATES_URL = "https://phplaravel-1109775-4184176.cloudwaysapps.com/";
     const SUPPORT_URL = "https://support.brizy.io";
 	const ABOUT_URL = "https://brizy.io";
     const TERMS_OF_SERVICE_URL = "https://www.brizy.io/terms-and-conditions";
@@ -116,6 +117,10 @@ static public function getEditorTemplatesUrl( $directories ) {
         return apply_filters( 'brizy_editor_config_templates_url', self::EDITOR_TEMPLEATES_URL . $directories );
     }
 
+    static public function getEditorNewTemplatesUrl( $directories ) {
+        return apply_filters( 'brizy_editor_config_templates_url', self::EDITOR_NEW_TEMPLEATES_URL . $directories );
+    }
+
     static public function getTermsOfServiceUrl() {
         return apply_filters( 'brizy_config_terms_of_service_url', self::TERMS_OF_SERVICE_URL );
     }

public/editor-client/src/api/index.ts

@@ -1,4 +1,5 @@
 import { Config, getConfig } from "@/config";
+import { DefaultBlock, Kit, KitItem, Style } from "@/types/DefaultTemplate";
 import { ConfigDCItem } from "@/types/DynamicContent";
 import { GlobalBlock } from "@/types/GlobalBlocks";
 import { IconUploadData } from "@/types/Icon";
@@ -1423,3 +1424,77 @@ export const getTypography = async (config: Config) => {
 };
 
 //#endregion
+
+//#region Default Templates
+
+export const getDefaultKits = async (
+  url: string,
+  id: string
+): Promise<{
+  blocks: Kit[];
+  categories: { slug: string; title: string }[];
+  styles: Style;
+}> => {
+  const fullUrl = makeUrl(`${url}/api/get-kit-collections-chunk`, {
+    project_id: id
+  });
+
+  const response = await request(fullUrl, {
+    method: "GET"
+  });
+
+  if (response.ok) {
+    const res = await response.json();
+
+    return {
+      blocks: res.collections,
+      categories: res.categories,
+      styles: res.styles
+    };
+  }
+
+  throw new Error(t("Failed to load kits"));
+};
+
+export const getKitData = async (
+  url: string,
+  kitId: string,
+  id: string
+): Promise<DefaultBlock> => {
+  const fullUrl = makeUrl(`${url}/api/get-item`, {
+    project_id: kitId,
+    page_slug: id
+  });
+
+  const response = await request(fullUrl, {
+    method: "GET"
+  });
+
+  if (response.ok) {
+    const res = await response.json();
+    const collection = res.collection.pop();
+
+    return JSON.parse(collection.pageData).items.pop();
+  }
+
+  throw new Error(t("Failed to load kits"));
+};
+
+export const getKitsList = async (url: string): Promise<KitItem[]> => {
+  const response = await request(`${url}/api/get-kits`, {
+    method: "GET"
+  });
+
+  if (response.ok) {
+    const res = await response.json();
+
+    return res.collections.map((item: { slug: string; title: string }) => ({
+      ...item,
+      id: item.slug
+    }));
+  }
+
+  throw new Error(t("Failed to load kits"));
+};
+
+//#endregion

public/editor-client/src/config.ts

@@ -13,6 +13,7 @@ interface DefaultTemplates {
   popupsUrl: string;
   storiesUrl: string;
   layoutsUrl: string;
+  templatesUrl: string;
 }
 
 interface Actions {
@@ -76,6 +77,7 @@ interface API {
   deleteIconUrl: string;
   uploadIconUrl: string;
   imagePatterns: ImagePatterns;
+  templatesImageUrl: string;
 }
 
 export interface Config {
@@ -107,6 +109,10 @@ const templatesReader = parseStrict<Record<string, unknown>, DefaultTemplates>({
   storiesUrl: pipe(
     mPipe(Obj.readKey("storiesUrl"), Str.read),
     throwOnNullish("Invalid API Config: stories")
+  ),
+  templatesUrl: pipe(
+    mPipe(Obj.readKey("templatesUrl"), Str.read),
+    throwOnNullish("Invalid API Config: templates")
   )
 });
 
@@ -166,7 +172,11 @@ const apiReader = parseStrict<PLUGIN_ENV["api"], API>({
   iconUrl: readIconUrl("iconUrl"),
   iconsUrl: readIconUrl("getIconsUrl"),
   uploadIconUrl: readIconUrl("uploadIconUrl"),
-  deleteIconUrl: readIconUrl("deleteIconUrl")
+  deleteIconUrl: readIconUrl("deleteIconUrl"),
+  templatesImageUrl: pipe(
+    mPipe(Obj.readKey("templatesImageUrl"), Str.read),
+    throwOnNullish("Invalid API: templatesImageUrl")
+  )
 });
 
 const actionsReader = parseStrict<PLUGIN_ENV["actions"], Actions>({

public/editor-client/src/defaultTemplates/index.ts

@@ -1,3 +1,4 @@
+import { getDefaultKits, getKitData, getKitsList } from "@/api";
 import { Config } from "../config";
 import {
   BlocksArray,
@@ -7,7 +8,6 @@ import {
   DefaultTemplateKits,
   DefaultTemplatePopup,
   KitItem,
-  Kits,
   KitsWithThumbs,
   Layouts,
   LayoutsWithThumbs,
@@ -17,87 +17,40 @@ import {
   StoriesWithThumbs
 } from "../types/DefaultTemplate";
 import { t } from "../utils/i18n";
-import { tempConverterKit } from "./tempComverters";
+import { converterKit, convertToCategories } from "./utils";
 
 const defaultKits = (
   config: Config
 ): DefaultTemplateKits<KitsWithThumbs, DefaultBlock, Array<KitItem>> => {
-  const { kitsUrl } = config.api.templates;
-  // const apiKitUrl = "https://b8dd-87-255-68-163.ngrok-free.app/api";
-  // const apiImageUrl = "https://cloud-1de12d.b-cdn.net/media/iW=1024&iH=1024/";
+  const { templatesUrl } = config.api.templates;
+  const { templatesImageUrl } = config.api;
 
   return {
     async getMeta(res, rej, kit) {
       try {
-        // region This is new logic
-        // const allElements = await fetchAllElements<Kit>(
-        //   `${apiKitUrl}/get-kit-collections`,
-        //   kit.id,
-        //   100
-        // );
-        //
-        // const { types, blocks, categories } = converterKit(
-        //   allElements,
-        //   apiImageUrl,
-        //   kit.id
-        // );
-        //
-        // const customKit: KitsWithThumbs = {
-        //   id: kit.id,
-        //   blocks,
-        //   categories,
-        //   types,
-        //   name: kit.title,
-        //   styles: getStyles()
-        // };
-        // endregion
-
-        // region This in temporary / this is new logic with old source
-        const allElements = await fetch(`${kitsUrl}/meta.json`).then((r) =>
-          r.json()
-        );
-
-        const tempAllElements = allElements.find(
-          (item: Kits) => item.id === kit.id
-        );
+        const data = await getDefaultKits(templatesUrl, kit.id);
 
-        const { types, blocks, categories } = tempConverterKit(
-          tempAllElements,
-          `${kitsUrl}/thumbs`,
+        const { types, blocks } = converterKit(
+          data.blocks,
+          templatesImageUrl,
           kit.id
         );
 
-        const customKit: KitsWithThumbs = {
+        res({
           id: kit.id,
           blocks,
-          categories,
+          categories: convertToCategories(data.categories),
           types,
           name: kit.title,
-          styles: tempAllElements.styles
-        };
-        // endregion
-
-        res(customKit);
+          styles: [data.styles]
+        });
       } catch (e) {
         rej(t("Failed to load meta.json"));
       }
     },
-    async getData(res, rej, kit) {
+    async getData(res, rej, { kitId, id }) {
       try {
-        // region This is new logic
-        // const data = await fetch(
-        //   `${apiKitUrl}/get-item?project_id=${kit.kitId}&page_slug=${kit.id}`
-        // )
-        //   .then((r) => r.json())
-        //   .then((data) => data.pop())
-        //   .then((d) => JSON.parse(d.pageData).items.pop());
-        // endregion
-
-        // region This in temporary / this is new logic with old source
-        const data = await fetch(`${kitsUrl}/resolves/${kit.id}.json`).then(
-          (r) => r.json()
-        );
-        // endregion
+        const data = await getKitData(templatesUrl, kitId, id);
 
         res(data);
       } catch (e) {
@@ -106,22 +59,7 @@ const defaultKits = (
     },
     async getKits(res, rej) {
       try {
-        // region This is new logic
-        // const kits = await fetch(`${apiKitUrl}/get-kits`)
-        //   .then((r) => r.json())
-        //   .then((data) => data.list);
-        // endregion
-
-        // region This in temporary / this is new logic with old source
-        const kits = await fetch(`${kitsUrl}/meta.json`)
-          .then((r) => r.json())
-          .then((data) =>
-            data.map((kit: { id: string; name: string }) => ({
-              id: kit.id,
-              title: kit.name
-            }))
-          );
-        // endregion
+        const kits = await getKitsList(templatesUrl);
 
         res(kits);
       } catch (e) {
@@ -159,6 +97,7 @@ const defaultPopups = (
           blocks: meta.blocks.map((item) => {
             return {
               ...item,
+              type: ["light"],
               thumbnailSrc: `${popupsUrl}/thumbs/${item.id}.jpg`
             };
           })