Experience-Monks / react-ui

Repository for public react components in Jam3
https://jam3.github.io/react-ui/
MIT License
5 stars 3 forks source link

Copy Component Utility Improvements #50

Closed grez96 closed 3 years ago

grez96 commented 3 years ago

Support for custom config file Configuration no longer needs to be defined in projects package.json (although this still works for backwards compatibility). The recommended approach is to define a .react-uirc.json file which will hold the configuration data. For example, .react-uirc.json:

{
  "eject": true,
  "eject-path": "./src/components",
  "components": [
    "VideoPlayer"
  ]
}

This functionality was achieved by rewriting the getProjectPackageData function as getProjectConfigData which will look for configuration data in the .react-urci.json file in the projects root directory, will default to package.json if .react-uirc.json does not exist.

Support for renaming ejected components Component configuration data can now be defined in advanced mode. Currently the only supported properties in advanced mode are: name and newName. These new properties will allow you to define a custom name for your ejected components. For example, .react-uirc.json:

{
  "eject": true,
  "eject-path": "./src/components",
  "components": [
    {
      "name": "BaseButton",
      "newName": "PillButton"
    },
    "VideoPlayer"
  ]
}

The above configuration will eject the BaseButton component and rename all occurrences of BaseButton to PillButton. It will also eject VideoPlayer component but will keep its original naming.

This functionality is achieved by:

  1. Update validatePackageComponentList to support new structure and properties.
  2. Convert simple configuration to advanced configuration with function unifyComponentsSimpleConfigToAdvanced. Using a single configuration type simplifies code logic.
  3. Renaming. This is done by copying the react-ui component into a temporary/intermediary folder. Then the files that have the old components name in them, are renamed to use the new components name. Then inside each of these files, change all occurrences of the old components name with the new components name. createRenamedIntermediary
  4. Use the output of the createRenamedIntermediary with the gitMergeFileUtility, or use the original react-ui component if NO new name is defined.
  5. Delete the temporary/intermediary folder.

Better Versioning Currently the copy-component utility runs when it detects a version mismatch between the react-ui package.json version and the ejected components meta version file. The problem is that all components will share the same version number when ejected (the current version of react-ui), causing redundant operation of the copy utility.

Now each react-ui component will store and track its own .ReactUIMetaVersion file. This will decouple an individuals components version from the base react-ui package version.

notes Thoroughly tested the script.

iranreyes commented 3 years ago

To load the config files in the future you can use https://www.npmjs.com/package/cosmiconfig, a well-standardized way to load config files from the package.json or setting files.

grez96 commented 3 years ago

To load the config files in the future you can use https://www.npmjs.com/package/cosmiconfig, a well-standardized way to load config files from the package.json or setting files.

Amazing suggestion! I have updated the getProjectConfigData function to use cosmiconfig and it's a lot cleaner and simpler now. 👍