react-help-create - npm Package Compare versions

Comparing version 2.0.1 to 2.2.0

bin/create/config/functions/create-config.js

+const fs = require("file-system");
+const { defaultConfigTemplate } = require("../templates");
+
+/**
+ * @function createConfig
+ * @description this function is used to create the config file.
+ * @version 1.0.0
+ * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
+ */
+exports.createConfig = () => {
+  if (fs.existsSync("./rhc.config.json")) {
+    console.log("rhc.config.json already exist");
+    return;
+  }
+  fs.writeFile("./rhc.config.json", defaultConfigTemplate(), (err) => {
+    if (err) {
+      console.log(err);
+      console.log("Unable to create rhc.config.json");
+    } else {
+      console.log("rhc.config.json created");
+    }
+  });
+};

bin/create/config/functions/index.js

+const { createConfig } = require("./create-config");
+
+exports.createConfig = createConfig;

bin/create/config/templates/default-config-template.js

+/**
+ * @function defaultConfigTemplate
+ * @description this function returns the default config template.
+ * @version 1.0.0
+ * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
+ */
+exports.defaultConfigTemplate = () => {
+  return `{
+  "withCSS": true,
+  "withFunctions": true,
+  "withProps": true,
+  "defaultExports": true,
+  "componentsRoot": "./src/components",
+  "pagesRoot": "./src/pages",
+  "reduxRoot": "./src/redux"
+}`;
+};

bin/create/config/templates/index.js

+const { defaultConfigTemplate } = require("./default-config-template");
+
+exports.defaultConfigTemplate = defaultConfigTemplate;

bin/delete/config/delete-config.js

+const fs = require("file-system");
+
+/**
+ * @function deleteConfig
+ * @description this function is used to delete the config file.
+ * @version 1.0.0
+ * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
+ */
+exports.deleteConfig = () => {
+  if (fs.existsSync("./rhc.config.json")) {
+    fs.unlinkSync("./rhc.config.json");
+    console.log("rhc.config.json deleted");
+  } else {
+    console.log("rhc.config.json does not exist");
+  }
+};

bin/delete/config/index.js

+const { deleteConfig } = require("./delete-config");
+
+exports.deleteConfig = deleteConfig;

bin/utils/configs.js

+let config = {
+  withCSS: true, // if true, create styles.css file for components and pages, if false, don't create styles.css file
+  withFunctions: true, // if true, create functions folder for pages, if false, don't create functions folder
+  withProps: true, // if true, create props interface for components and pages (in TS only), if false, don't create props interface
+  defaultExports: true, // if true, create default export for components and pages, if false, create named export for components and pages
+  componentsRoot: "./src/components", // path to components folder
+  pagesRoot: "./src/pages", // path to pages folder
+  reduxRoot: "./src/redux", // path to redux folder
+};
+
+exports.config = config;

bin/utils/load-config.js

+const fs = require("file-system");
+const { config } = require("./configs");
+
+/**
+ * @function loadConfig
+ * @description Loads the configuration json file for rhc.
+ * @returns {Object} The configuration object.
+ * @throws {Error} If the configuration file cannot be loaded.
+ * @version 1.0.0
+ * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
+ */
+exports.loadConfig = () => {
+  try {
+    const {
+      withCSS,
+      withFunctions,
+      withProps,
+      defaultExports,
+      componentsRoot,
+      pagesRoot,
+      reduxRoot,
+    } = JSON.parse(fs.readFileSync("./rhc.config.json"));
+    config.withCSS = typeof withCSS === "boolean" ? withCSS : true;
+    config.withFunctions =
+      typeof withFunctions === "boolean" ? withFunctions : true;
+    config.withProps = typeof withProps === "boolean" ? withProps : true;
+    config.defaultExports =
+      typeof defaultExports === "boolean" ? defaultExports : true;
+    config.componentsRoot =
+      typeof componentsRoot === "string" ? componentsRoot : "./src/components";
+    config.pagesRoot =
+      typeof pagesRoot === "string" ? pagesRoot : "./src/pages";
+    config.reduxRoot =
+      typeof reduxRoot === "string" ? reduxRoot : "./src/redux";
+  } catch (e) {
+    throw new Error(
+      "The configuration file could not be loaded. Please make sure that the file exists and is valid."
+    );
+  }
+};

