Refactoring: folders structure, flexibility

src/app/getAppData.ts

@@ -3,7 +3,8 @@ import isEmpty from 'lodash/isEmpty';
 import pick from 'lodash/pick';
 import MenuItem from 'react-storefront-connector/MenuItem';
 import AppData from 'react-storefront-connector/AppData';
-import { fetchMenu, normalizeMenu } from '../menu';
+import fetchMenu from '../menu/fetchMenu';
+import menuNormalizer from '../menu/menuNormalizer';
 
 function normalizeMenuItems(items: any[]): MenuItem[] {
   if (isEmpty(items)) {
@@ -30,7 +31,7 @@ function getTabs(menu: MenuItem): MenuItem[] {
 
 export default async function getAppData(): Promise<AppData> {
   const rawData = await fetchMenu({ numberOfLevels: 3 });
-  const menuItems = normalizeMenu(rawData);
+  const menuItems = menuNormalizer(rawData);
   const menu: MenuItem = {
     header: 'header',
     footer: 'footer',

src/cms/blocks/normalizer.ts → src/cms/cmsBlocksNormalizer.ts

@@ -1,11 +1,11 @@
 import get from 'lodash/get';
 import cheerio from 'cheerio';
-import { host } from '../../config';
+import { host } from '../config';
 
 /**
  * Magento 2: cmsBlocks normalizer
  */
-function normalizer(rawData): any {
+function cmsBlocksNormalizer(rawData): any {
   const items = get(rawData, 'data.cmsBlocks.items', []);
   return {
     items: items.map((item) => {
@@ -40,4 +40,4 @@ function normalizer(rawData): any {
   };
 }
 
-export default normalizer;
+export default cmsBlocksNormalizer;

src/cms/blocks/query.ts → src/cms/cmsBlocksQuery.ts

@@ -1,9 +1,9 @@
-import GraphQlQuery from '../../types/GraphQlQuery';
+import GraphQlQuery from '../types/GraphQlQuery';
 
 /**
  * Magento 2: cmsBlocks Graph QL query
  */
-const query = ({ identifiers }): GraphQlQuery => ({
+const cmsBlocksQuery = ({ identifiers }): GraphQlQuery => ({
   query: `
     {
       cmsBlocks(identifiers: "${identifiers}") {
@@ -17,4 +17,4 @@ const query = ({ identifiers }): GraphQlQuery => ({
   `,
 });
 
-export default query;
+export default cmsBlocksQuery;

src/cms/fetchCmsBlocks.ts

@@ -0,0 +1,13 @@
+import fetchWithGraphQl from '../fetchWithGraphQl';
+import cmsBlocksQuery from './cmsBlocksQuery';
+
+/**
+ * Magento 2: cms blocks fetcher
+ */
+async function fetchCmsBlocks({ identifiers }): Promise<any> {
+  const query = cmsBlocksQuery({ identifiers });
+  const rawData = await fetchWithGraphQl(query);
+  return rawData;
+}
+
+export default fetchCmsBlocks;

src/index.ts

@@ -1,16 +1,17 @@
-export { default as home } from './home';
+export { default as home } from './home/home';
 export { default as addToCart } from './cart/addToCart';
 export { default as updateCartItem } from './cart/updateCartItem';
 export { default as removeCartItem } from './cart/removeCartItem';
 export { default as cart } from './cart';
 export { default as fetchWithGraphQl } from './fetchWithGraphQl';
-export { default as product } from './product';
+export { default as product } from './product/product';
+export { default as productSuggestions } from './product/suggestions/productSuggestions';
 export { default as routes } from './routes';
 export { default as session } from './session';
 export { default as signIn } from './session/signIn';
 export { default as signOut } from './session/signOut';
 export { default as signUp } from './session/signUp';
-export { default as subcategory } from './subcategory';
-export { default as search } from './search';
+export { default as subcategory } from './subcategory/subcategory';
+export { default as search } from './search/search';
 
 export { default } from './types/Connector';

src/menu/fetcher.ts → src/menu/fetchMenu.ts

@@ -1,10 +1,10 @@
 import fetchWithGraphQl from '../fetchWithGraphQl';
-import menuQuery from './query';
+import menuQuery from './menuQuery';
 
 /**
  * Magento 2: menu fetcher
  */
-async function fetcher({
+async function fetchMenu({
   numberOfLevels = 2,
   menuItemFields = [
     'name',
@@ -18,4 +18,4 @@ async function fetcher({
   return rawData;
 }
 
-export default fetcher;
+export default fetchMenu;

src/menu/normalizer.ts → src/menu/menuNormalizer.ts

@@ -14,12 +14,12 @@ function normalizeItems(children): any[] {
 /**
  * Magento 2: menu normalizer
  */
-function normalizer(rawData): any[] {
+function menuNormalizer(rawData): any[] {
   const rawMenu = get(rawData, 'data.categoryList', [])
     .filter((menu) => get(menu, 'level') === 1)[0];
   const children = get(rawMenu, 'children', []);
   const menu = normalizeItems(children);
   return menu;
 }
 
-export default normalizer;
+export default menuNormalizer;

src/menu/query.ts → src/menu/menuQuery.ts

@@ -21,7 +21,7 @@ function getFullInnerSchema(menuItemFields, numberOfLevels): string {
 /**
  * Magento 2: menu Graph QL query
  */
-const query = ({
+const menuQuery = ({
   numberOfLevels = 2,
   menuItemFields = [
     'name',
@@ -45,4 +45,4 @@ const query = ({
   };
 };
 
-export default query;
+export default menuQuery;

src/product/fetcher.ts → src/product/fetchProduct.ts

@@ -1,13 +1,13 @@
 import fetchWithGraphQl from '../fetchWithGraphQl';
-import productQuery from './query';
+import productQuery from './productQuery';
 
 /**
  * Magento 2: product fetcher
  */
-async function fetcher(productId): Promise<any> {
+async function fetchProduct(productId): Promise<any> {
   const pid = productId.replace('.html', '');
   const rawData = await fetchWithGraphQl(productQuery(pid));
   return rawData;
 }
 
-export default fetcher;
+export default fetchProduct;

src/product/product.ts

@@ -1,13 +1,13 @@
 import Result from 'react-storefront-connector/Result';
-import fetch from './fetcher';
-import normalize from './normalizer';
+import fetchProduct from './fetchProduct';
+import productNormalizer from './productNormalizer';
 import withAppData from '../app/withAppData';
 import ProductPageData from '../types/ProductPageData';
 
 export default async function product({ id/* , color, size  */ }, req/* , res */): Promise<Result<ProductPageData>> {
   return withAppData(req, async () => {
     id = id.replace('.html', ''); // eslint-disable-line no-param-reassign
-    const normalizedProduct = normalize(await fetch(id), id);
+    const normalizedProduct = productNormalizer(await fetchProduct(id), id);
 
     return {
       title: `Product ${id}`,

src/product/normalizer.ts → src/product/productNormalizer.ts

@@ -130,7 +130,7 @@ function specsToHtml(specs) {
 /**
  * Magento 2: product normalizer
  */
-function normalizer(rawData, productId): Product | null {
+function productNormalizer(rawData, productId): Product | null {
   const rawProduct = get(rawData, 'data.products.items[0]');
   const rawCustomAttributes = get(rawData, 'data.customAttributeMetadata.items', []);
 
@@ -161,4 +161,4 @@ function normalizer(rawData, productId): Product | null {
   };
 }
 
-export default normalizer;
+export default productNormalizer;

src/product/query.ts → src/product/productQuery.ts

@@ -33,7 +33,7 @@ const customAttributeMetadata = `
 /**
  * Magento 2: product query
  */
-const query = (urlKey): GraphQlQuery => ({
+const productQuery = (urlKey): GraphQlQuery => ({
   query: `
     {
       ${customAttributeMetadata}
@@ -123,4 +123,4 @@ const query = (urlKey): GraphQlQuery => ({
   `,
 });
 
-export default query;
+export default productQuery;

src/product/productSuggestions.ts → src/product/suggestions/productSuggestions.ts

@@ -1,4 +1,4 @@
-import { Product } from '../types/ProductPageData';
+import { Product } from '../../types/ProductPageData';
 
 /**
  * @TODO: implement

src/search/fetcher.ts → src/search/fetchSearch.ts

@@ -1,10 +1,10 @@
-import { fetchSubcategory } from '../subcategory';
+import fetchSubcategory from '../subcategory/fetchSubcategory';
 
 /**
  * Magento 2: search fetcher
  * > uses subcategory fetcher underneath
  */
-async function fetcher({
+async function fetchSearch({
   pageSize = 16,
   currentPage = 1,
   filter = '',
@@ -21,4 +21,4 @@ async function fetcher({
   return rawData;
 }
 
-export default fetcher;
+export default fetchSearch;

src/search/searchNormalizer.ts

@@ -0,0 +1,11 @@
+import subcategoryNormalizer from '../subcategory/subcategoryNormalizer';
+
+/**
+ * Magento 2: search normalizer
+ * > uses subcategory normalizer underneath
+ */
+function searchNormalizer(rawData) {
+  return subcategoryNormalizer(rawData);
+}
+
+export default searchNormalizer;

src/subcategory/fetcher.ts → src/subcategory/fetchSubcategory.ts

@@ -1,10 +1,10 @@
 import fetchWithGraphQl from '../fetchWithGraphQl';
-import subcategoryQuery from './query';
+import subcategoryQuery from './subcategoryQuery';
 
 /**
  * Magento 2: subcategory fetcher
  */
-async function fetcher({
+async function fetchSubcategory({
   categoryId = null,
   pageSize = 16,
   currentPage = 1,
@@ -24,4 +24,4 @@ async function fetcher({
   return rawData;
 }
 
-export default fetcher;
+export default fetchSubcategory;

src/subcategory/id/fetcher.ts → src/subcategory/id/fetchSubcategoryId.ts

@@ -1,13 +1,13 @@
 import fetchWithGraphQl from '../../fetchWithGraphQl';
-import subcategoryIdQuery from './query';
+import subcategoryIdQuery from './subcategoryIdQuery';
 
 /**
  * Magento 2: subcategory id fetcher
  */
-async function fetcher({ urlKey }): Promise<any> {
+async function fetchSubcategoryId({ urlKey }): Promise<any> {
   const query = subcategoryIdQuery({ urlKey });
   const rawData = await fetchWithGraphQl(query);
   return rawData;
 }
 
-export default fetcher;
+export default fetchSubcategoryId;