diff --git a/README.md b/README.md
index c25f326..3682030 100644
--- a/README.md
+++ b/README.md
@@ -1,25 +1,38 @@
-# cumulocity-reminder-plugin
+# Cumulocity IoT UI Critical Alarm Reminder Plugin
+
+[](https://github.com/SoftwareAG/cumulocity-reminder-plugin/actions/workflows/test.yml)
---
-[](https://github.com/SoftwareAG/cumulocity-reminder-plugin/actions/workflows/test.yml)
+## Features
+
+### Reminders
_TBD_
-| C8Y | Plugin |
-| ----: | ------: |
-| ^1020 | v1 |
-| 1018 | v0 |
-| 1017 | v0 |
+### Notifications
----
+_TBD_
+
+### Reminder Type Config
+
+Selectable reminder types can be configured using the tenant option – best using the [Tenant Option Manager Plugin](https://github.com/SoftwareAG/cumulocity-tenant-option-management-plugin) –, using the configuration as described below. Per default, no config is set and the type selection hidden.
+
+
+Reminder type filter – available to the user, accessible from within the reminder drawer –, and display of types on reminder items.
-## Reminder Type Config
+
+The reminder type field is shown, within the reminder creation dialog, when types are configured.
-| Key | Value | Info |
-| -------- | -------------- | ---- |
-| categroy | `c8y.reminder` | |
-| key | `types` | |
+| Fragment | Type | Info |
+| -------- | :----: | ------------------------------------------------------------------------------------------------------------------------------------ |
+| `id` | string | Any unique string value, used to reference the filter, when saved in local storage. Not displayed to the user. As short as possible. |
+| `name` | string | Human-readable label for the reminder type, displayed to the user. |
+
+
+Tenant option config: Category `c8y.reminder`, Key `types`.
+
+##### Example Config
```json
[
@@ -38,6 +51,53 @@ _TBD_
]
```
+### User Configuraion
+
+_TBD_
+
+---
+
+
+
+## Local Development
+
+### Recommended version
+
+| C8Y | Plugin | Versions |
+| ----: | ------: | ------------------------------------ |
+| ^1020 | v1 | node v18.x, npm v10.x, Angular v17.x |
+| 1018 | v0 | |
+| 1017 | v0 | node v16.x, npm v9.x, Angular v14.x |
+
+### How to start
+
+Change the target tenant and application you want to run this plugin on in the `package.json`.
+
+```bash
+ng serve -u https://{{your-tenant}}.cumulocity.com/ --shell {{cockpit}}
+```
+
+Keep in mind that this plugin needs to have an app (e.g. cockpit) running with at least the same version as this plugin. if your tenant contains an older version, use the c8ycli to create a cockpit clone running with **at least version 1016.0.59**! Upload this clone to the target tenant (e.g. cockpit-1016) and reference this name in the `--shell` command.
+
+The widget plugin can be locally tested via the start script:
+
+```bash
+npm start
+```
+
+In the Module Federation terminology, `widget` plugin is called `remote` and the `cockpit` is called `shell`. Modules provided by this `widget` will be loaded by the `cockpit` application at the runtime. This plugin provides a basic custom widget that can be accessed through the `Add widget` menu.
+
+> Note that the `--shell` flag creates a proxy to the cockpit application and provides `ReminderPluginModule` as an `remote` via URL options.
+
+Also deploying needs no special handling and can be simply done via `npm run deploy`. As soon as the application has exports it will be uploaded as a plugin.
+
---
## Useful links
diff --git a/_media/type-create-reminder.png b/_media/type-create-reminder.png
new file mode 100644
index 0000000..23586fb
Binary files /dev/null and b/_media/type-create-reminder.png differ
diff --git a/_media/type-filter.png b/_media/type-filter.png
new file mode 100644
index 0000000..b3db3b3
Binary files /dev/null and b/_media/type-filter.png differ
diff --git a/_media/type-tenant-options.png b/_media/type-tenant-options.png
new file mode 100644
index 0000000..a1e4d50
Binary files /dev/null and b/_media/type-tenant-options.png differ
diff --git a/package-lock.json b/package-lock.json
index bd3cef7..55306f2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "cumulocity-reminder-plugin",
- "version": "1.3.2",
+ "version": "1.3.3",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "cumulocity-reminder-plugin",
- "version": "1.3.2",
+ "version": "1.3.3",
"license": "Apache-2.0",
"dependencies": {
"@angular/animations": "^17.3.0",
diff --git a/package.json b/package.json
index ff20b31..2fa9edb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "cumulocity-reminder-plugin",
- "version": "1.3.2",
+ "version": "1.3.3",
"description": "",
"scripts": {
"start": "ng serve -u https://psfactory.eu-latest.cumulocity.com",
diff --git a/src/app/reminder-plugin/components/reminder-drawer/reminder-drawer.component.ts b/src/app/reminder-plugin/components/reminder-drawer/reminder-drawer.component.ts
index a31ed18..2f5c5fc 100644
--- a/src/app/reminder-plugin/components/reminder-drawer/reminder-drawer.component.ts
+++ b/src/app/reminder-plugin/components/reminder-drawer/reminder-drawer.component.ts
@@ -145,17 +145,18 @@ export class ReminderDrawerComponent implements OnDestroy {
if (!this.reminders.length) return;
// check if a reminder is new in a group
- this.reminderGroups.forEach((group, index) => {
- group.reminders.forEach((reminder) => {
- if (!this._previousState[index]?.includes(reminder.id)) {
- reminder.changed = true;
- setTimeout(
- () => delete reminder.changed,
- REMINDER_HIGHLIGHT_DURATION_SECONDS * 1000
- );
- }
+ if (this._previousState.length)
+ this.reminderGroups.forEach((group, index) => {
+ group.reminders.forEach((reminder) => {
+ if (!this._previousState[index]?.includes(reminder.id)) {
+ reminder.changed = true;
+ setTimeout(
+ () => delete reminder.changed,
+ REMINDER_HIGHLIGHT_DURATION_SECONDS * 1000
+ );
+ }
+ });
});
- });
// store current state for future comparison
this._previousState = this.reminderGroups.map((group) => {