bin/combine/components/combine-components.js

 const fs = require("file-system");
+const { config } = require("../../utils");
 
@@ -16,3 +17,4 @@ /**
   }
-  const path = "src/components/";
+  const { componentsRoot } = config;
+  const path = `${componentsRoot}/`;
   const _path = `${path}${folder}/`;
@@ -19,0 +21,0 @@ let folders = [];

bin/combine/pages/combine-pages.js

 const fs = require("file-system");
+const { config } = require("../../utils");
 
@@ -16,3 +17,4 @@ /**
   }
-  const path = "src/pages/";
+  const { pagesRoot } = config;
+  const path = `${pagesRoot}/`;
   const _path = `${path}${folder}/`;
@@ -25,3 +27,3 @@ let folders = [];
   });
-  if (folders.length < screens.length) {
+  if (folders.length < pages.length) {
     console.log("Check if all of these pages exist");
@@ -28,0 +30,0 @@ return;

bin/create/component/functions/create-component.js

@@ -7,2 +7,3 @@ const fs = require("file-system");
 } = require("../templates");
+const { config } = require("../../../utils");
 
@@ -21,2 +22,3 @@ /**
 exports.createComponent = (componentName, js, ts, folder, template) => {
+  const { withCSS, withProps, defaultExports, componentsRoot } = config;
   let component =
@@ -34,8 +36,8 @@ componentName.charAt(0).toUpperCase() + componentName.slice(1);
       folder === ""
-        ? `src/components/${componentName.toLowerCase()}/index.tsx`
-        : `src/components/${folder}/${componentName.toLowerCase()}/index.tsx`;
+        ? `${componentsRoot}/${componentName.toLowerCase()}/index.tsx`
+        : `${componentsRoot}/${folder}/${componentName.toLowerCase()}/index.tsx`;
     const stylesPath =
       folder === ""
-        ? `src/components/${componentName.toLowerCase()}/styles.css`
-        : `src/components/${folder}/${componentName.toLowerCase()}/styles.css`;
+        ? `${componentsRoot}/${componentName.toLowerCase()}/styles.css`
+        : `${componentsRoot}/${folder}/${componentName.toLowerCase()}/styles.css`;
     if (fs.existsSync(path)) {
@@ -54,3 +56,30 @@ console.log(`${path} already exist`);
           });
-          fs.writeFile(path, file, (err) => {
+          fs.writeFile(
+            path,
+            file.replace(/__COMPONENT__/g, component),
+            (err) => {
+              if (err) {
+                console.log(err);
+                console.log(`Unable to create ${component} component`);
+              } else {
+                console.log(`${path} created`);
+              }
+            }
+          );
+          withCSS &&
+            fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
+              if (err) {
+                console.log(`Unable to create ${component} component styles`);
+              } else {
+                console.log(`${stylesPath} created`);
+              }
+            });
+        } else {
+          console.log(`.template/${template} file does not exist`);
+        }
+      } else {
+        fs.writeFile(
+          path,
+          componentTemplateTs(component, withCSS, defaultExports, withProps),
+          (err) => {
             if (err) {
@@ -62,3 +91,5 @@ console.log(err);
             }
-          });
+          }
+        );
+        withCSS &&
           fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
@@ -71,21 +102,2 @@ if (err) {
           });
-        } else {
-          console.log(`.template/${template} file does not exist`);
-        }
-      } else {
-        fs.writeFile(path, componentTemplateTs(component), (err) => {
-          if (err) {
-            console.log(err);
-            console.log(`Unable to create ${component} component`);
-          } else {
-            console.log(`${path} created`);
-          }
-        });
-        fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
-          if (err) {
-            console.log(`Unable to create ${component} component styles`);
-          } else {
-            console.log(`${stylesPath} created`);
-          }
-        });
       }
@@ -96,8 +108,8 @@ }
       folder === ""
-        ? `src/components/${componentName.toLowerCase()}/index.jsx`
-        : `src/components/${folder}/${componentName.toLowerCase()}/index.jsx`;
+        ? `${componentsRoot}/${componentName.toLowerCase()}/index.jsx`
+        : `${componentsRoot}/${folder}/${componentName.toLowerCase()}/index.jsx`;
     const stylesPath =
       folder === ""
-        ? `src/components/${componentName.toLowerCase()}/styles.css`
-        : `src/components/${folder}/${componentName.toLowerCase()}/styles.css`;
+        ? `${componentsRoot}/${componentName.toLowerCase()}/styles.css`
+        : `${componentsRoot}/${folder}/${componentName.toLowerCase()}/styles.css`;
     if (fs.existsSync(path)) {
@@ -116,5 +128,31 @@ console.log(`${path} already exist`);
           });
-          fs.writeFile(path, file, (err) => {
+          fs.writeFile(
+            path,
+            file.replace(/__COMPONENT__/g, component),
+            (err) => {
+              if (err) {
+                console.log(err);
+                console.log(`Unable to create ${component} component`);
+              } else {
+                console.log(`${path} created`);
+              }
+            }
+          );
+          withCSS &&
+            fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
+              if (err) {
+                console.log(`Unable to create ${component} component styles`);
+              } else {
+                console.log(`${stylesPath} created`);
+              }
+            });
+        } else {
+          console.log(`.template/${template} file does not exist`);
+        }
+      } else {
+        fs.writeFile(
+          path,
+          componentTemplateJs(component, withCSS, defaultExports),
+          (err) => {
             if (err) {
-              console.log(err);
               console.log(`Unable to create ${component} component`);
@@ -124,3 +162,5 @@ } else {
             }
-          });
+          }
+        );
+        withCSS &&
           fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
@@ -133,20 +173,2 @@ if (err) {
           });
-        } else {
-          console.log(`.template/${template} file does not exist`);
-        }
-      } else {
-        fs.writeFile(path, componentTemplateJs(component), (err) => {
-          if (err) {
-            console.log(`Unable to create ${component} component`);
-          } else {
-            console.log(`${path} created`);
-          }
-        });
-        fs.writeFile(stylesPath, stylesTemplate(component), (err) => {
-          if (err) {
-            console.log(`Unable to create ${component} component styles`);
-          } else {
-            console.log(`${stylesPath} created`);
-          }
-        });
       }
@@ -153,0 +175,0 @@ }

bin/create/component/templates/component-template-js.js

@@ -5,14 +5,29 @@ /**
  * @param {string} componentName - the name of the component.
+ * @param {boolean} withCSS - if the component has css.
+ * @param {boolean} defaultExports - if the component is a default export.
  * @returns {string} the template js file.
- * @version 1.0.0
+ * @version 1.1.0
  * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
  */
