@ikas/storefront-cmd 4.0.0-alpha.49 → 4.0.0-alpha.50

package/src/scripts/generators/pages/index.ts

@@ -0,0 +1,102 @@
+import { IkasThemeJsonPageType } from "@ikas/storefront-models";
+import path from "path";
+import { createFile, deleteDirContent } from "../../../utils/fs";
+import {
+  PageInfo,
+  PAGE_INFO,
+  CHECKOUT_PAGE_CONTENT,
+  EDITOR_PAGE_CONTENT,
+} from "./info";
+
+export class PageGenerator {
+  static async generate(workingDir?: string) {
+    const pagesDir = path.join(workingDir || process.cwd(), "src", "pages");
+    await deleteDirContent(pagesDir, ["_app.tsx", "_document.tsx", "api"]);
+
+    let pagesGenerateSuccess = true;
+    for (const pageInfo of PAGE_INFO) {
+      pagesGenerateSuccess =
+        pagesGenerateSuccess &&
+        (await PageGenerator.generatePageWithInfo(pageInfo, workingDir));
+    }
+
+    const checkoutPageInfo = PAGE_INFO.find((pi) => pi.isCheckout);
+    const editorPageInfo = PAGE_INFO.find((pi) => pi.isEditor);
+
+    const checkoutPageGenerateSuccess = checkoutPageInfo
+      ? await PageGenerator.generatePageWithInfo(checkoutPageInfo, workingDir)
+      : false;
+    const editorPageGenerateSuccess = editorPageInfo
+      ? await PageGenerator.generatePageWithInfo(editorPageInfo, workingDir)
+      : false;
+
+    return (
+      pagesGenerateSuccess &&
+      checkoutPageGenerateSuccess &&
+      editorPageGenerateSuccess
+    );
+  }
+
+  static async generatePageWithInfo(pageInfo: PageInfo, workingDir?: string) {
+    try {
+      let fileStr = "";
+
+      if (pageInfo.isCheckout) {
+        fileStr = CHECKOUT_PAGE_CONTENT;
+      } else if (pageInfo.isEditor) {
+        fileStr = EDITOR_PAGE_CONTENT;
+      } else {
+        const providerName = pageInfo.pageComponentName + "Next";
+        const pageComponentImportStr = `import { ${pageInfo.pageComponentName} } from "@ikas/storefront";\r\n`;
+        const providerImportStr = `import { ${pageInfo.pageComponentName} as ${providerName} } from "@ikas/storefront-next";\r\n`;
+        const componentsImportStr = `import Components from "src/components/__generated__/pages/${pageInfo.path.replace(
+          ".tsx",
+          ""
+        )}";\r\n`;
+
+        const pageComponentStr = `
+const PageComponent = ${pageInfo.pageComponentName}.default;
+
+const Page = (props: any) => {
+  return <PageComponent components={Components} {...props} />;
+};
+
+export default Page;\r\n`;
+
+        const getStaticPathsStr = pageInfo.isDynamicSSG
+          ? `export const getStaticPaths = ${providerName}.getStaticPaths;\r\n`
+          : "";
+
+        const dataFetchingStr = pageInfo.isSSR
+          ? `export const getServerSideProps = ${providerName}.getServerSideProps;\r\n`
+          : `export const getStaticProps = ${providerName}.getStaticProps;\r\n`;
+
+        fileStr =
+          pageComponentImportStr +
+          providerImportStr +
+          componentsImportStr +
+          pageComponentStr +
+          getStaticPathsStr +
+          dataFetchingStr;
+      }
+
+      return await createFile(
+        path.join(workingDir || process.cwd(), "src", "pages"),
+        pageInfo.path,
+        fileStr
+      );
+    } catch (err) {
+      console.error(err);
+      return false;
+    }
+  }
+
+  static async generatePageWithType(pageType: IkasThemeJsonPageType) {
+    const pageInfo = PAGE_INFO.find((pi) => pi.pageTypes.includes(pageType));
+    if (pageInfo) {
+      return await PageGenerator.generatePageWithInfo(pageInfo);
+    }
+
+    return false;
+  }
+}

