cli: update templates to use new variables and template values

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
2025-02-08 14:14:15 +01:00
parent 68e87d7f4c
commit 401b84e451
36 changed files with 73 additions and 64 deletions
@@ -5,3 +5,5 @@ role: backend-plugin-module
 additionalActions:
  - install-backend
  - add-backend
+templateValues:
+  moduleVar: '{{ camelCase pluginId }}Module{{ upperFirst ( camelCase moduleId ) }}'
@@ -1,5 +1,5 @@
-# {{name}}
+# {{packageName}}

-The {{moduleId}} backend module for the {{id}} plugin.
+The {{moduleId}} backend module for the {{pluginId}} plugin.

 _This plugin was created through the Backstage CLI_
@@ -1,7 +1,7 @@
 {
-  "name": "{{name}}",
-  "description": "The {{moduleId}} backend module for the {{id}} plugin.",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "description": "The {{moduleId}} backend module for the {{pluginId}} plugin.",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -1,6 +1,6 @@
 /***/
 /**
- * The {{moduleId}} backend module for the {{id}} plugin.
+ * The {{moduleId}} backend module for the {{pluginId}} plugin.
 *
 * @packageDocumentation
 */
@@ -4,7 +4,7 @@ import {
 } from '@backstage/backend-plugin-api';

 export const {{moduleVar}} = createBackendModule({
-  pluginId: '{{id}}',
+  pluginId: '{{pluginId}}',
  moduleId: '{{moduleId}}',
  register(reg) {
    reg.registerInit({
@@ -5,3 +5,5 @@ role: backend-plugin
 additionalActions:
  - install-backend
  - add-backend
+templateValues:
+  pluginVar: '{{ camelCase pluginId }}Plugin'
@@ -1,14 +1,14 @@
-# {{id}}
+# {{pluginId}}

 This plugin backend was templated using the Backstage CLI. You should replace this text with a description of your plugin backend.

 ## Installation

-This plugin is installed via the `{{name}}` package. To install it to your backend package, run the following command:
+This plugin is installed via the `{{packageName}}` package. To install it to your backend package, run the following command:

 ```bash
 # From your root directory
-yarn --cwd packages/backend add {{name}}
+yarn --cwd packages/backend add {{packageName}}
 ```

 Then add the plugin to your backend in `packages/backend/src/index.ts`:
@@ -16,7 +16,7 @@ Then add the plugin to your backend in `packages/backend/src/index.ts`:
 ```ts
 const backend = createBackend();
 // ...
-backend.add(import('{{name}}'));
+backend.add(import('{{packageName}}'));
 ```

 ## Development
@@ -11,17 +11,17 @@ import { catalogServiceMock } from '@backstage/plugin-catalog-node/testUtils';
 //
 // Create a new todo item, standalone or for the sample component:
 //
-//   curl http://localhost:7007/api/{{id}}/todos -H 'Content-Type: application/json' -d '{"title": "My Todo"}'
-//   curl http://localhost:7007/api/{{id}}/todos -H 'Content-Type: application/json' -d '{"title": "My Todo", "entityRef": "component:default/sample"}'
+//   curl http://localhost:7007/api/{{pluginId}}/todos -H 'Content-Type: application/json' -d '{"title": "My Todo"}'
+//   curl http://localhost:7007/api/{{pluginId}}/todos -H 'Content-Type: application/json' -d '{"title": "My Todo", "entityRef": "component:default/sample"}'
 //
 // List TODOs:
 //
-//   curl http://localhost:7007/api/{{id}}/todos
+//   curl http://localhost:7007/api/{{pluginId}}/todos
 //
 // Explicitly make an unauthenticated request, or with service auth:
 //
-//   curl http://localhost:7007/api/{{id}}/todos -H 'Authorization: Bearer mock-none-token'
-//   curl http://localhost:7007/api/{{id}}/todos -H 'Authorization: Bearer mock-service-token'
+//   curl http://localhost:7007/api/{{pluginId}}/todos -H 'Authorization: Bearer mock-none-token'
+//   curl http://localhost:7007/api/{{pluginId}}/todos -H 'Authorization: Bearer mock-service-token'

 const backend = createBackend();

@@ -1,6 +1,6 @@
 {
-  "name": "{{name}}",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -17,12 +17,12 @@ describe('plugin', () => {
      features: [{{pluginVar}}],
    });

-    await request(server).get('/api/{{id}}/todos').expect(200, {
+    await request(server).get('/api/{{pluginId}}/todos').expect(200, {
      items: [],
    });

    const createRes = await request(server)
-      .post('/api/{{id}}/todos')
+      .post('/api/{{pluginId}}/todos')
      .send({ title: 'My Todo' });

    expect(createRes.status).toBe(201);
@@ -36,13 +36,13 @@ describe('plugin', () => {
    const createdTodoItem = createRes.body;

    await request(server)
-      .get('/api/{{id}}/todos')
+      .get('/api/{{pluginId}}/todos')
      .expect(200, {
        items: [createdTodoItem],
      });

    await request(server)
-      .get(`/api/{{id}}/todos/${createdTodoItem.id}`)
+      .get(`/api/{{pluginId}}/todos/${createdTodoItem.id}`)
      .expect(200, createdTodoItem);
  });

@@ -71,7 +71,7 @@ describe('plugin', () => {
    });

    const createRes = await request(server)
-      .post('/api/{{id}}/todos')
+      .post('/api/{{pluginId}}/todos')
      .send({ title: 'My Todo', entityRef: 'component:default/my-component' });

    expect(createRes.status).toBe(201);
@@ -12,7 +12,7 @@ import { createTodoListService } from './services/TodoListService';
 * @public
 */
 export const {{pluginVar}} = createBackendPlugin({
-  pluginId: '{{id}}',
+  pluginId: '{{pluginId}}',
  register(env) {
    env.registerInit({
      deps: {
@@ -1,5 +1,5 @@
-# {{name}}
+# {{packageName}}

-Welcome to the common package for the {{id}} plugin!
+Welcome to the common package for the {{pluginId}} plugin!

 _This plugin was created through the Backstage CLI_
@@ -1,7 +1,7 @@
 {
-  "name": "{{name}}",
-  "description": "Common functionalities for the {{id}} plugin",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "description": "Common functionalities for the {{pluginId}} plugin",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -1,6 +1,6 @@
 /***/
 /**
- * Common functionalities for the {{id}} plugin.
+ * Common functionalities for the {{pluginId}} plugin.
 *
 * @packageDocumentation
 */
@@ -1,5 +1,5 @@
-# {{name}}
+# {{packageName}}

-Welcome to the Node.js library package for the {{id}} plugin!
+Welcome to the Node.js library package for the {{pluginId}} plugin!

 _This plugin was created through the Backstage CLI_
@@ -1,7 +1,7 @@
 {
-  "name": "{{name}}",
-  "description": "Node.js library for the {{id}} plugin",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "description": "Node.js library for the {{pluginId}} plugin",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -1,6 +1,6 @@
 /***/
 /**
- * Node.js library for the {{id}} plugin.
+ * Node.js library for the {{pluginId}} plugin.
 *
 * @packageDocumentation
 */
@@ -5,3 +5,6 @@ role: frontend-plugin
 additionalActions:
  - install-frontend
  - add-frontend-legacy
+templateValues:
+  pluginVar: '{{ camelCase pluginId }}Plugin'
+  extensionName: '{{ upperFirst ( camelCase pluginId ) }}Page'
@@ -1,12 +1,12 @@
-# {{id}}
+# {{pluginId}}

-Welcome to the {{id}} plugin!
+Welcome to the {{pluginId}} plugin!

 _This plugin was created through the Backstage CLI_

 ## Getting started

-Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/{{id}}](http://localhost:3000/{{id}}).
+Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/{{pluginId}}](http://localhost:3000/{{pluginId}}).

 You can also serve the plugin in isolation by running `yarn start` in the plugin directory.
 This method of serving the plugin provides quicker iteration speed and a faster startup and hot reloads.
@@ -7,6 +7,6 @@ createDevApp()
  .addPage({
    element: <{{ extensionName }} />,
    title: 'Root Page',
-    path: '/{{ id }}',
+    path: '/{{pluginId}}',
  })
  .render();
@@ -1,6 +1,6 @@
 {
-  "name": "{{name}}",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -23,7 +23,7 @@ describe('ExampleComponent', () => {
  it('should render', async () => {
    await renderInTestApp(<ExampleComponent />);
    expect(
-      screen.getByText('Welcome to {{ id }}!'),
+      screen.getByText('Welcome to {{pluginId}}!'),
    ).toBeInTheDocument();
  });
 });
@@ -13,7 +13,7 @@ import { ExampleFetchComponent } from '../ExampleFetchComponent';

 export const ExampleComponent = () => (
  <Page themeId="tool">
-    <Header title="Welcome to {{ id }}!" subtitle="Optional subtitle">
+    <Header title="Welcome to {{pluginId}}!" subtitle="Optional subtitle">
      <HeaderLabel label="Owner" value="Team X" />
      <HeaderLabel label="Lifecycle" value="Alpha" />
    </Header>
@@ -1,6 +1,6 @@
 import { {{ pluginVar }} } from './plugin';

-describe('{{ id }}', () => {
+describe('{{pluginId}}', () => {
  it('should export plugin', () => {
    expect({{ pluginVar }}).toBeDefined();
  });
@@ -6,7 +6,7 @@ import {
 import { rootRouteRef } from './routes';

 export const {{ pluginVar }} = createPlugin({
-  id: '{{ id }}',
+  id: '{{pluginId}}',
  routes: {
    root: rootRouteRef,
  },
@@ -1,5 +1,5 @@
 import { createRouteRef } from '@backstage/core-plugin-api';

 export const rootRouteRef = createRouteRef({
-  id: '{{ id }}',
+  id: '{{pluginId}}',
 });
@@ -1,5 +1,5 @@
-# {{name}}
+# {{packageName}}

-Welcome to the web library package for the {{id}} plugin!
+Welcome to the web library package for the {{pluginId}} plugin!

 _This plugin was created through the Backstage CLI_
@@ -1,7 +1,7 @@
 {
-  "name": "{{name}}",
-  "description": "Web library for the {{id}} plugin",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "description": "Web library for the {{pluginId}} plugin",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -1,6 +1,6 @@
 /***/
 /**
- * Web library for the {{id}} plugin.
+ * Web library for the {{pluginId}} plugin.
 *
 * @packageDocumentation
 */
@@ -1,4 +1,4 @@
-# {{name}}
+# {{packageName}}

 _This package was created through the Backstage CLI_.

@@ -8,5 +8,5 @@ Install the package via Yarn:

 ```sh
 cd <package-dir> # if within a monorepo
-yarn add {{name}}
+yarn add {{packageName}}
 ```
@@ -1,6 +1,6 @@
 {
-  "name": "{{name}}",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -4,6 +4,8 @@ targetPath: plugins
 role: backend-plugin-module
 params:
  pluginId: scaffolder
+templateValues:
+  moduleVar: '{{ camelCase pluginId }}Module{{ upperFirst ( camelCase moduleId ) }}'
 additionalActions:
  - install-backend
  - add-backend
@@ -1,4 +1,4 @@
-# {{name}}
+# {{packageName}}

 The {{moduleId}} module for [@backstage/plugin-scaffolder-backend](https://www.npmjs.com/package/@backstage/plugin-scaffolder-backend).

@@ -1,7 +1,7 @@
 {
-  "name": "{{name}}",
+  "name": "{{packageName}}",
  "description": "The {{moduleId}} module for @backstage/plugin-scaffolder-backend",
-  "version": "{{pluginVersion}}",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",
@@ -1,4 +1,4 @@
-# {{name}}
+# {{packageName}}

 _This package was created through the Backstage CLI_.

@@ -8,5 +8,5 @@ Install the package via Yarn:

 ```sh
 cd <package-dir> # if within a monorepo
-yarn add {{name}}
+yarn add {{packageName}}
 ```
@@ -1,6 +1,6 @@
 {
-  "name": "{{name}}",
-  "version": "{{pluginVersion}}",
+  "name": "{{packageName}}",
+  "version": "{{packageVersion}}",
  "main": "src/index.ts",
  "types": "src/index.ts",
  "license": "{{license}}",