-exports.componentTemplateJs = (componentName) => {
-  return `import "./styles.css";
-
+exports.componentTemplateJs = (componentName, withCSS, defaultExports) => {
+  let str = "";
+  if (withCSS) {
+    str += `import "./styles.css";
+`;
+  }
+  if (defaultExports) {
+    str += `
 const ${componentName} = () => {
-    return <div>${componentName} component created!</div>;
-}
+  return <div>${componentName} component created!</div>;
+};
 export default ${componentName};
 `;
+  } else {
+    str += `
+export const ${componentName} = () => {
+  return <div>${componentName} component created!</div>;
 };
+`;
+  }
+  return str;
+};

bin/create/component/templates/component-template-ts.js

@@ -5,17 +5,45 @@ /**
  * @param {string} componentName - the name of the component.
+ * @param {boolean} withCSS - if the component has css.
+ * @param {boolean} defaultExports - if the component is a default export.
+ * @param {boolean} withProps - if the component has props.
  * @returns {string} the template ts file.
- * @version 1.0.0
+ * @version 1.1.0
  * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
  */
-exports.componentTemplateTs = (componentName) => {
-  return `import { FC } from "react";
-import "./styles.css";
-
+exports.componentTemplateTs = (
+  componentName,
+  withCSS,
+  defaultExports,
+  withProps
+) => {
+  let str = `import { FC } from "react";
+`;
+  if (withCSS) {
+    str += `import "./styles.css";
+`;
+  }
+  if (withProps) {
+    str += `
 interface ${componentName}Props {}
-
-const ${componentName}: FC<${componentName}Props> = ({}: ${componentName}Props) => {
-    return <div>${componentName} component created!</div>;
-}
+`;
+  }
+  if (defaultExports) {
+    str += `
+const ${componentName}: FC${withProps ? `<${componentName}Props>` : ""} = (${
+      withProps ? `{}: ${componentName}Props` : ""
+    }) => {
+  return <div>${componentName} component created!</div>;
+};
 export default ${componentName};
 `;
+  } else {
+    str += `
+export const ${componentName}: FC${
+      withProps ? `<${componentName}Props>` : ""
+    } = (${withProps ? `{}: ${componentName}Props` : ""}) => {
+  return <div>${componentName} component created!</div>;
 };
+`;
+  }
+  return str;
+};

