chore: asset generator

README.md

@@ -0,0 +1,39 @@
+# Devtools-UI
+
+Welcome to Devtools-UI, a monorepo containing a collection of assets packages and an assets plugin designed to be leveraged by [Player-UI](https://player-ui.github.io/).
+
+## Packages
+
+The packages in this repository are designed to be used as assets in Player-UI. Each package is self-contained and can be used independently. They are located in their respective directories under the root of the project.
+
+## Assets Plugin
+
+The assets plugin is a convenient way to use the assets packages in Player-UI. It provides a unified interface for managing and using the assets.
+
+## Getting Started
+
+To get started with Devtools-UI, you need to install the dependencies. We use `pnpm` as the package manager. If you haven't installed it, you can do so by running `npm install -g pnpm`. Then, you can install the dependencies by running `pnpm install`.
+
+## Development
+
+For development, we use Bazel. If you haven't installed it, you can do so by following the instructions on the [Bazel website](https://bazel.build/).
+
+To build the project, you can run `bazel build //...`.
+
+To run the tests, you can run `bazel test //...`.
+
+## Storybook
+
+We use Storybook for developing and showcasing the components. You can start the Storybook server by running `bazel run //docs/storybook:storybook`. Then, you can open your browser and navigate to `localhost:6006` to view the Storybook.
+
+## Generating Assets
+
+We provide a plop generator for creating new assets. You can run it by executing `pnpm run gen:asset`. It will guide you through the process of creating a new asset.
+
+## Contributing
+
+We welcome contributions! If you find something interesting you want to contribute to the repo, feel free to raise a PR, or open an issue for features you'd like to see added.
+
+## License
+
+Devtools-UI is [MIT licensed](./LICENSE).

package.json

@@ -13,7 +13,8 @@
     "lint": "eslint --cache --ext .js,.jsx,.ts,.tsx $(scripts/pkg-roots.sh)",
     "prepare": "is-ci || husky install",
     "test": "bazel test -- $(bazel query \"kind(nodejs_test, //...)\" --output label 2>/dev/null | tr '\\n' ' ')",
-    "pub:local": "scripts/publish-to-verdaccio.sh"
+    "pub:local": "scripts/publish-to-verdaccio.sh",
+    "gen:asset": "plop asset"
   },
   "engines": {
     "node": "^18.18.0",
@@ -92,6 +93,7 @@
     "lz-string": "^1.5.0",
     "mkdirp": "^1.0.4",
     "patch-package": "^6.4.7",
+    "plop": "^4.0.1",
     "prettier": "^2.4.1",
     "react": "^18.2.0",
     "react-docgen-typescript": "^2.2.2",

plopfile.mjs

@@ -0,0 +1,42 @@
+import fs from "fs";
+import path from "path";
+
+export default function (plop) {
+  plop.setActionType("renameFiles", function (answers) {
+    const { assetName } = answers;
+    const basePath = path.resolve(process.cwd(), assetName);
+    fs.renameSync(
+      path.join(basePath, "README.hbs"),
+      path.join(basePath, "README")
+    );
+    fs.renameSync(
+      path.join(basePath, "BUILD.hbs"),
+      path.join(basePath, "BUILD")
+    );
+    return `${assetName}/README and ${assetName}/BUILD have been renamed`;
+  });
+
+  plop.setGenerator("asset", {
+    description: "Create a new asset",
+    prompts: [
+      {
+        type: "input",
+        name: "assetName",
+        message: "Asset name:",
+      },
+    ],
+    actions: [
+      {
+        type: "addMany",
+        destination: "./{{assetName}}",
+        base: "./template",
+        templateFiles: "./template/**/*",
+        globOptions: { dot: true },
+        stripExtension: true,
+      },
+      {
+        type: "renameFiles",
+      },
+    ],
+  });
+}