update readme

Author: ck-c8y

README.md

@@ -1,4 +1,4 @@
-# Cumulocity Operation Button Widget Plugin
+# Cumulocity Operation Widget
 
 ## Purpose
 

cumulocity.config.ts

@@ -7,10 +7,11 @@ export default {
     description,
     version,
     name,
-      key: 'c8y-pkg-widget-operation-button-key',
+      key: 'c8y-pkg-operation-widget-key',
     contentSecurityPolicy:
       "base-uri 'none'; default-src 'self' 'unsafe-inline' http: https: ws: wss:; connect-src 'self' http: https: ws: wss:;  script-src 'self' *.bugherd.com *.twitter.com *.twimg.com *.aptrinsic.com 'unsafe-inline' 'unsafe-eval' data:; style-src * 'unsafe-inline' blob:; img-src * data: blob:; font-src * data:; frame-src *; worker-src 'self' blob:;",
     dynamicOptionsUrl: true,
+    contextPath: 'c8y-pkg-operation-button-widget',
     remotes: {
       [name]: ['OperationButtonWidgetModule']
     },
@@ -20,7 +21,7 @@ export default {
     license,
     exports: [
       {
-        name: "Operation Button Widget Plugin",
+        name: "Operation Button Widget",
         module: 'OperationButtonWidgetModule',
         path: './src/app/index.ts',
         readmePath: './src/app/README.md',

src/app/README.md

@@ -1,26 +1,10 @@
-# SAMPLE-PLUGIN Readme Example
+# Cumulocity Operation Widget
 
-## Adding a Readme File to Your Plugin
+## Purpose
 
-Follow these steps to include a readme file in your plugin:
+This widget plugin allows you to send operations to a selected device in Cumulocity. Key features include:
 
-1. Add the `readmePath` property to the `exports` array in your `cumulocity.config.ts` file.
-2. Place the readme file in the same folder as your `index.ts` file.
-
-### Example
-
-```ts
-exports: [
-  {
-    name: 'Example sample plugin view',
-    module: 'OperationButtonWidgetModule',
-    path: './src/app/index.ts',
-    readmePath: './src/app/README.md',
-    description: 'Adds a custom widget and navigator node to the shell application'
-  }
-];
-```
-
-### What Happens When You Build?
-
-When you build your plugin (e.g., by running `ng build sample-plugin`), the generated zip file will include the readme file. It will be placed in a folder named after your module, such as `SamplePluginModule` or `OperationButtonWidgetModule`.
+- **Device Selection**: Choose a target device to send operations to
+- **Configurable Parameters**: Define custom parameters for each operation
+- **Dynamic UI**: Update parameter values directly in the UI when invoking the operation
+- **Easy Integration**: Install as a plugin to any Cumulocity application

src/app/index.ts

@@ -7,15 +7,15 @@ import {
   importConfigWithDevice
 } from '@c8y/ngx-components/widgets/import-export-config';
 import { assetPaths } from '../assets/assets';
-import { OperationButtonComponent } from './operation-button-widget/widget/operation-button.component';
-import { OperationButtonConfigComponent } from './operation-button-widget/widget-config/operation-button-config.component';
+import { OperationWidgetComponent } from './operation-widget/widget/operation-widget.component';
+import { OperationWidgetConfigComponent } from './operation-widget/widget-config/operation-widget-config.component';
 
 export const samplePluginWidgetDefinition = {
     id: 'operation-button-widget',
     label: 'Operation Button Widget',
   description: gettext('Widget to create an operation'),
-  component: OperationButtonComponent,
-  configComponent: OperationButtonConfigComponent,
+  component: OperationWidgetComponent,
+  configComponent: OperationWidgetConfigComponent,
   previewImage: assetPaths.previewImage,
   data: {
     schema: () =>

…-instance/button-instance.component.html …t/button/operation-button.component.htmlsrc/app/operation-button-widget/button-instance/button-instance.component.html renamed to src/app/operation-widget/button/operation-button.component.html src/app/operation-button-widget/button-instance/button-instance.component.html renamed to src/app/operation-widget/button/operation-button.component.html

@@ -1,3 +1,4 @@
+
 <button
   class="btn"
   [ngClass]="classes"

…on-instance/button-instance.component.ts …get/button/operation-button.component.tssrc/app/operation-button-widget/button-instance/button-instance.component.ts renamed to src/app/operation-widget/button/operation-button.component.ts src/app/operation-button-widget/button-instance/button-instance.component.ts renamed to src/app/operation-widget/button/operation-button.component.ts

@@ -8,20 +8,20 @@ import {
   Output,
   TemplateRef,
 } from '@angular/core';
-import { IOperationButtonConfig } from '../models/IOperationButtonConfig';
+import { IOperationButtonConfig } from '../models/operation-widget-model';
 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
 import { CommonModule, NgClass } from '@angular/common';
 import { IconDirective } from '@c8y/ngx-components';
 
 @Component({
-  selector: 'app-button-instance',
-  templateUrl: './button-instance.component.html',
+  selector: 'app-operation-button',
+  templateUrl: './operation-button.component.html',
   standalone: true,
   imports: [
     CommonModule, NgClass, IconDirective
   ]
 })
-export class ButtonInstanceComponent implements OnInit, OnChanges {
+export class OperationButtonComponent implements OnInit, OnChanges {
   @Input() config: IOperationButtonConfig = {
     buttonLabel: '',
     operationFragment: '',

…-widget/models/IOperationButtonConfig.ts …-widget/models/operation-widget-model.tssrc/app/operation-button-widget/models/IOperationButtonConfig.ts renamed to src/app/operation-widget/models/operation-widget-model.ts src/app/operation-button-widget/models/IOperationButtonConfig.ts renamed to src/app/operation-widget/models/operation-widget-model.ts

@@ -74,7 +74,7 @@
                   'btn btn-default dropdown-toggle c8y-dropdown ' +
                   (item.buttonSize || 'btn-warning')
                 ">
-                  <span><i [c8yIcon]="item.icon"></i>
+                  <span><i [c8yIcon]="item.buttonIcon"></i>
                     {{
                     item.buttonSize ? item.buttonSize : 'Choose size'
                     }}</span>
@@ -263,6 +263,6 @@
   </div>
 
   <ng-template #sampleWidgetPreview>
-    <app-operation-button-widget [config]="config"></app-operation-button-widget>
+    <app-operation-widget [config]="config"></app-operation-widget>
   </ng-template>
 </div>