bin/create/index.js

 const { createComponent } = require("./component/functions");
-const {
-  componentTemplateJs,
-  componentTemplateTs,
-} = require("./component/templates");
-
 const { createPage } = require("./page/functions");
-const { pageTemplateJs, pageTemplateTs } = require("./page/templates");
-
 const { createRedux } = require("./redux/functions");
-const { reduxTemplateJs, reduxTemplateTs } = require("./redux/templates");
+const { createConfig } = require("./config/functions");
 
 exports.createComponent = createComponent;
-exports.componentTemplateJs = componentTemplateJs;
-exports.componentTemplateTs = componentTemplateTs;
 exports.createPage = createPage;
-exports.pageTemplateJs = pageTemplateJs;
-exports.pageTemplateTs = pageTemplateTs;
 exports.createRedux = createRedux;
-exports.reduxTemplateJs = reduxTemplateJs;
-exports.reduxTemplateTs = reduxTemplateTs;
+exports.createConfig = createConfig;

bin/create/page/functions/create-page.js

@@ -9,2 +9,3 @@ const fs = require("file-system");
 } = require("../templates");
+const { config } = require("../../../utils");
 
@@ -23,2 +24,4 @@ /**
 exports.createPage = (pageName, js, ts, folder, template) => {
+  const { withCSS, withFunctions, withProps, defaultExports, pagesRoot } =
+    config;
   let page = pageName.charAt(0).toUpperCase() + pageName.slice(1);
@@ -34,4 +37,4 @@ if (pageName.includes("-")) {
     folder === ""
-      ? `src/pages/${pageName.toLowerCase()}/`
-      : `src/pages/${folder}/${pageName.toLowerCase()}/`;
+      ? `${pagesRoot}/${pageName.toLowerCase()}/`
+      : `${pagesRoot}/${folder}/${pageName.toLowerCase()}/`;
   if (fs.existsSync(path)) {
@@ -51,9 +54,49 @@ console.log(`${path} already exist`);
           });
-          fs.writeFile(`${path}index.tsx`, file, (err) => {
+          fs.writeFile(
+            `${path}index.tsx`,
+            file.replace(/__COMPONENT__/g, page),
+            (err) => {
+              if (err) {
+                console.log(`Unable to create ${page} page`);
+              } else {
+                console.log(`${path}index.tsx created`);
+              }
+            }
+          );
+          withFunctions &&
+            fs.writeFile(
+              `${path}functions/index.ts`,
+              pageFunctionTemplateTs(page),
+              (err) => {
+                if (err) {
+                  console.log(`Unable to create ${page} page functions`);
+                } else {
+                  console.log(`${path}functions/index.ts created`);
+                }
+              }
+            );
+          withCSS &&
+            fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
+              if (err) {
+                console.log(`Unable to create ${page} component styles`);
+              } else {
+                console.log(`${path}styles.css created`);
+              }
+            });
+        } else {
+          console.log(`.template/${template} file does not exist`);
+        }
+      } else {
+        fs.writeFile(
+          `${path}index.tsx`,
+          pageTemplateTs(page, withCSS, defaultExports, withProps),
+          (err) => {
             if (err) {
-              console.log(`Unable to create ${page} page`);
+              console.log(`Unable to create ${pageName} page ui`);
             } else {
               console.log(`${path}index.tsx created`);
             }
-          });
+          }
+        );
+        withFunctions &&
           fs.writeFile(
@@ -70,2 +113,3 @@ `${path}functions/index.ts`,
           );
+        withCSS &&
           fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
@@ -78,31 +122,2 @@ if (err) {
           });
-        } else {
-          console.log(`.template/${template} file does not exist`);
-        }
-      } else {
-        fs.writeFile(`${path}index.tsx`, pageTemplateTs(page), (err) => {
-          if (err) {
-            console.log(`Unable to create ${pageName} page ui`);
-          } else {
-            console.log(`${path}index.tsx created`);
-          }
-        });
-        fs.writeFile(
-          `${path}functions/index.ts`,
-          pageFunctionTemplateTs(page),
-          (err) => {
-            if (err) {
-              console.log(`Unable to create ${page} page functions`);
-            } else {
-              console.log(`${path}functions/index.ts created`);
-            }
-          }
-        );
-        fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
-          if (err) {
-            console.log(`Unable to create ${page} component styles`);
-          } else {
-            console.log(`${path}styles.css created`);
-          }
-        });
       }
@@ -120,3 +135,41 @@ } else {
           });
-          fs.writeFile(`${path}index.jsx`, file, (err) => {
+          fs.writeFile(
+            `${path}index.jsx`,
+            file.replace(/__COMPONENT__/g, page),
+            (err) => {
+              if (err) {
+                console.log(`Unable to create ${page} page`);
+              } else {
+                console.log(`${path}index.jsx created`);
+              }
+            }
+          );
+          withFunctions &&
+            fs.writeFile(
+              `${path}functions/index.js`,
+              pageFunctionTemplateJs(page),
+              (err) => {
+                if (err) {
+                  console.log(`Unable to create ${page} page functions`);
+                } else {
+                  console.log(`${path}functions/index.js created`);
+                }
+              }
+            );
+          withCSS &&
+            fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
+              if (err) {
+                console.log(`Unable to create ${page} component styles`);
+              } else {
+                console.log(`${path}styles.css created`);
+              }
+            });
+        } else {
+          console.log(`.template/${template} file does not exist`);
+        }
+      } else {
+        fs.writeFile(
+          `${path}index.jsx`,
+          pageTemplateJs(page, withCSS, defaultExports),
+          (err) => {
             if (err) {
@@ -127,3 +180,5 @@ console.log(`Unable to create ${page} page`);
             }
-          });
+          }
+        );
+        withFunctions &&
           fs.writeFile(
@@ -140,2 +195,3 @@ `${path}functions/index.js`,
           );
+        withCSS &&
           fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
@@ -148,31 +204,2 @@ if (err) {
           });
-        } else {
-          console.log(`.template/${template} file does not exist`);
-        }
-      } else {
-        fs.writeFile(`${path}index.jsx`, pageTemplateJs(page), (err) => {
-          if (err) {
-            console.log(`Unable to create ${page} page`);
-          } else {
-            console.log(`${path}index.jsx created`);
-          }
-        });
-        fs.writeFile(
-          `${path}functions/index.js`,
-          pageFunctionTemplateJs(page),
-          (err) => {
-            if (err) {
-              console.log(`Unable to create ${page} page functions`);
-            } else {
-              console.log(`${path}functions/index.js created`);
-            }
-          }
-        );
-        fs.writeFile(`${path}styles.css`, stylesTemplate(page), (err) => {
-          if (err) {
-            console.log(`Unable to create ${page} component styles`);
-          } else {
-            console.log(`${path}styles.css created`);
-          }
-        });
       }
@@ -179,0 +206,0 @@ }

bin/create/page/templates/page-template-js.js

@@ -5,13 +5,29 @@ /**
  * @param {string} pageName - the page name.
+ * @param {boolean} withCSS - if the page has css.
+ * @param {boolean} defaultExports - if the page is a default export.
  * @returns {string} the page template in javascript.
+ * @version 1.1.0
  * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
  */
