chore(plop): use templates as in style guide (#4916)

* chore(plop): use templates as in style guide

fix [CE-483]

* chore(plop): export component and add to module

plop-templates/component-controller.js.hbs

@@ -3,4 +3,4 @@ class {{properCase name}}Controller {
   constructor() {}
 }
 
-export default {{properCase name}}Controller;
+export default {{properCase name}}Controller;

plop-templates/component.js.hbs

@@ -1,6 +1,9 @@
-import {{properCase name}}Controller from './{{dashCase name}}/{{camelCase name}}Controller.js'
+import angular from 'angular';
+import controller from './{{dashCase name}}.controller.js'
 
-angular.module('portainer.{{module}}').component('{{camelCase name}}', {
+export const {{camelCase name}} = {
-  templateUrl: './{{camelCase name}}.html',
+  templateUrl: './{{dashCase name}}.html',
-  controller: {{properCase name}}Controller,
+  controller,
-});
+};
+
+angular.module('portainer.{{module}}').component('{{camelCase name}}', {{camelCase name}})

plopfile.js

@@ -25,12 +25,12 @@ module.exports = function (plop) {
       },
       {
         type: 'add',
-        path: `{{cwd}}/{{dashCase name}}/{{camelCase name}}Controller.js`,
+        path: `{{cwd}}/{{dashCase name}}/{{dashCase name}}.controller.js`,
         templateFile: './plop-templates/component-controller.js.hbs',
       },
       {
         type: 'add',
-        path: `{{cwd}}/{{dashCase name}}/{{camelCase name}}.html`,
+        path: `{{cwd}}/{{dashCase name}}/{{dashCase name}}.html`,
         templateFile: './plop-templates/component.html.hbs',
       },
     ], // array of actions