package/src/scripts/generators/pages/info.ts

@@ -0,0 +1,161 @@
+import { IkasThemeJsonPageType } from "@ikas/storefront-models";
+
+export type PageInfo = {
+  path: string;
+  pageComponentName: string;
+  pageTypes: IkasThemeJsonPageType[];
+  isDynamicSSG?: boolean;
+  isSSR?: boolean;
+  isEditor?: boolean;
+  isCheckout?: boolean;
+};
+
+export const CHECKOUT_COMPONENT_ID = "checkout";
+
+export const PAGE_INFO: PageInfo[] = [
+  {
+    path: "[slug]/index.tsx",
+    pageComponentName: "SlugPage",
+    pageTypes: [
+      IkasThemeJsonPageType.PRODUCT,
+      IkasThemeJsonPageType.CATEGORY,
+      IkasThemeJsonPageType.BRAND,
+    ],
+    isDynamicSSG: true,
+  },
+  {
+    path: "account/orders/[id].tsx",
+    pageComponentName: "OrderDetailPage",
+    pageTypes: [IkasThemeJsonPageType.ORDER_DETAIL],
+    isSSR: true,
+  },
+  {
+    path: "account/orders/index.tsx",
+    pageComponentName: "OrdersPage",
+    pageTypes: [IkasThemeJsonPageType.ORDERS],
+  },
+  {
+    path: "account/addresses.tsx",
+    pageComponentName: "AddressesPage",
+    pageTypes: [IkasThemeJsonPageType.ADDRESSES],
+  },
+  {
+    path: "account/favorite-products.tsx",
+    pageComponentName: "FavoriteProductsPage",
+    pageTypes: [IkasThemeJsonPageType.FAVORITE_PRODUCTS],
+  },
+  {
+    path: "account/forgot-password.tsx",
+    pageComponentName: "ForgotPasswordPage",
+    pageTypes: [IkasThemeJsonPageType.FORGOT_PASSWORD],
+  },
+  {
+    path: "account/index.tsx",
+    pageComponentName: "AccountPage",
+    pageTypes: [IkasThemeJsonPageType.ACCOUNT],
+  },
+  {
+    path: "account/login.tsx",
+    pageComponentName: "LoginPage",
+    pageTypes: [IkasThemeJsonPageType.LOGIN],
+  },
+  {
+    path: "account/raffles.tsx",
+    pageComponentName: "AccountRafflesPage",
+    pageTypes: [IkasThemeJsonPageType.RAFFLE_ACCOUNT],
+  },
+  {
+    path: "account/recover-password.tsx",
+    pageComponentName: "RecoverPasswordPage",
+    pageTypes: [IkasThemeJsonPageType.RECOVER_PASSWORD],
+  },
+  {
+    path: "account/register.tsx",
+    pageComponentName: "RegisterPage",
+    pageTypes: [IkasThemeJsonPageType.REGISTER],
+  },
+  {
+    path: "blog/[slug].tsx",
+    pageComponentName: "BlogSlugPage",
+    pageTypes: [
+      IkasThemeJsonPageType.BLOG,
+      IkasThemeJsonPageType.BLOG_CATEGORY,
+    ],
+    isDynamicSSG: true,
+  },
+  {
+    path: "blog/index.tsx",
+    pageComponentName: "BlogPage",
+    pageTypes: [IkasThemeJsonPageType.BLOG_INDEX],
+  },
+  {
+    path: "pages/[slug].tsx",
+    pageComponentName: "CustomPage",
+    pageTypes: [IkasThemeJsonPageType.CUSTOM],
+    isDynamicSSG: true,
+  },
+  {
+    path: "raffle/[slug].tsx",
+    pageComponentName: "RafflePage",
+    pageTypes: [IkasThemeJsonPageType.RAFFLE_DETAIL],
+    isDynamicSSG: true,
+  },
+  {
+    path: "raffle/index.tsx",
+    pageComponentName: "RafflesPage",
+    pageTypes: [IkasThemeJsonPageType.RAFFLE],
+  },
+  {
+    path: "404.tsx",
+    pageComponentName: "NotFoundPage",
+    pageTypes: [IkasThemeJsonPageType.NOT_FOUND],
+  },
+  {
+    path: "cart.tsx",
+    pageComponentName: "CartPage",
+    pageTypes: [IkasThemeJsonPageType.CART],
+  },
+  {
+    path: "index.tsx",
+    pageComponentName: "IndexPage",
+    pageTypes: [IkasThemeJsonPageType.INDEX],
+  },
+  {
+    path: "search.tsx",
+    pageComponentName: "SearchPage",
+    pageTypes: [IkasThemeJsonPageType.SEARCH],
+  },
+  {
+    path: "checkout.tsx",
+    pageComponentName: "CheckoutPage",
+    pageTypes: [],
+    isCheckout: true,
+  },
+  {
+    path: "editor.tsx",
+    pageComponentName: "EditorPage",
+    pageTypes: [],
+    isEditor: true,
+  },
+];
+
+export const CHECKOUT_PAGE_CONTENT = `import { CheckoutPage } from "@ikas/storefront";
+import { CheckoutPage as CheckoutPageNext } from "@ikas/storefront-next";
+
+export default CheckoutPage.default;
+export const getStaticProps = CheckoutPageNext.getStaticProps;
+`;
+
+export const EDITOR_PAGE_CONTENT = `import { EditorPage } from "@ikas/storefront";
+import { EditorPage as EditorPageNext } from "@ikas/storefront-next";
+import Components from "../components/__generated__/editor";
+
+const PageComponent = EditorPage.default;
+
+const Page = (props: any) => {
+  return <PageComponent components={Components} {...props} />;
+};
+
+export default Page;
+export const getStaticProps = EditorPageNext.getStaticProps;
+`;

