fix: fixing component generator

tools/workspace-plugin/src/generators/primitive/component/component.spec.ts

@@ -1,12 +1,23 @@
-import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 import { Tree, readProjectConfiguration } from '@nx/devkit';
 
-import { primitiveComponentGeneratorGenerator } from './component';
 import { PrimitiveComponentGeneratorGeneratorSchema } from './schema';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import { primitiveComponentGeneratorGenerator } from './component';
 
 describe('primitive-component-generator generator', () => {
   let tree: Tree;
-  const options: PrimitiveComponentGeneratorGeneratorSchema = { name: 'test' };
+  const options: PrimitiveComponentGeneratorGeneratorSchema = {
+    name: 'test',
+    directory: '',
+    filePath: '',
+    projectName: '',
+    projectSourceRoot: '',
+    projectRoot: '',
+    selector: '',
+    fileName: '',
+    symbolName: '',
+    path: ''
+  };
 
   beforeEach(() => {
     tree = createTreeWithEmptyWorkspace();

tools/workspace-plugin/src/generators/primitive/component/component.ts

@@ -1,10 +1,12 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import * as path from 'path';
 
 import {
   Tree,
   addProjectConfiguration,
   formatFiles,
   generateFiles,
+  joinPathFragments,
 } from '@nx/devkit';
 
 import { PrimitiveComponentGeneratorGeneratorSchema } from './schema';
@@ -13,16 +15,7 @@ export async function primitiveComponentGeneratorGenerator(
   tree: Tree,
   options: PrimitiveComponentGeneratorGeneratorSchema
 ) {
-  // const projectRoot = `libs/${options.name}`;
-  // addProjectConfiguration(tree, options.name, {
-  //   root: projectRoot,
-  //   projectType: 'library',
-  //   sourceRoot: `${projectRoot}/src`,
-  //   targets: {},
-  // });
-  // generateFiles(tree, path.join(__dirname, 'files'), projectRoot, options);
-  // await formatFiles(tree);
-  console.log(tree);
+  // toodo implement component 
 }
 
 export default primitiveComponentGeneratorGenerator;

tools/workspace-plugin/src/generators/primitive/component/files/src/__fileName__.component.template

@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-<%= fileName %>',
+  templateUrl: './<%= fileName %>.component.html',
+  styleUrls: ['./<%= fileName %>.component.scss'],
+})
+export class <%= className %>Component {
+}

tools/workspace-plugin/src/generators/primitive/component/schema.d.ts

@@ -1,3 +1,36 @@
-export interface PrimitiveComponentGeneratorGeneratorSchema {
+export interface BaseAngularComponentSchema {
+  path: string;
+  name?: string;
+  displayBlock?: boolean;
+  inlineStyle?: boolean;
+  inlineTemplate?: boolean;
+  standalone?: boolean;
+  viewEncapsulation?: 'Emulated' | 'None' | 'ShadowDom';
+  changeDetection?: 'Default' | 'OnPush';
+  style?: 'css' | 'scss' | 'sass' | 'less' | 'none';
+  skipTests?: boolean;
+  type?: string;
+  skipImport?: boolean;
+  selector?: string;
+  module?: string;
+  skipSelector?: boolean;
+  export?: boolean;
+  exportDefault?: boolean;
+  prefix?: string;
+  skipFormat?: boolean;
+}
+
+export interface NormalizedComponentSchema extends BaseAngularComponentSchema {
+  directory: string;
+  filePath: string;
+  projectName: string;
+  projectSourceRoot: string;
+  projectRoot: string;
+  selector: string;
+
+  fileName: string;
+  symbolName: string;
+}
+export interface PrimitiveComponentGeneratorGeneratorSchema extends NormalizedComponentSchema {
   name: string;
 }

tools/workspace-plugin/src/generators/primitive/component/schema.json

@@ -1,18 +1,118 @@
 {
   "$schema": "https://json-schema.org/schema",
-  "$id": "PrimitiveComponentGenerator",
-  "title": "",
+  "$id": "Schematics Angular Primitive Component",
+  "title": "Primitive Component Schema",
   "type": "object",
+  "description": "Creates a new Angular Primitive component.",
   "properties": {
-    "name": {
+    "path": {
       "type": "string",
-      "description": "",
+      "description": "The file path to the component. Relative to the current working directory.",
       "$default": {
         "$source": "argv",
         "index": 0
       },
-      "x-prompt": "What name would you like to use?"
+      "x-prompt": "What is the component file path?"
+    },
+    "name": {
+      "type": "string",
+      "description": "The component symbol name. Defaults to the last segment of the file path."
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to the generated component selector.",
+      "alias": "p"
+    },
+    "displayBlock": {
+      "description": "Specifies if the style will contain `:host { display: block; }`.",
+      "type": "boolean",
+      "default": false,
+      "alias": "b"
+    },
+    "inlineStyle": {
+      "description": "Include styles inline in the component.ts file. Only CSS styles can be included inline. By default, an external styles file is created and referenced in the component.ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Include template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "standalone": {
+      "description": "Whether the generated component is standalone.",
+      "type": "boolean",
+      "default": true,
+      "x-priority": "important"
+    },
+    "viewEncapsulation": {
+      "description": "The view encapsulation strategy to use in the new component.",
+      "enum": ["Emulated", "None", "ShadowDom"],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "The change detection strategy to use in the new component.",
+      "enum": ["Default", "OnPush"],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "module": {
+      "type": "string",
+      "description": "The filename or path to the NgModule that will declare this component.",
+      "alias": "m"
+    },
+    "style": {
+      "description": "The file extension or preprocessor to use for style files, or `none` to skip generating the style file.",
+      "type": "string",
+      "default": "css",
+      "enum": ["css", "scss", "sass", "less", "none"]
+    },
+    "skipTests": {
+      "type": "boolean",
+      "description": "Do not create `spec.ts` test files for the new component.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Do not import this component into the owning NgModule.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The HTML selector to use for this component."
+    },
+    "skipSelector": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component should have a selector or not."
+    },
+    "type": {
+      "type": "string",
+      "description": "Adds a developer-defined type to the filename, in the format `name.type.ts`.",
+      "default": "component"
+    },
+    "export": {
+      "type": "boolean",
+      "description": "Specifies if the component should be exported in the declaring `NgModule`. Additionally, if the project is a library, the component will be exported from the project's entry point (normally `index.ts`) if the module it belongs to is also exported or if the component is standalone.",
+      "default": false,
+      "x-priority": "important"
+    },
+    "exportDefault": {
+      "type": "boolean",
+      "default": false,
+      "description": "Use default export for the component instead of a named export."
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false,
+      "x-priority": "internal"
     }
   },
-  "required": ["name"]
-}
+  "required": ["name", "path"]
+}

tools/workspace-plugin/tsconfig.lib.json

@@ -5,6 +5,6 @@
     "declaration": true,
     "types": ["node"]
   },
-  "include": ["src/**/*.ts"],
+  "include": ["src/**/*.ts", "src/generators/primitive/component/files/src/__fileName__.component.template"],
   "exclude": ["jest.config.ts", "src/**/*.spec.ts", "src/**/*.test.ts"]
 }