-exports.pageTemplateJs = (pageName) => {
-  return `import "./styles.css";
-
+exports.pageTemplateJs = (pageName, withCSS, defaultExports) => {
+  let str = "";
+  if (withCSS) {
+    str += `import "./styles.css";
+`;
+  }
+  if (defaultExports) {
+    str += `
 const ${pageName} = () => {
     return <div>${pageName} page created!</div>;
-}
+};
 export default ${pageName};
 `;
+  } else {
+    str += `
+export const ${pageName} = () => {
+    return <div>${pageName} page created!</div>;
 };
+`;
+  }
+  return str;
+};

bin/create/page/templates/page-template-ts.js

@@ -5,16 +5,40 @@ /**
  * @param {string} pageName - the page name.
+ * @param {boolean} withCSS - if the page has css.
+ * @param {boolean} defaultExports - if the page is a default export.
+ * @param {boolean} withProps - if the page has props.
  * @returns {string} the page template in typescript.
+ * @version 1.1.0
  * @author [Omar Belghaouti](https://github.com/Omar-Belghaouti)
  */
-exports.pageTemplateTs = (pageName) => {
-  return `import { FC } from "react";
-import "./styles.css";
-
+exports.pageTemplateTs = (pageName, withCSS, defaultExports, withProps) => {
+  let str = `import { FC } from "react";
+`;
+  if (withCSS) {
+    str += `import "./styles.css";
+`;
+  }
+  if (withProps) {
+    str += `
 interface ${pageName}Props {}
-
-const ${pageName}: FC<${pageName}Props> = ({}: ${pageName}Props) => {
+`;
+  }
+  if (defaultExports) {
+    str += `
+const ${pageName}: FC${withProps ? `<${pageName}Props>` : ""} = (${
+      withProps ? `{}: ${pageName}Props` : ""
+    }) => {
     return <div>${pageName} page created!</div>;
-}
+};
 export default ${pageName};
 `;
+  } else {
+    str += `
+export const ${pageName}: FC${withProps ? `<${pageName}Props>` : ""} = (${
+      withProps ? `{}: ${pageName}Props` : ""
+    }) => {
+    return <div>${pageName} page created!</div>;
 };
+`;
+  }
+  return str;
+};

