Release 3.35.0

Author: sleidig

build/Dockerfile

@@ -70,7 +70,7 @@ RUN if [ "$SENTRY_AUTH_TOKEN" != "" ] ; then \
 
 ### PROD image
 
-FROM nginx:1.25.4-alpine
+FROM nginx:1.25.5-alpine
 COPY ./build/default.conf /etc/nginx/templates/default.conf
 COPY --from=builder /app/dist/ /usr/share/nginx/html
 # The port on which the app will run in the Docker container

doc/compodoc_sources/how-to-guides/create-custom-view.md

@@ -0,0 +1,64 @@
+# How to create a custom View Component
+We aim to build flexible, reusable components.
+If you implement a custom component using the building blocks of Aam Digital's platform, this can seamlessly be displayed both in modal forms and as a fullscreen view.
+
+## Architecture & Generic wrapper components
+The following architecture allows you to implement components that only have `@Input` properties
+and do not access either Route or Dialog data directly.
+Instead, the platform always uses `RoutedViewComponent` or `DialogViewComponent` to parse such context and pass it into your component as simple Angular @Inputs.
+
+![](../../images/routed-views.png)
+
+If you implement a special view to display a single entities' details, you should also extend `AbstractEntityDetailsComponent` with your component.
+This takes care of loading the entity from the database, in case it is passed in as an id from the URL.
+
+## Implementing a custom view Component
+
+1. Create a new component class
+2. Add any `@Input()` properties for values that are provided from the config.
+3. For EntityDetails views, you get access to an `@Input() entity` and `@Input() entityConstructor` via the `AbstractEntityDetailsComponent` automatically. Otherwise, you do not have to extend from this.
+4. Use `<app-view-title>` and `<app-view-actions>` in your template to wrap the elements (if any) that you want to display as a header and action buttons.
+These parts are automatically placed differently in the layout depending on whether your component is display as a fullscreen, routed view (actions displayed top right) or as a dialog/modal (actions displayed fixed at bottom).
+5. Register your component under a name (string) with the `ComponentRegistry` (usually we do this in one of the modules), so that it can be referenced under this string form the config.
+6. You can then use it in config, as shown below.
+
+Example template for a custom view component:
+```html
+<app-view-title>
+  <!-- the title is specially fixed and receives a back button or dialog close -->
+  My Entity {{ entity.name }}
+</app-view-title>
+
+<!-- anything in the template not specially marked/wrapped is used as main content -->
+<div>
+  My Custom View Content
+</div>
+
+<app-view-actions>
+  <!-- some action buttons, e.g. using the app-dialog-buttons or anything else -->
+  <app-dialog-buttons [form]="form" [entity]="entity"></app-dialog-buttons>
+</app-view-actions>
+```
+
+An example config for the above:
+```json
+{
+  "component": "MyView",
+  "config": { "showDescription": true } 
+}
+```
+
+Use the `ComponentRegistry` to register your component,
+e.g. in its Module:
+```javascript
+export class MyModule {
+  constructor(components: ComponentRegistry) {
+    components.addAll([
+      [
+        "MyView", // this is the name to use in the config document 
+        () => import("./my-view/my-view.component").then((c) => c.MyViewComponent),
+      ],
+    ]);
+  }
+}
+```

doc/compodoc_sources/how-to-guides/create-entity-details-panel.md

@@ -21,6 +21,7 @@ Those background details aside, what that means for your implementation is:
 (e.g. `@Input() showDescription: boolean;`, which you can use in your template or code to adapt the component.)
 These values are automatically set to whatever value is specified in the config object for your component at runtime in the database.
 4. Register the new component in its parent module, so that it can be loaded under its name through the config.
+   (for details see [Create a custom View Component](./create-a-custom-view-component.html))
 
 An example config for the above:
 ```json
@@ -29,18 +30,3 @@ An example config for the above:
   "config": { "showDescription": true } 
 }
 ```
-
-Use the `ComponentRegistry` to register your component,
-e.g. in its Module:
-```javascript
-export class MyModule {
-  constructor(components: ComponentRegistry) {
-    components.addAll([
-      [
-        "MySubView", // this is the name to use in the config document 
-        () => import("./my-sub-view/my-sub-view.component").then((c) => c.MySubViewComponent),
-      ],
-    ]);
-  }
-}
-```

doc/compodoc_sources/summary.json

@@ -119,6 +119,10 @@
         "title": "Create a New Entity Type",
         "file": "how-to-guides/create-new-entity-type.md"
       },
+      {
+        "title": "Create a custom View Component",
+        "file": "how-to-guides/create-custom-view.md"
+      },
       {
         "title": "Create an Entity Details Panel",
         "file": "how-to-guides/create-entity-details-panel.md"

doc/images/routed-views.png

@@ -38,19 +38,19 @@
     "@casl/angular": "^8.2.3",
     "@faker-js/faker": "^8.4.0",
     "@fortawesome/angular-fontawesome": "^0.14.1",
-    "@fortawesome/fontawesome-svg-core": "^6.5.1",
-    "@fortawesome/free-regular-svg-icons": "^6.5.1",
-    "@fortawesome/free-solid-svg-icons": "^6.5.1",
+    "@fortawesome/fontawesome-svg-core": "^6.5.2",
+    "@fortawesome/free-regular-svg-icons": "^6.5.2",
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
     "@ngneat/until-destroy": "^10.0.0",
-    "@sentry/browser": "^7.102.0",
+    "@sentry/browser": "^7.108.0",
     "angulartics2": "^12.2.1",
     "assert": "^2.1.0",
     "crypto-es": "^2.1.0",
     "deep-object-diff": "^1.1.9",
     "hammerjs": "^2.0.8",
     "json-query": "^2.2.2",
     "keycloak-angular": "^15.1.0",
-    "keycloak-js": "^24.0.1",
+    "keycloak-js": "^24.0.2",
     "leaflet": "^1.9.4",
     "lodash-es": "^4.17.21",
     "md5": "^2.3.0",