package/src/scripts/generators/theme/index.ts

@@ -0,0 +1,63 @@
+import path from "path";
+import fs from "fs";
+import { createFile } from "../../../utils/fs";
+import {
+  IkasThemeJson,
+  IkasThemeJsonPageType,
+  IkasThemeJsonStockPreference,
+} from "@ikas/storefront-models";
+
+export class ThemeJsonGenerator {
+  static generate(themeJson: IkasThemeJson) {
+    return createFile(
+      path.join(process.cwd(), "src", "theme.json"),
+      "",
+      JSON.stringify(themeJson, null, 2)
+    );
+  }
+
+  static generateInitialThemeJsonFile() {
+    const themeJson: IkasThemeJson = {
+      pages: [],
+      components: [],
+      name: "My Theme",
+      customData: [],
+      settings: {
+        colors: [],
+        favicon: {
+          id: null,
+        },
+        fontFamily: {
+          name: null,
+          variants: null,
+        },
+        stockPreference: IkasThemeJsonStockPreference.SHOW_ALL,
+      },
+    };
+
+    themeJson.pages.push({
+      id: "1",
+      components: [],
+      canonicals: null,
+      description: null,
+      disableIndex: null,
+      name: null,
+      pageTitle: null,
+      slug: null,
+      specifications: [],
+      type: IkasThemeJsonPageType.INDEX,
+    });
+
+    return ThemeJsonGenerator.generate(themeJson);
+  }
+
+  static async getTheme() {
+    try {
+      const themePath = path.join(process.cwd(), "src", "theme.json");
+      const fileBuffer = fs.readFileSync(themePath);
+      return fileBuffer.length ? JSON.parse(fileBuffer.toString()) : null;
+    } catch (err) {
+      console.error(err);
+    }
+  }
+}