bin/create/redux/functions/create-redux.js

 const fs = require("file-system");
 const {
-  actionsTemplateJs,
-  actionsTemplateTs,
-  constantsTemplateJs,
-  constantsTemplateTs,
-  reducersTemplateJs,
-  reducersTemplateTs,
   storeTemplateJs,
@@ -17,2 +11,3 @@ storeTemplateTs,
 } = require("../templates");
+const { config } = require("../../../utils");
 
@@ -28,3 +23,4 @@ /**
 exports.createRedux = (js, ts) => {
-  const path = `src/redux/`;
+  const { reduxRoot } = config;
+  const path = `${reduxRoot}/`;
   if (fs.existsSync(path)) {
@@ -31,0 +27,0 @@ console.log(`${path} already exist`);

bin/delete/component/delete-components.js

 const fs = require("file-system");
+const { config } = require("../../utils");
 
@@ -12,3 +13,5 @@ /**
 exports.deleteComponents = (components, folder) => {
-  const path = folder === "" ? `src/components/` : `src/components/${folder}/`;
+  const { componentsRoot } = config;
+  const path =
+    folder === "" ? `${componentsRoot}/` : `${componentsRoot}/${folder}/`;
   if (components.length === 0 && folder !== "") {
@@ -15,0 +18,0 @@ try {

bin/delete/index.js

 const { deleteComponents } = require("./component");
 const { deletePages } = require("./page");
 const { deleteRedux } = require("./redux");
+const { deleteConfig } = require("./config");
 
@@ -8,1 +9,2 @@ exports.deleteComponents = deleteComponents;
 exports.deleteRedux = deleteRedux;
+exports.deleteConfig = deleteConfig;

bin/delete/page/delete-pages.js

 const fs = require("file-system");
+const { config } = require("../../utils");
 
@@ -12,4 +13,5 @@ /**
 exports.deletePages = (pages, folder) => {
-  const path = folder === "" ? `src/pages/` : `src/pages/${folder}/`;
-  if (screens.length === 0 && folder !== "") {
+  const { pagesRoot } = config;
+  const path = folder === "" ? `${pagesRoot}/` : `${pagesRoot}/${folder}/`;
+  if (pages.length === 0 && folder !== "") {
     try {
@@ -16,0 +18,0 @@ fs.rmdirSync(path);

bin/delete/redux/delete-redux.js

 const fs = require("file-system");
+const { config } = require("../../utils");
 
@@ -10,3 +11,4 @@ /**
 exports.deleteRedux = () => {
-  const path = `src/redux/`;
+  const { reduxRoot } = config;
+  const path = `${reduxRoot}/`;
   try {
@@ -13,0 +15,0 @@ fs.rmdirSync(path);

bin/index.js

 #!/usr/bin/env node
 
 const yargs = require("yargs");
-const fs = require("file-system");
-const { createComponent, createPage, createRedux } = require("./create");
-const { deleteComponents, deletePages, deleteRedux } = require("./delete");
+const {
+  createComponent,
+  createPage,
+  createRedux,
+  createConfig,
+} = require("./create");
+const {
+  deleteComponents,
+  deletePages,
+  deleteRedux,
+  deleteConfig,
+} = require("./delete");
 const { combineComponents, combinePages } = require("./combine");
-const { rootChecker, languageChecker } = require("./utils");
+const { rootChecker, languageChecker, loadConfig } = require("./utils");
 
@@ -35,2 +44,6 @@ yargs
         })
+        .positional("--config", {
+          type: "boolean",
+          describe: "to create config file",
+        })
         .option("js", {
@@ -60,3 +73,6 @@ alias: "javascript",
       if (rootChecker()) {
-        let { component, page, redux, js, ts, folder, template } = argv;
+        let { component, page, redux, config, js, ts, folder, template } = argv;
+        try {
+          loadConfig();
+        } catch (e) {}
         // check if project is written in typescript
@@ -72,2 +88,4 @@ ts = languageChecker() === "ts" ? true : ts;
           createRedux(js, ts);
+        } else if (config) {
+          createConfig();
         } else {
@@ -103,2 +121,6 @@ console.log("Check usage: rhc create --help");
         })
+        .positional("--config", {
+          type: "boolean",
+          describe: "to delete config file",
+        })
         .option("f", {
@@ -113,3 +135,6 @@ alias: "folder",
       if (rootChecker()) {
-        const { component, page, redux, folder } = argv;
+        const { component, page, redux, config, folder } = argv;
+        try {
+          loadConfig();
+        } catch (e) {}
         if (component) {
@@ -121,2 +146,4 @@ deleteComponents(component, folder);
           deleteRedux();
+        } else if (config) {
+          deleteConfig();
         } else {
@@ -159,2 +186,5 @@ console.log("Check usage: rhc delete --help");
         const { components, pages, folder } = argv;
+        try {
+          loadConfig();
+        } catch (e) {}
         if (components) {
@@ -161,0 +191,0 @@ combineComponents(components, folder);

bin/utils/index.js

 const { rootChecker } = require("./root-checker");
 const { languageChecker } = require("./language-checker");
+const { loadConfig } = require("./load-config");
+const { config } = require("./configs");
 
 exports.rootChecker = rootChecker;
 exports.languageChecker = languageChecker;
+exports.loadConfig = loadConfig;
+exports.config = config;

docs/CREATING_FILES.md

@@ -42,3 +42,3 @@ # Creating Files
 ```jsx
-import styles from "./styles.css";
+import "./styles.css";
 
@@ -147,3 +147,3 @@ const TestComponent = () => {
 ```jsx
-import styles from "./styles.css";
+import "./styles.css";
 
@@ -247,3 +247,3 @@ const TestPage = () => {
 ```jsx
-export default function Component() {
+export default function __COMPONENT__() {
   useEffect(() => {}, []);
@@ -261,2 +261,4 @@
 
+- You should type `__COMPONENT__` in the template file and it will be replaced with the component name you want to create.
+
 3. After creating your template you can use them to create components or pages as the following:
@@ -462,1 +464,35 @@
 ```
+
+## Configuration
+
+With the above steps, you can now create a configuration file which will be used by `rhc` to create your files with your custom config.
+
+- To create a default configuration file run:
+
+```sh
+rhc create --config
+```
+
+- This will create a `rhc.config.json` file at the root of your project. The file will contain the following:
+
+```json
+{
+  "withCSS": true,
+  "withFunctions": true,
+  "withProps": true,
+  "defaultExports": true,
+  "componentsRoot": "./src/components",
+  "pagesRoot": "./src/pages",
+  "reduxRoot": "./src/redux"
+}
+```
+
+1. `withCSS`: if true, create `styles.css` file for components and pages, if false, don't create `styles.css` file, default is true.
+2. `withFunctions`: if true, create `functions` folder for pages, if false, don't create `functions` folder, default is true.
+3. `withProps`: if true, create props `interface` for components and pages (in TS only), if false, don't create props `interface`, default is true.
+4. `defaultExports`: if true, create default export for components and pages, if false, create named export for components and pages, default is true.
+5. `componentsRoot`: the root folder for components, default is `./src/components`.
+6. `pagesRoot`: the root folder for pages, default is `./src/pages`.
+7. `reduxRoot`: the root folder for redux, default is `./src/redux`.
+
+- If no configuration file is found or you don't specify some of the configuration, the default configuration will be used.

docs/DELETING_FILES.md

@@ -86,1 +86,17 @@ # Deleting Files
 ```
+
+## Configuration
+
+- To delete a configuration file run:
+
+```sh
+rhc delete --config
+```
+
+- This will delete the `rhc.config.json` file at the root of the project.
+
+- If `rhc.config.json` does not exist, `rhc` will prompt:
+
+```sh
+rhc.config.json does not exist
+```

docs/SUMMARY.md

@@ -79,2 +79,4 @@ # Summary
 
-- This command line can write code in both JavaScript and TypeScript. By default it will use the used language for your React Native project and of course you can override the used language using one of its options.
+- This command line can write code in both JavaScript and TypeScript. By default it will use the used language for your React project and of course you can override the used language using one of its options.
+
+- This command line can be customized by a configuration file that you can create in the root of your project (`rhc.config.json`).

docs/TOC.md

@@ -9,2 +9,3 @@ # Table of Contents
    - [Redux](./CREATING_FILES.md#redux)
+   - [Using configuration](./CREATING_FILES.md#configuration)
 3. [Deleting Files](./DELETING_FILES.md)
@@ -14,2 +15,3 @@ - [Components](./DELETING_FILES.md#components)
    - [Redux](./DELETING_FILES.md#redux)
+   - [Configuration](./DELETING_FILES.md#configuration)
 4. [Combining Files](./COMBINING_FILES.md)
@@ -16,0 +18,0 @@ - [Components](./COMBINING_FILES.md#components)

package.json

 {
   "name": "react-help-create",
-  "version": "2.0.1",
+  "version": "2.2.0",
   "description": "This command line helps you create components, pages and even redux implementation for your react project.",
@@ -5,0 +5,0 @@ "main": "bin/index.js",

README.md

@@ -45,2 +45,8 @@ <p align="center">
 
+- If you want to use it without installing it (using npm cache) run:
+
+```sh
+npx react-help-create --help
+```
+
 # How to use it?
@@ -47,0 +53,0 @@

New alerts

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

75558

15.88%

Number of package files

62

14.81%

Lines of code

1368

25.74%

Number of lines in readme file

58

11.54%

No dependency changes