shared db at design- and runtime

Bumps the production-dependencies group with 2 updates: [@sap/cds](https://cap.cloud.sap/) and [@cap-js-community/odata-v2-adapter](https://github.com/cap-js-community/odata-v2-adapter).


Updates `@sap/cds` from 7.7.3 to 7.8.1

Updates `@cap-js-community/odata-v2-adapter` from 1.12.7 to 1.12.8
- [Release notes](https://github.com/cap-js-community/odata-v2-adapter/releases)
- [Changelog](https://github.com/cap-js-community/odata-v2-adapter/blob/main/CHANGELOG.md)
- [Commits](https://github.com/cap-js-community/odata-v2-adapter/compare/v1.12.7...v1.12.8)

---
updated-dependencies:
- dependency-name: "@sap/cds"
  dependency-type: direct:production
  update-type: version-update:semver-minor
  dependency-group: production-dependencies
- dependency-name: "@cap-js-community/odata-v2-adapter"
  dependency-type: direct:production
  update-type: version-update:semver-patch
  dependency-group: production-dependencies
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

.github/dependabot.yml

@@ -5,4 +5,13 @@ updates:
   directory: /
   versioning-strategy: increase-if-necessary
   schedule:
-    interval: daily
+    interval: weekly
+  groups:
+    production-dependencies:
+      dependency-type: "production"
+    development-dependencies:
+      dependency-type: "development"
+  ignore:
+    - dependency-name: "chai"
+        # chai 5 doesn't work atm w/ cds.test, TODO fix that in cds.test
+      versions: ["5.x"]

.github/workflows/node.js.yml

@@ -16,7 +16,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [18.x, 16.x]
+        node-version: [20.x, 18.x]
 
     steps:
     - uses: actions/checkout@v2
@@ -24,6 +24,5 @@ jobs:
       uses: actions/setup-node@v1
       with:
         node-version: ${{ matrix.node-version }}
-    - run: npm i -g npm@8
     - run: npm ci
     - run: npm test

.gitignore

@@ -21,4 +21,5 @@ reviews/db/test.db
 *.sqlite
 *.db
 
-**/@types
+@types/
+@cds-models/

.vscode/extensions.json

@@ -4,13 +4,11 @@
 
 	// List of extensions which should be recommended for users of this workspace.
 	"recommendations": [
+		"qwtel.sqlite-viewer",
 		"sapse.vscode-cds",
 		"dbaeumer.vscode-eslint",
-		"esbenp.prettier-vscode",
 		"mechatroner.rainbow-csv",
 		"humao.rest-client",
-		"alexcvzz.vscode-sqlite",
-		"hbenl.vscode-mocha-test-adapter",
 		"sdras.night-owl",
 		"vsls-contrib.codetour"
 	],

.vscode/settings.json

@@ -14,8 +14,6 @@
       "**/odata-v4/okra/**"
     ]
   },
-  "mochaExplorer.debuggerConfig": "Debug Mocha Tests",
-  "mochaExplorer.parallel": true,
   "eslint.probe": [
     "cds",
     "csn",

README.md

@@ -1,10 +1,16 @@
 # Welcome to cap/samples
 
-Find here a collection of samples for the [SAP Cloud Application Programming Model](https://cap.cloud.sap) organized in a simplistic [monorepo setup](samples.md#all-in-one-monorepo). → See [**Overview** of contained samples](samples.md)
+Find here a collection of samples for the [SAP Cloud Application Programming Model](https://cap.cloud.sap) organized in a simplistic [monorepo setup](samples.md#all-in-one-monorepo).
+
+[See **Overview** of contained samples](samples.md):
+
+![](etc/samples.drawio.svg)
 
 ![](https://github.com/SAP-samples/cloud-cap-samples/workflows/CI/badge.svg)
 [![REUSE status](https://api.reuse.software/badge/github.com/SAP-samples/cloud-cap-samples)](https://api.reuse.software/info/github.com/SAP-samples/cloud-cap-samples)
 
+
+
 ### Preliminaries
 
 1. Ensure you have the latest LTS version of Node.js installed (see [Getting Started](https://cap.cloud.sap/docs/get-started/))

bookshop/cds-plugin.js

@@ -1,3 +0,0 @@
-cds.once('bootstrap',(app)=>{
-  app.serve ('/bookshop') .from ('@capire/bookshop','app/vue')
-})

bookshop/db/schema.cds

@@ -2,25 +2,25 @@ using { Currency, managed, sap } from '@sap/cds/common';
 namespace sap.capire.bookshop;
 
 entity Books : managed {
-  key ID : Integer;
+  key ID   : Integer;
-  title  : localized String(111) @mandatory ;
+  title    : localized String(111)  @mandatory;
-  descr  : localized String(1111);
+  descr    : localized String(1111);
-  author : Association to Authors @mandatory;
+  author   : Association to Authors @mandatory;
-  genre  : Association to Genres;
+  genre    : Association to Genres;
-  stock  : Integer;
+  stock    : Integer;
-  price  : Decimal;
+  price    : Decimal;
   currency : Currency;
-  image : LargeBinary @Core.MediaType : 'image/png';
+  image    : LargeBinary @Core.MediaType: 'image/png';
 }
 
 entity Authors : managed {
-  key ID : Integer;
+  key ID       : Integer;
-  name   : String(111) @mandatory;
+  name         : String(111) @mandatory;
   dateOfBirth  : Date;
   dateOfDeath  : Date;
   placeOfBirth : String;
   placeOfDeath : String;
-  books  : Association to many Books on books.author = $self;
+  books        : Association to many Books on books.author = $self;
 }
 
 /** Hierarchically organized Code List for Genres */

bookshop/package.json

@@ -13,20 +13,12 @@
     "@cap-js/sqlite": "*"
   },
   "dependencies": {
-    "@sap/cds": ">=5.9",
+    "@sap/cds": "^7",
-    "express": "^4.17.1",
+    "express": "^4.17.1"
-    "passport": ">=0.4.1"
   },
   "scripts": {
     "genres": "cds serve test/genres.cds",
-    "start": "cds run",
+    "start": "cds-serve",
     "watch": "cds watch"
-  },
-  "cds": {
-    "requires": {
-      "bookshop-services": {
-        "model": "@capire/bookshop"
-      }
-    }
   }
 }

bookshop/readme.md

@@ -20,12 +20,12 @@ npm run watch
 
 | Links to capire                                                                                           | Sample files / folders               |
 | --------------------------------------------------------------------------------------------------------- | ------------------------------------ |
-| [Project Setup & Layouts](https://cap.cloud.sap/docs/get-started/projects#sharing-and-reusing-content)    | [`./`](./)                           |
+| [Project Setup & Layouts](https://cap.cloud.sap/docs/get-started/jumpstart#project-structure)             | [`./`](./)                           |
-| [Domain Modeling with CDS](https://cap.cloud.sap/docs/guides/domain-models)                               | [`./db/schema.cds`](./db/schema.cds) |
+| [Domain Modeling with CDS](https://cap.cloud.sap/docs/guides/domain-modeling)                               | [`./db/schema.cds`](./db/schema.cds) |
-| [Defining Services](https://cap.cloud.sap/docs/guides/services#defining-services)                         | [`./srv/*.cds`](./srv)               |
+| [Defining Services](https://cap.cloud.sap/docs/guides/providing-services#modeling-services)               | [`./srv/*.cds`](./srv)               |
-| [Single-purposed Services](https://cap.cloud.sap/docs/guides/services#single-purposed-services)           | [`./srv/*.cds`](./srv)               |
+| [Single-purposed Services](https://cap.cloud.sap/docs/guides/providing-services#single-purposed-services) | [`./srv/*.cds`](./srv)               |
 | [Providing & Consuming Providers](https://cap.cloud.sap/docs/guides/providing-services)                   | http://localhost:4004                |
 | [Using Databases](https://cap.cloud.sap/docs/guides/databases)                                            | [`./db/data/*.csv`](./db/data)       |
-| [Adding Custom Logic](https://cap.cloud.sap/docs/guides/service-impl)                                     | [`./srv/*.js`](./srv)                |
+| [Adding Custom Logic](https://cap.cloud.sap/docs/guides/providing-services#adding-custom-logic)           | [`./srv/*.js`](./srv)                |
 | Adding Tests                                                                                              | [`./test`](./test)                   |
-| [Sharing for Reuse](https://cap.cloud.sap/docs/guides/reuse-and-compose)                                  | [`./index.cds`](./index.cds)         |
+| [Sharing for Reuse](https://cap.cloud.sap/docs/guides/extensibility/composition)                          | [`./index.cds`](./index.cds)         |

bookshop/srv/admin-service.js

@@ -8,6 +8,6 @@ module.exports = class AdminService extends cds.ApplicationService { init(){
 
 /** Generate primary keys for target entity in request */
 async function genid (req) {
-  const {ID} = await cds.tx(req).run (SELECT.one.from(req.target).columns('max(ID) as ID'))
+  const {id} = await SELECT.one.from(req.target).columns('max(ID) as id')
-  req.data.ID = ID - ID % 100 + 100 + 1
+  req.data.ID = id - id % 100 + 100 + 1
 }

bookshop/srv/cat-service.js

@@ -1,29 +1,34 @@
-const cds = require('@sap/cds')
+module.exports = class CatalogService extends cds.ApplicationService { init() {
 
-class CatalogService extends cds.ApplicationService { init(){
+  const { Books } = cds.entities('sap.capire.bookshop')
-
-  const { Books } = cds.entities ('sap.capire.bookshop')
   const { ListOfBooks } = this.entities
 
-  // Reduce stock of ordered books if available stock suffices
-  this.on ('submitOrder', async req => {
-    const {book,quantity} = req.data
-    if (quantity < 1) return req.reject (400,`quantity has to be 1 or more`)
-    let b = await SELECT `stock` .from (Books,book)
-    if (!b) return req.error (404,`Book #${book} doesn't exist`)
-    let {stock} = b
-    if (quantity > stock) return req.reject (409,`${quantity} exceeds stock for book #${book}`)
-    await UPDATE (Books,book) .with ({ stock: stock -= quantity })
-    await this.emit ('OrderedBook', { book, quantity, buyer:req.user.id })
-    return { stock }
-  })
-
   // Add some discount for overstocked books
-  this.after ('READ', ListOfBooks, each => {
+  this.after('each', ListOfBooks, book => {
-    if (each.stock > 111) each.title += ` -- 11% discount!`
+    if (book.stock > 111) book.title += ` -- 11% discount!`
   })
 
+  // Reduce stock of ordered books if available stock suffices
+  this.on('submitOrder', async req => {
+    let { book:id, quantity } = req.data
+    let book = await SELECT.from (Books, id, b => b.stock)
+
+    // Validate input data
+    if (!book) return req.error (404, `Book #${id} doesn't exist`)
+    if (quantity < 1) return req.error (400, `quantity has to be 1 or more`)
+    if (quantity > book.stock) return req.error (409, `${quantity} exceeds stock for book #${id}`)
+
+    // Reduce stock in database and return updated stock value
+    await UPDATE (Books, id) .with ({ stock: book.stock -= quantity })
+    return book
+  })
+
+  // Emit event when an order has been submitted
+  this.after('submitOrder', async (_,req) => {
+    let { book, quantity } = req.data
+    await this.emit('OrderedBook', { book, quantity, buyer: req.user.id })
+  })
+
+  // Delegate requests to the underlying generic service
   return super.init()
 }}
-
-module.exports = { CatalogService }

bookstore/mta.yaml

@@ -0,0 +1,43 @@
+_schema-version: '3.1'
+ID: capire.bookstore
+version: 1.0.0
+description: "A simple CAP project."
+parameters:
+  enable-parallel-deployments: true
+build-parameters:
+  before-all:
+    - builder: custom
+      commands:
+        - npm ci
+        - npx cds build --production
+modules:
+  - name: bookstore-srv
+    type: nodejs
+    path: gen/srv
+    parameters:
+      buildpack: nodejs_buildpack
+      readiness-health-check-type: http
+      readiness-health-check-http-endpoint: /health
+    build-parameters:
+      builder: npm
+    provides:
+      - name: srv-api # required by consumers of CAP services (e.g. approuter)
+        properties:
+          srv-url: ${default-url}
+    requires:
+      - name: bookstore-destination
+      - name: bookstore-messaging
+      - name: samples-db
+
+resources:
+  - name: bookstore-destination
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: destination
+      service-plan: lite
+  - name: bookstore-messaging
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: enterprise-messaging
+      service-plan: default
+      path: ./event-mesh.json

bookstore/package.json

@@ -6,7 +6,6 @@
     "@capire/reviews": "*",
     "@capire/orders": "*",
     "@capire/common": "*",
-    "@capire/fiori": "*",    
     "@capire/data-viewer": "*",
     "@sap/cds": ">=5",
     "express": "^4.17.1"
@@ -22,14 +21,32 @@
         "model": "@capire/orders"
       },
       "messaging": {
-        "[development]": { "kind": "file-based-messaging" },
+        "[development]": {
-        "[hybrid]": { "kind": "enterprise-messaging-shared" },
+          "kind": "file-based-messaging"
-        "[production]": { "kind": "enterprise-messaging" }
+        },
+        "[hybrid]": {
+          "kind": "enterprise-messaging-shared"
+        },
+        "[production]": {
+          "kind": "enterprise-messaging"
+        }
       },
-      "db": {
+      "db": { "kind": "sql" },
-        "kind": "sql"
+      "[multimodule]": {
+        "db": {
+          "kind": "sqlite",
+          "impl": "@cap-js/sqlite",
+          "credentials": {
+            "url": "../db.sqlite"
+          }
+        }
       }
     },
-    "log": { "service": true }
+    "log": {
+      "service": true
+    }
+  },
+  "devDependencies": {
+    "@sap/cds-dk": "^7"
   }
 }

bookstore/server.js

@@ -1,18 +1,15 @@
 const cds = require ('@sap/cds')
 
-// Add routes to UIs from imported packages
-cds.once('bootstrap',(app)=>{
-  app.serve ('/admin-authors') .from ('@capire/fiori','app/admin-authors')
-  app.serve ('/admin-books') .from ('@capire/fiori','app/admin-books')
-  app.serve ('/browse-books') .from ('@capire/fiori','app/browse')
-})
-
 // Add mashup logic
 cds.once('served', require('./srv/mashup'))
 
+// Add routes to UIs from imported packages
+cds.once('bootstrap',(app)=>{
+  app.serve ('/bookshop') .from ('@capire/bookshop','app/vue')
+  app.serve ('/reviews') .from ('@capire/reviews','app/vue')
+  app.serve ('/orders') .from('@capire/orders','app/orders')
+  app.serve ('/data') .from('@capire/data-viewer','app/viewer')
+})
+
 // Add Swagger UI
 require('./srv/swagger-ui')
-
-// For didactic reasons in capire
-const { ReviewsService, OrdersService } = cds.requires
-if (!ReviewsService?.credentials && !OrdersService?.credentials) cds.requires.messaging = false

bookstore/srv/mashup.cds

@@ -4,20 +4,16 @@
 //    respective reuse packages and services
 //
 
-using { sap.capire.bookshop.Books } from '@capire/bookshop';
 
 //
 //  Extend Books with access to Reviews and average ratings
 //
+using { sap.capire.bookshop.Books } from '@capire/bookshop';
 using { ReviewsService.Reviews } from '@capire/reviews';
 extend Books with {
   reviews : Composition of many Reviews on reviews.subject = $self.ID;
-
+  rating  : type of Reviews:rating; // average rating
-  @Common.Label : '{i18n>Rating}'
+  numberOfReviews : Integer @title : '{i18n>NumberOfReviews}';
-  rating  : Decimal;
-
-  @Common.Label : '{i18n>NumberOfReviews}'
-  numberOfReviews : Integer;
 }
 
 
@@ -25,8 +21,11 @@ extend Books with {
 //  Extend Orders with Books as Products
 //
 using { sap.capire.orders.Orders } from '@capire/orders';
-extend Orders with {
+extend Orders:Items with {
-  extend Items with {
+  book : Association to Books on product.ID = book.ID
-    book : Association to Books on product.ID = book.ID
-  }
 }
+
+// Ensure models from all imported packages are loaded
+using from '@capire/orders/app/fiori';
+using from '@capire/data-viewer';
+using from '@capire/common';

common/package.json

@@ -4,12 +4,5 @@
   "version": "1.0.0",
   "dependencies": {
     "@sap/cds": "*"
-  },
-  "cds": {
-    "requires": {
-      "common-data": {
-        "model": "@capire/common"
-      }
-    }
   }
 }

compose/app/appconfig/fioriSandboxConfig.json

@@ -1,168 +0,0 @@
-{
-  "services": {
-    "LaunchPage": {
-      "adapter": {
-        "config": {
-          "catalogs": [],
-          "groups": [
-            {
-              "id": "Bookshop",
-              "title": "Bookshop",
-              "isPreset": true,
-              "isVisible": true,
-              "isGroupLocked": false,
-              "tiles": [
-                {
-                  "id": "BrowseBooks",
-                  "tileType": "sap.ushell.ui.tile.StaticTile",
-                  "properties": {
-                    "title": "Browse Books",
-                    "targetURL": "#Books-display"
-                  }
-                },
-                {
-                  "id": "BrowseGenres",
-                  "tileType": "sap.ushell.ui.tile.StaticTile",
-                  "properties": {
-                    "title": "Browse Genres (OData v2)",
-                    "targetURL": "#Genres-display"
-                  }
-                }
-              ]
-            },
-            {
-              "id": "Administration",
-              "title": "Administration",
-              "isPreset": true,
-              "isVisible": true,
-              "isGroupLocked": false,
-              "tiles": [
-                {
-                  "id": "ManageBooks",
-                  "tileType": "sap.ushell.ui.tile.StaticTile",
-                  "properties": {
-                    "title": "Manage Books",
-                    "targetURL": "#Books-manage"
-                  }
-                },
-                {
-                  "id": "ManageAuthors",
-                  "tileType": "sap.ushell.ui.tile.StaticTile",
-                  "properties": {
-                    "title": "Manage Authors",
-                    "targetURL": "#Authors-display"
-                  }
-                },
-                {
-                  "id": "ManageOrders",
-                  "tileType": "sap.ushell.ui.tile.StaticTile",
-                  "properties": {
-                    "title": "Manage Orders",
-                    "targetURL": "#Orders-manage"
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      }
-    },
-    "NavTargetResolution": {
-      "config": {
-        "enableClientSideTargetResolution": true
-      }
-    },
-    "ClientSideTargetResolution": {
-      "adapter": {
-        "config": {
-          "inbounds": {
-            "BrowseBooks": {
-              "semanticObject": "Books",
-              "action": "display",
-              "title": "Browse Books",
-              "signature": {
-                "parameters": {
-                  "Books.ID": {
-                    "renameTo": "ID"
-                  },
-                  "Authors.books.ID": {
-                    "renameTo": "ID"
-                  }
-                },
-                "additionalParameters": "ignored"
-              },
-              "resolutionResult": {
-                "applicationType": "SAPUI5",
-                "additionalInformation": "SAPUI5.Component=bookshop",
-                "url": "/browse/webapp"
-              }
-            },
-            "BrowseAuthors": {
-              "semanticObject": "Authors",
-              "action": "display",
-              "title": "Browse Authors",
-              "signature": {
-                "parameters": {
-                  "Books.author.ID":{
-                    "renameTo": "ID"
-                  }
-                },
-                "additionalParameters": "ignored"
-              },
-              "resolutionResult": {
-                "applicationType": "SAPUI5",
-                "additionalInformation": "SAPUI5.Component=authors",
-                "url": "/admin-authors/webapp"
-              }
-            },
-            "BrowseGenres": {
-              "semanticObject": "Genres",
-              "action": "display",
-              "title": "Browse Genres",
-              "signature": {
-                "parameters": {
-                  "Genre.ID": {
-                    "renameTo": "ID"
-                  }
-                },
-                "additionalParameters": "ignored"
-              },
-              "resolutionResult": {
-                "applicationType": "SAPUI5",
-                "additionalInformation": "SAPUI5.Component=genres",
-                "url": "/genres/webapp"
-              }
-            },
-            "ManageBooks": {
-              "semanticObject": "Books",
-              "action": "manage",
-              "title": "Manage Books",
-              "signature": {
-                "parameters": {},
-                "additionalParameters": "allowed"
-              },
-              "resolutionResult": {
-                "applicationType": "SAPUI5",
-                "additionalInformation": "SAPUI5.Component=books",
-                "url": "/admin-books/webapp"
-              }
-            },
-            "ManageOrders": {
-              "semanticObject": "Orders",
-              "action": "manage",
-              "signature": {
-                "parameters": {},
-                "additionalParameters": "allowed"
-              },
-              "resolutionResult": {
-                "applicationType": "SAPUI5",
-                "additionalInformation": "SAPUI5.Component=orders",
-                "url": "/orders/webapp"
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-}

compose/package.json

@@ -1,12 +0,0 @@
-{
-  "name": "@capire/bookstore",
-  "version": "1.0.0",
-  "dependencies": {
-    "@capire/bookshop": "*",
-    "@capire/reviews": "*",
-    "@capire/fiori": "*",
-    "@capire/orders": "*",
-    "@sap/cds": ">=5",
-    "express": "^4.17.1"
-  }
-}

compose/server.js

@@ -1,8 +0,0 @@
-const cds = require ('@sap/cds')
-
-// Add Swagger UI
-require('./srv/swagger-ui')
-
-// For didactic reasons in capire
-const { ReviewsService, OrdersService } = cds.requires
-if (!ReviewsService?.credentials && !OrdersService?.credentials) cds.requires.messaging = false

compose/srv/swagger-ui.js

@@ -1,10 +0,0 @@
-
-// -----------------------------------------------------------------------
-// Adding Swagger UI - see https://cap.cloud.sap/docs/advanced/openapi
-const cds = require ('@sap/cds')
-try {
-  const cds_swagger = require ('cds-swagger-ui-express')
-  cds.once ('bootstrap', app => app.use (cds_swagger()) )
-} catch (err) {
-  if (err.code !== 'MODULE_NOT_FOUND')  throw err
-}

data-viewer/cds-plugin.js

@@ -1,3 +0,0 @@
-cds.once('bootstrap',(app)=>{
-  app.serve ('/data') .from('@capire/data-viewer','app/viewer')
-})

data-viewer/package.json

@@ -9,12 +9,5 @@
     "app",
     "srv",
     "index.cds"
-  ],
+  ]
-  "cds": {
-    "requires": {
-      "orders-service": {
-        "model": "@capire/data-viewer"
-      }
-    }
-  }
 }

data-viewer/srv/data-service.cds

@@ -20,6 +20,7 @@
    * The actual data, organized by column name
    */
   entity Data @cds.persistence.skip {
+    key ID   : String;   // to be OData-compliant
     record   : array of {
       column : String;
       data   : String;

data-viewer/srv/data-service.js

@@ -36,8 +36,11 @@ class DataService extends cds.ApplicationService { init(){
     const dataSource = findDataSource(dataSourceName, entityName)
     const res = await dataSource.run(query)
     return res.map((line) => {
-      const record = Object.entries(line).map(([column, data]) => {return {column, data}})
+      const record = Object.entries(line).map(([column, data]) => ({ column, data }))
-      return { record }
+      return {
+        record,
+        ID: cds.utils.uuid() // just to be OData-compliant
+      }
     })
   })
 

db/sqlite/index.cds

@@ -0,0 +1,5 @@
+using from '@capire/bookstore';
+using from '@capire/common';
+using from '@capire/orders';
+using from '@capire/reviews';
+using from '@capire/fiori';

etc/dark.drawio.svg

@@ -1,13 +1,13 @@
-<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="347px" height="279px" viewBox="-0.5 -0.5 347 279" content="&lt;mxfile&gt;&lt;diagram id=&quot;QQJxv4aCTC7ZgE7HHOvM&quot; name=&quot;Page-1&quot;&gt;7Vlbb+I4FP41vCLfL4/T7szuy0oj9WGfczEkasCRMYXur98TEufeqpoBCtUGCezv+Hq+z/bBWdDHzfFPF5XZ3zY1xYKg9LigfywI0QLBdwW81oDUrAbWLk9rCHXAU/6vqUEc0H2eml2D1ZC3tvB5OQQTu92axA+wyDl7GBZb2SIdAGW0NoNhVMBTEhVmUuyfPPVZjSoiO/wvk6+z0DMWurbEUfK8dna/bfpbEIq/VZ/avIlCW02/uyxK7aEH0e8L+uis9XVqc3w0ReXaodt+vGFtx+3M1n+kAqkrvETFvpn6gqEkKnNnqkpERJtyQR+28a76gXwBzT7EDlJr30cCEFv7vMtsGQzQStwVPk3ZvwY3w+zLKpmZY7S2WyhSGpdvjDeuQ38GCJzzcMhyb57KKKmqHUB7gGV+U0AOQ3KVH02QU5XfPRufVB5HJ2NRPNrCulPndLUyIkmqQt7ZZ9OzpFLHCLWWoADSTuHFOG+Ob7oct0TC+jAWBu9eoUhTgcimSrM2KG9UdeiUpht5ZD2RqQaLGm2v25Y7fiHRUDxPNz033avcuvwOuFaJmec6Vpzxq3FNrsg1OzfXzrzkBnbWm2c75UalbI5tRWIqxKXYppwPVza6Htv83GwndrMB4m6e7BWvPhVut76H18+cCMTpuZQIsFIDEbArikCcWwTWpcbdw4qPjFrN7u8iUSZeXY5s+WkrXk7JHnNitum3KhqGXFJEu12eDF08cOnUQVC98b882SPnB/mRq3+cntaxJg0x9ltuhbHavUvMYAeDXtbG96LTqfN7zuUzzg2YM0Xk85fhIOY83vTw0+YwvI5bCOuH5AayQxv16Jtq/SB70pIYtURHLdWTnrR0kkA78Q+pQn0xVYipKuhnqoJIueSKtk8Y4Gtn7lknRH9UMkTjJcOifSQbdqPEsmcVgl5KT/qL6Yncl54ofZ/oM+mJkvdlez49hRueLyModl+CYtcRFLueoPBUUL8X9O72ZVnk/8e978a9o2MvLOsrxL145s5yTOETNAKCRLfPoMEpN7P7khaSRpf7m4rQkEFBrsfgzDXkXZ8BQZL9QwC/4f+bOAXGYUXYvS8cVoRRXOAUmLnt/HKSEp+pKAxUS6Q4QVhqKtv7h7B/aAZKkIghypVk7FfDCqSWIComtSJIgIrpsBfFQNZEcy0YJpxfLqqYuU+9bz2F16i3EqdiTWELUlWoqDUS46tzSpYQm3KOGYJgQ5NflZOADQhLySVCmrJxJ3oJOyFjimuFKVJnUhNkuze4dfHuLTn9/h8=&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(26, 26, 26);">
+<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="357px" height="283px" viewBox="-0.5 -0.5 357 283" content="&lt;mxfile&gt;&lt;diagram id=&quot;QQJxv4aCTC7ZgE7HHOvM&quot; name=&quot;Page-1&quot;&gt;7VrZcqM4FP0av7q0L4+T9DIvU9VVeZhnFtlQwRYly7HTX98XgzBgOpNJG7eZGlKVwNECuudwdSSyoI+b41cXldlfNjXFgqD0uKCfFoQIIuF3BbzWACO6BtYuT2sInYGn/LupQRzQfZ6aXYPVkLe28HnZBxO73ZrE97DIOXvoV1vZIu0BZbQ2vceogKckKsxFtb/z1Gc1qsKwKvxPk6+zcGcsmvHFUfK8dna/be63IBQxXpdtotBRc9NdFqX20IHo5wV9dNb6+mxzfDRFFdd+zL78pLR9aGe2/j0NSN3gJSr2zbgXDCVRmTtTNSIi2pQL+rCNd9UfuC6g24fYwdnad5EAxNY+7zJbhgLoJT5XPg3Zv4YYw+jL6jQzx2htt1ClNC7fGG/cGf0WIAjOwyHLvXkqo6RqdgDhAZb5TQFXGE5X+dEELVXXu2fjkyri6FRYFI+2sO50c7paGZEkVSXv7LPplKRSxwi1JYF+0g6hG98m5C/GeXPsQE28vxoLD+9eoUpTSiSrm4QXQ9L6+nCWmW7kkXUUphosaoS9bns+8wsnDcXjdNNJ6Pa2an73fKvEjPMdK874zfimktyMb3Ztvp15yQ2k1rtnO+VGpWyMbUViKsRUbFOB+2xjfTO2+bXZTuxmA8TdPdkrXv1UuN36Dl4fYyIQp+NWImDhRbyBCMS1RWBdatwc3vjIqNVofheJMvFqKrKxEr+NbHlJ9pATs03/qOwwXCVFtNvlST/EvZBeBgiaN/GXp/LI+d71INRfTsdbgd3ZvUtML2FBp2vjew7FpMGd/yT4neDykeAGzJki8vlL39OPRby5wzebw/OeuSW4P3lzRPp91MNpmnWN9kVPYmD7+KCnOgoXPZ0k0A78XapQ81aFuHdVwKu75Iq2B+knAKrJslNKqfyYZIhmS4ZFewzXDQgvO6VC0Kn0pOetJzJzPTH+NtHX0hN7W7bX01PY4pmroNjMBcWHgppET3ygJzaZnIJlu5rl3e3Lssj/d73/wvXecp2LyUj+GFD4BJ2A4tD9M2hwys1oVtJC0miyRaoeEHjDbSk8sg85pwkgCLA7A4QsNI8pYOgp5CA7T+QpyGCqueIkMLLVOXdJibtSFAaqJVKcICw1ZIuw+dAuRzQoQSKGKFeSsY+aVIyXRGMmtSJIEBk+jrRrKw2yJpprwTAYmek86shm6qz0FL6Z3q1JxVpAClKnL8MaCc4HmUMuYaUDVhXWuUroD267EFClolhKLhHSlA1uwtmSUsGY4lphitRkarr6ruwqty7/T5ubCyczovl3f3Qjt3Q3974rO0gA/5hL6IjbEb/V3Ei9FFIpyBuKcKF0f5KozA3lEqYQLDimUvyCuaGQSSFzYMkoHtwFvI1gkGGwokwJWHBdKXvA5fkfQOrq5/+woZ9/AA==&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(0, 68, 85);">
     <defs/>
     <g>
-        <path d="M 192 148 L 242 148 L 262 188 L 242 228 L 192 228 L 172 188 Z" fill="#ffe6cc" stroke="#d79b00" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 199 202 L 249 202 L 269 242 L 249 282 L 199 282 L 179 242 Z" fill="#ffe6cc" stroke="#d79b00" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 188px; margin-left: 173px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 242px; margin-left: 180px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
@@ -17,39 +17,39 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="217" y="192" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="224" y="246" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 192 48 L 242 48 L 262 88 L 242 128 L 192 128 L 172 88 Z" fill="#f8cecc" stroke="#b85450" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 199 101 L 249 101 L 269 141 L 249 181 L 199 181 L 179 141 Z" fill="#f8cecc" stroke="#b85450" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 88px; margin-left: 173px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 141px; margin-left: 180px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
-                                    fiori
+                                    bookstore
                                 </b>
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="217" y="92" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="224" y="145" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 276 98 L 326 98 L 346 138 L 326 178 L 276 178 L 256 138 Z" fill="#d5e8d4" stroke="#82b366" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 286 48 L 336 48 L 356 88 L 336 128 L 286 128 L 266 88 Z" fill="#d5e8d4" stroke="#82b366" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 138px; margin-left: 257px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 88px; margin-left: 267px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
@@ -59,18 +59,18 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="301" y="142" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="311" y="92" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 109 198 L 159 198 L 179 238 L 159 278 L 109 278 L 89 238 Z" fill="#f5f5f5" stroke="#666666" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 286 153 L 336 153 L 356 193 L 336 233 L 286 233 L 266 193 Z" fill="#f5f5f5" stroke="#666666" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 238px; margin-left: 90px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 193px; margin-left: 267px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #333333; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
@@ -80,18 +80,18 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="134" y="242" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="311" y="197" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 108 98 L 158 98 L 178 138 L 158 178 L 108 178 L 88 138 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 111 153 L 161 153 L 181 193 L 161 233 L 111 233 L 91 193 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 138px; margin-left: 89px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 193px; margin-left: 92px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
@@ -101,26 +101,26 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="133" y="142" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="136" y="197" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 168.58 217.17 L 174.72 213.47" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 276.35 172.29 L 266.36 166.32" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 180.5 209.99 L 175.11 218.49 L 174.72 213.47 L 170.47 210.78 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 260.57 162.86 L 270.6 163.61 L 266.36 166.32 L 265.98 171.34 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 167.68 117.36 L 174.6 113.24" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 170.74 172.47 L 181.53 166.1" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 180.4 109.79 L 174.97 118.26 L 174.6 113.24 L 170.36 110.52 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 187.34 162.66 L 181.88 171.12 L 181.53 166.1 L 177.3 163.37 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 217 148 L 217 136.99" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 224 202 L 224 189.99" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 217 130.24 L 221.5 139.24 L 217 136.99 L 212.5 139.24 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 224 183.24 L 228.5 192.24 L 224 189.99 L 219.5 192.24 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 266.32 117.36 L 259.4 113.24" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 276.51 109.01 L 266.17 115.31" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 253.6 109.79 L 263.64 110.52 L 259.4 113.24 L 259.03 118.26 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 260.4 118.82 L 265.75 110.3 L 266.17 115.31 L 270.43 117.98 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 107 1 L 157 1 L 177 41 L 157 81 L 107 81 L 87 41 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 111 48 L 161 48 L 181 88 L 161 128 L 111 128 L 91 88 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 41px; margin-left: 88px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 88px; margin-left: 92px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 @capire/
                                 <br/>
                                 <b>
@@ -130,18 +130,18 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="132" y="45" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="136" y="92" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     @capire/...
                 </text>
             </switch>
         </g>
-        <path d="M 21 53 L 71 53 L 91 93 L 71 133 L 21 133 L 1 93 Z" fill="#e1d5e7" stroke="#9673a6" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 21 101 L 71 101 L 91 141 L 71 181 L 21 181 L 1 141 Z" fill="#e1d5e7" stroke="#9673a6" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
-                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 93px; margin-left: 2px;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 141px; margin-left: 2px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 <b>
                                     S/4
                                 </b>
@@ -149,23 +149,46 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="46" y="97" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="46" y="145" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     S/4
                 </text>
             </switch>
         </g>
-        <path d="M 80.55 72.11 L 89.76 66.54" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 80.76 120.53 L 93.49 113.03" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 95.53 63.05 L 90.16 71.56 L 89.76 66.54 L 85.5 63.86 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 99.31 109.61 L 93.84 118.05 L 93.49 113.03 L 89.27 110.3 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 81.75 111.49 L 89.27 115.38" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 80.91 161.17 L 93.31 168.33" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 95.26 118.48 L 85.2 118.34 L 89.27 115.38 L 89.33 110.35 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 99.15 171.71 L 89.11 171.1 L 93.31 168.33 L 93.61 163.31 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
-        <path d="M 167.25 60.49 L 173.88 64.16" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 170.59 108.83 L 181.72 115.53" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
-        <path d="M 179.79 67.42 L 169.74 67.01 L 173.88 64.16 L 174.09 59.13 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 187.5 119.02 L 177.47 118.23 L 181.72 115.53 L 182.11 110.52 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <path d="M 199 1 L 249 1 L 269 41 L 249 81 L 199 81 L 179 41 Z" fill="#e1d5e7" stroke="#9673a6" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
+        <g transform="translate(-0.5 -0.5)">
+            <switch>
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
+                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 88px; height: 1px; padding-top: 41px; margin-left: 180px;">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
+                                @capire/
+                                <br/>
+                                <b>
+                                    fiori
+                                </b>
+                            </div>
+                        </div>
+                    </div>
+                </foreignObject>
+                <text x="224" y="45" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                    @capire/...
+                </text>
+            </switch>
+        </g>
+        <path d="M 224 101 L 224 89.99" fill="none" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="stroke"/>
+        <path d="M 224 83.24 L 228.5 92.24 L 224 89.99 L 219.5 92.24 Z" fill="#ffffff" stroke="#ffffff" stroke-width="2" stroke-miterlimit="10" pointer-events="all"/>
     </g>
     <switch>
         <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
         <a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank">
             <text text-anchor="middle" font-size="10px" x="50%" y="100%">
-                Viewer does not support full SVG 1.1
+                Text is not SVG - cannot display
             </text>
         </a>
     </switch>

etc/incidents.drawio.svg

@@ -1,13 +1,13 @@
-<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="569px" height="428px" viewBox="-0.5 -0.5 569 428" content="&lt;mxfile&gt;&lt;diagram id=&quot;QQJxv4aCTC7ZgE7HHOvM&quot; name=&quot;Page-1&quot;&gt;7Vpdd9o4EP01PJZjWf7SY8jHds9pd3tKt30WtjDayBZHFknor18ployNDCXEELbtyUPsQRpLvndmrgZG8Lp4+kPg5eIjzwgb+V72NII3I98HMPLUP21Z15YYBbUhFzQzgzaGKf1OjNHMy1c0I1VnoOScSbrsGlNeliSVHRsWgj92h8056z51iXPzRG9jmKaYEWfYN5rJRW1N/Hhjf09ovrBPBhGqPymwHWwcVwuc8ceWCd6O4LXgXNZXxdM1Yfrl2fdSz7vb8WmzMEFKecgEv57wgNnK7G2qBis0vPdXf12ZNcq13bjgqzIjeq43gpPHBZVkusSp/vRRQa1sC1kwdQfUZcoLmpqh1T2R6cLc/Evz/NljoG7mvJR3uKBMc+E9YQ9E0hTrKVLw++b9qjczwYzmpboW9audPBChx7IrY5dcr6BSC6Jlru7Dxss1Z1w8bwEmvv7TK+WCflcPx8yusZ742QAXm8VNzfaBuW/5Cm70n7Kbt6jWQ552IgEafFVgEF4QKdZqiJnwDtioMEEBLEceNxQDKKxtiza9LIrY0DpvnG+QVxcG/H4iQIcIk1VFS1JVI72OiOkXPhPqKtdXn7CQJRF7CALORJAWHLMkDEKvlzpzylhr5DxJSZoOBRxIxmEXuhC50Fk429CF3uuRCxzkGrgsWn+WqUqYaju+9zEvZAtR5bwZ5aJ8+yRJWVFeqhlXy+WFpgNG5odkA7Q3G5wwsg+IaxjELjlggF7PjtBhhyVDdVnBG6UJmc0PCd4Mk2Q+UPD6YdwFB/lu5IKepDtE5EY9kbsFCSmzKy1Y1F1GccHL7MuCKnZP1Ad3lFkw1J1RSSDqwnRSACqpyoBd3+3nApdrazWL8+y9WR5qYCOZ1Vi7QFMvgq9EakeZl6Oc5cSC0I9tGzsbfIIwLOlD95F94Bl3nzh9zpc2hoMOTQIQ2pRvfdRrNdPaimvLU5Owd7uqt+i4eqZTs82DGBY7DLteVVJ5EBcW/VmMZt5hpXtOoqFKN+pC0Rv8pyrbiQPNdJWmSm/d4VTyvfj8/7V3j9R25Phbam8/ilwmoGjcUwh8bwD1jRwyfOPifs519uuV3yqAtSq7pBC+GPUNPXi+MLYtiRZ0t8WS8TXpR+4LLUi1IET+Bq8fvKQn8k4GHniRApsxnt6rnWdYIWiB2ggxryvE/GOF2NG18KWSCrqKKj6fouoK7xDEx+qpHzgaTk1ZCdqiy0dVsHFOLkxNXcZZCnrADeVTnaWA28DaF8qXephqHZMOO1wdF/nhW0a+H8MuTyA8MvQB2u9owNB3u2xTIh7oDn2m1duldUcv4oh1Xm3mNr9+pfKO3CCvaXyWKAfbwg5GxxZ4tOUqCrdWM2Ccv6wnV/KS7CPJxdQPviTlYNXDJsO3acWByB97CYp0Uw6EHoJ+hxx+hI7jGYjgOAAejGMYJgHyoqTrF5yuuLhtOltAemrL1QOmDM8oo3L9u8K4FeasB0i3i/crVRjb/OiUmPMJSeDUmODIGgO8YL+jAYPd7fVNcHqvcFdGoynd46Rtt37AM8I+8YpK/a2sYhSXkhcaavtDEq/NL6/VuU0VkiqldDi1o4vr0EZ5X+qVFE+5/kXPuFA8Xi3HBRb6X7oSbD0Rz2lmT2vplelGcInNrr09bak5o8uvZnsDZJd3YOv7mtDryS8QuPnFHyC/+G538R/db1Cmr5Q8/lQ8abLWaXliM97APEm2G5nn5YnbyGz/duMGS/wzUaVRxyelSqOsB6aKH6A3ZIrbw3SYYaFJ14wqNSngj6XkrNadH2aNQdW0/FmN/r2Syg0x9qoWN/4YQRSiGIIwgJEPwTaAu085h5+UBsAKJF2sAIpdrJALFQhfDJW63fzusxYWm1/Pwtv/AA==&lt;/diagram&gt;&lt;/mxfile&gt;">
+<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="569px" height="428px" viewBox="-0.5 -0.5 569 428" content="&lt;mxfile&gt;&lt;diagram id=&quot;QQJxv4aCTC7ZgE7HHOvM&quot; name=&quot;Page-1&quot;&gt;7Vpbc9soFP41fqxHCF0f7VyanWl2O3W3fcYSltkg4UH41l+/EIEtGdl1HTlRM508RBzDMfB9h/NxrAG8yTcfOVrMH1mK6cB10s0A3g5cFwAQy3/Ksq0sgQcrQ8ZJWpmcvWFCfmA90liXJMWltlUmwRgVZNE0JqwocCIaNsQ5Wze7zRhNG4YFynBjGsowSRDFVrfvJBXzyhq54d7+gEk2N98MAr3gHJnO2nE5Rylb10zwbgBvOGOieso3N5iqzWvuy/2RT3cT47gQ5wxwqwErRJd6bRPZ2ZOmh9HfIz1HsTUL52xZpFiNdQZwvJ4TgScLlKhP1xJqaZuLnMoWkI8Jy0miu5ZPWCRz3fiPZNmzR082ZqwQ9ygnVHHhAdMVFiRBaojg7Gm3v3JnxoiSrJDPvNra8Qpz1ZeOtF0wNYNSTogUmWz7Oy83jDL+vAQYuepPzZRx8kN+OaJmjtXALxq4UE9uopcPdLvmy7tVf9Jub7tGQk0Rb2omDcNHzHIs+FZ20Z9+AIHmhA4KYDiy3lMMxH5lm9fpZVBEmtbZzvkeefmgwW8nArSIMF6WpMBlOVDzCKja8CmXT5l6+oy4KDA/QRDwSgSpwTGNfM93WqkzI5TWes6iBCdJV8CBaOg3ofNjGzoDZx0633k5cp6F3A4ug9ZfRSIPTLlC13nMclFDVDrf9bJRvtsIXJSEFXLEaLHo6XFA8eyc0yA+eRpcMbLPiGvohTY5oBe/nB2+xQ5DhrJfwRskEZ7OzgneFOFo1lHwun7YBCd27cgFLYduF5EbtETuASS4SEdKsMhWSlDOivTrnEh2j+UH94QaMGRLqyQQNGG6KgClkGnAzO/uS46KrbHqyTmmracXn4KtZEueGIml90KOzbDZ88qEU6POjmBbx84EH8cUCbJqCrg28LS7z4w8n5cmhr0GTTzgmyPf+Kgmr4fVFdeBp92BfdxVtWbL1TOddss8i2GhxbCbZSmkB96z6E/DeOqcl7pnOOgqdcdNKFqD/1ppO7KgmSyTROqte5QIdhKf3197t0htS46/pfZ2g8BmQhwMWxKB63SgvmOLDN8Zf5oxdRy2ym8ZwEqV9SmEe6O+oQNfL4xNSaIG3V2+oGyL25H7SnJczjEWf8BrBy9qibyrgQcs8E4psCllyZNceYokggaovRBzmkLMvVSIdZkL65IK2ooqfENF1RTePggv1VM/cdSdmjKatEaXR5mwUYZ7pqb6cZeCDrBD+Vp3KWAXsE6Fcl8vU7Vr0nmXq7Mi3+9V5LshbPIEwgtD3/yOcMxRh6FvV9kmmK/IEX2m1FvfqqO9uGK9rjazi1/vOL3HdpAb1r5FlINDYQeDSxN8fOAq8A9m02Gc/1pNrmAFPkWS3uQPtsDFpdnDsKgnpTgQuEMnigNVlAO+E0O3QQ43iC/jGQjg0AMODEPoR17sBFHTL7hecrHLdCaBtOSW0QoRiqaEErH9k2HsDPOqF0i7iveOM4ypdTRSzBsKSWDlGO/CHAMc77SjDoPdrvWNUfIkcZdGrSnt66Qpt35CU0w/s5II9ausZBQTguUKavMiiVPnl1Or3CYSWnmkNDh1pIpr0UZ6X6iZ5JtMvdEzzCWPl4thjrj6lyw53Y758zFzorT0wuOGM4H0qp0TZakZJYtvenkdnC4fwMHvNb7Tcr5AYJ8vbgfni2tXF/9V9QZp+kbw+l3xZHdqXZcn5sTrmCfRYSHzdXliFzLr727cIoHeE1V26viqVNkp646p4nrxGzLFrmFazDDQJFtKpJrk8OdSclrpzk/TnUHmtOxZjf6zFNIN1vayEjfuMIaxH4cQ+B4MXAgOATx+yzn/ptQBViBqYgXi0MYqtqEC/i9DJZv79z4rYbF/exbe/Q8=&lt;/diagram&gt;&lt;/mxfile&gt;">
     <defs/>
     <g>
-        <rect x="1" y="1" width="195" height="122" fill="#ffffff" stroke="#828282" stroke-width="2" pointer-events="all"/>
+        <rect x="1" y="1" width="195" height="122" fill="rgb(255, 255, 255)" stroke="#828282" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)rotate(-90 11 13)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-end; width: 107px; height: 1px; padding-top: 13px; margin-left: -96px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: right; ">
+                        <div data-drawio-colors="color: #4D4D4D; " style="box-sizing: border-box; font-size: 0px; text-align: right;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #4D4D4D; line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(77, 77, 77); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">
                                 S/4 HANA
                             </div>
                         </div>
@@ -21,10 +21,10 @@
         <rect x="42.5" y="40" width="120" height="50" rx="7.5" ry="7.5" fill="#f8cecc" stroke="#b85450" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 65px; margin-left: 44px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Business
                                 <br/>
                                 Partner
@@ -32,18 +32,18 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="103" y="69" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="103" y="69" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Business...
                 </text>
             </switch>
         </g>
-        <rect x="221" y="1" width="347" height="349" fill="#ffffff" stroke="#828282" stroke-width="2" pointer-events="all"/>
+        <rect x="221" y="1" width="347" height="349" fill="rgb(255, 255, 255)" stroke="#828282" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 331px; height: 1px; padding-top: 15px; margin-left: 230px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: left; ">
+                        <div data-drawio-colors="color: #4D4D4D; " style="box-sizing: border-box; font-size: 0px; text-align: left;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #4D4D4D; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(77, 77, 77); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 <b>
                                     Incident Mgmt
                                 </b>
@@ -61,16 +61,16 @@
         <rect x="418" y="73" width="115" height="50" rx="7.5" ry="7.5" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 113px; height: 1px; padding-top: 98px; margin-left: 419px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Incidents
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="476" y="102" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="476" y="102" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Incidents
                 </text>
             </switch>
@@ -81,27 +81,27 @@
         <rect x="255" y="73" width="120" height="50" rx="7.5" ry="7.5" fill="#ffe6cc" stroke="#d79b00" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 98px; margin-left: 256px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Customers
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="315" y="102" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="315" y="102" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Customers
                 </text>
             </switch>
         </g>
-        <rect x="1" y="147" width="196.5" height="202" fill="#ffffff" stroke="#828282" stroke-width="2" pointer-events="all"/>
+        <rect x="1" y="147" width="196.5" height="202" fill="rgb(255, 255, 255)" stroke="#828282" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)rotate(-90 11 159)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-end; width: 187px; height: 1px; padding-top: 159px; margin-left: -176px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: right; ">
+                        <div data-drawio-colors="color: #4D4D4D; " style="box-sizing: border-box; font-size: 0px; text-align: right;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #4D4D4D; line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(77, 77, 77); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">
                                 SuccessFactors
                             </div>
                         </div>
@@ -115,10 +115,10 @@
         <rect x="42.5" y="184" width="120" height="50" rx="7.5" ry="7.5" fill="#f8cecc" stroke="#b85450" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 209px; margin-left: 44px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Workforce
                                 <br/>
                                 Person
@@ -126,7 +126,7 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="103" y="213" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="103" y="213" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Workforce...
                 </text>
             </switch>
@@ -134,10 +134,10 @@
         <rect x="42.5" y="267" width="120" height="50" rx="7.5" ry="7.5" fill="#f8cecc" stroke="#b85450" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 292px; margin-left: 44px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Employee
                                 <br/>
                                 Timesheet
@@ -145,7 +145,7 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="103" y="296" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="103" y="296" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Employee...
                 </text>
             </switch>
@@ -155,16 +155,16 @@
         <rect x="418" y="182" width="115" height="50" rx="7.5" ry="7.5" fill="#dae8fc" stroke="#6c8ebf" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 113px; height: 1px; padding-top: 207px; margin-left: 419px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Messages
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="476" y="211" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="476" y="211" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Messages
                 </text>
             </switch>
@@ -175,10 +175,10 @@
         <rect x="255" y="184" width="120" height="50" rx="7.5" ry="7.5" fill="#ffe6cc" stroke="#d79b00" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 209px; margin-left: 256px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Service
                                 <br/>
                                 Worker
@@ -186,7 +186,7 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="315" y="213" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="315" y="213" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Service...
                 </text>
             </switch>
@@ -198,10 +198,10 @@
         <rect x="255" y="267" width="120" height="50" rx="7.5" ry="7.5" fill="#ffe6cc" stroke="#d79b00" stroke-width="2" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 292px; margin-left: 256px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                 Worker
                                 <br/>
                                 Availability
@@ -209,7 +209,7 @@
                         </div>
                     </div>
                 </foreignObject>
-                <text x="315" y="296" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="315" y="296" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Worker...
                 </text>
             </switch>
@@ -219,16 +219,16 @@
         <path d="M 37 407 C 37 401.48 41.48 397 47 397 L 92.5 397 C 98.02 397 102.5 392.52 102.5 387 C 102.5 392.52 106.98 397 112.5 397 L 158 397 C 163.52 397 168 401.48 168 407" fill="none" stroke="#b85450" stroke-width="2" stroke-miterlimit="10" transform="translate(0,397)scale(1,-1)translate(0,-397)" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 414px; margin-left: 103px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
                                 Backend Services
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="103" y="426" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="103" y="426" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Backend Services
                 </text>
             </switch>
@@ -236,16 +236,16 @@
         <path d="M 249.5 407 C 249.5 401.48 253.98 397 259.5 397 L 305 397 C 310.52 397 315 392.52 315 387 C 315 392.52 319.48 397 325 397 L 370.5 397 C 376.02 397 380.5 401.48 380.5 407" fill="none" stroke="#d79b00" stroke-width="2" stroke-miterlimit="10" transform="translate(0,397)scale(1,-1)translate(0,-397)" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 414px; margin-left: 315px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
                                 Usage Views
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="315" y="426" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="315" y="426" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Usage Views
                 </text>
             </switch>
@@ -253,16 +253,16 @@
         <path d="M 410 407 C 410 401.48 414.48 397 420 397 L 465.5 397 C 471.02 397 475.5 392.52 475.5 387 C 475.5 392.52 479.98 397 485.5 397 L 531 397 C 536.52 397 541 401.48 541 407" fill="none" stroke="#6c8ebf" stroke-width="2" stroke-miterlimit="10" transform="translate(0,397)scale(1,-1)translate(0,-397)" pointer-events="all"/>
         <g transform="translate(-0.5 -0.5)">
             <switch>
-                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
+                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 414px; margin-left: 476px;">
-                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
+                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
-                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
+                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
                                 Extension Data
                             </div>
                         </div>
                     </div>
                 </foreignObject>
-                <text x="476" y="426" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
+                <text x="476" y="426" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                     Extension Data
                 </text>
             </switch>
@@ -274,7 +274,7 @@
         <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
         <a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank">
             <text text-anchor="middle" font-size="10px" x="50%" y="100%">
-                Viewer does not support full SVG 1.1
+                Text is not SVG - cannot display
             </text>
         </a>
     </switch>

fiori/app/admin-authors/webapp/i18n/i18n.properties

@@ -2,10 +2,10 @@
 # __ldi.translation.uuid=c3431418-9caf-11e8-98d0-529269fb1459
 
 # JCI app descriptor contains lower case TITLE
-appTitle=Bookshop Authors
+appTitle=Manage Authors
 
 # JCI app descriptor contains lower case DESCRIPTION
-appSubTitle=Bookshop Authors
+appSubTitle=CAP Sample Application
 
 # JCI app descriptor contains lower case DESCRIPTION
 appDescription=Bookshop Authors

fiori/app/admin-authors/webapp/manifest.json

@@ -35,7 +35,7 @@
             "additionalParameters": "ignored"
           },
           "semanticObject": "Authors",
-          "action": "display",
+          "action": "manage",
           "title": "{{appTitle}}",
           "info": "{{appInfo}}",
           "subTitle": "{{appSubTitle}}",

fiori/app/admin-books/webapp/i18n/i18n.properties

@@ -2,7 +2,7 @@
 # __ldi.translation.uuid=c3431418-9caf-11e8-98d0-529269fb1459
 
 # JCI app descriptor contains lower case TITLE
-appTitle=Bookshop Sample
+appTitle=Manage Books
 
 # JCI app descriptor contains lower case DESCRIPTION
 appSubTitle=CAP Sample Application

fiori/app/admin-books/webapp/manifest.json

@@ -19,6 +19,22 @@
             "id": "ui5template.basicSAPUI5ApplicationProject",
             "-id": "ui5template.smartTemplate",
             "-version": "1.40.12"
+        },
+        "crossNavigation": {
+            "inbounds": {
+                "intent1": {
+                        "signature": {
+                        "parameters": {},
+                        "additionalParameters": "allowed"
+                    },
+                    "semanticObject": "Books",
+                    "action": "manage",
+                    "title": "{{appTitle}}",
+                    "info": "{{appInfo}}",
+                    "subTitle": "{{appSubTitle}}",
+                    "icon": "sap-icon://course-book"
+                }
+            }
         }
     },
     "sap.ui5": {

fiori/app/appconfig/fioriSandboxConfig.json

@@ -50,7 +50,7 @@
                   "tileType": "sap.ushell.ui.tile.StaticTile",
                   "properties": {
                     "title": "Manage Authors",
-                    "targetURL": "#Authors-display"
+                    "targetURL": "#Authors-manage"
                   }
                 },
                 {
@@ -99,7 +99,7 @@
             },
             "BrowseAuthors": {
               "semanticObject": "Authors",
-              "action": "display",
+              "action": "manage",
               "title": "Browse Authors",
               "signature": {
                 "parameters": {

fiori/app/browse/webapp/i18n/i18n.properties

@@ -2,7 +2,7 @@
 # __ldi.translation.uuid=c3431418-9caf-11e8-98d0-529269fb1459
 
 # JCI app descriptor contains lower case TITLE
-appTitle=Bookshop Sample
+appTitle=Browse Books
 
 # JCI app descriptor contains lower case DESCRIPTION
 appSubTitle=CAP Sample Application

fiori/app/router/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "approuter",
+  "dependencies": {
+    "@sap/approuter": "^16.0.0"
+  },
+  "engines": {
+    "node": "^20.0.0"
+  },
+  "scripts": {
+    "start": "node node_modules/@sap/approuter/approuter.js"
+  }
+}

fiori/app/router/xs-app.json

@@ -0,0 +1,22 @@
+{
+  "welcomeFile": "app/index.html",
+  "routes": [
+    {
+      "source": "^/app/(.*)$",
+      "target": "$1",
+      "localDir": ".",
+      "cacheControl": "no-cache, no-store, must-revalidate"
+    },
+    {
+      "source": "^/appconfig/",
+      "localDir": ".",
+      "cacheControl": "no-cache, no-store, must-revalidate"
+    },
+    {
+      "source": "^/(.*)$",
+      "target": "$1",
+      "destination": "srv-api",
+      "csrfProtection": true
+    }
+  ]
+}

fiori/cds-plugin.js

@@ -1,9 +0,0 @@
-// install OData v2 adapter
-const cds = require("@sap/cds")
-const proxy = require('@cap-js-community/odata-v2-adapter')
-const opts = global.it ? { target:'auto' } : {}   // for tests, set 'auto' to detect port dynamically
-cds.once('bootstrap', app => {
-    app.use(proxy(opts))  // install proxy
-    // cds.log('cov2ap','silent') // suppress anoying log outpout, e.g. for `npm run mocha -- --reporter nyan`
-    app.serve ('/fiori-apps') .from ('@capire/fiori','app/fiori-apps.html')
-})

fiori/index.cds

@@ -1,8 +1,2 @@
-using from './db/sqlite/index';
-using from './app/services';
-using from './app/genres/fiori-service';
-using from './app/browse/fiori-service';
-using from './app/admin-books/fiori-service';
-using from './app/admin-authors/fiori-service';
 using from './db/common';
-using from './app/common';
+using from './app/services';

fiori/mta.yaml

@@ -0,0 +1,69 @@
+_schema-version: '3.1'
+ID: capire.fiori
+version: 1.0.0
+description: "A simple CAP project."
+parameters:
+  enable-parallel-deployments: true
+build-parameters:
+  before-all:
+    - builder: custom
+      commands:
+        - npm ci
+        - npx cds build --production
+modules:
+  - name: fiori-srv
+    type: nodejs
+    path: gen/srv
+    parameters:
+      buildpack: nodejs_buildpack
+      readiness-health-check-type: http
+      readiness-health-check-http-endpoint: /health
+    build-parameters:
+      builder: npm
+    provides:
+      - name: srv-api # required by consumers of CAP services (e.g. approuter)
+        properties:
+          srv-url: ${default-url}
+    requires:
+      - name: fiori-auth
+      - name: fiori-destination
+      - name: fiori-messaging
+      - name: samples-db
+
+  - name: fiori
+    type: approuter.nodejs
+    path: app/router
+    parameters:
+      keep-existing-routes: true
+      disk-quota: 256M
+      memory: 256M
+    requires:
+      - name: srv-api
+        group: destinations
+        properties:
+          name: srv-api # must be used in xs-app.json as well
+          url: ~{srv-url}
+          forwardAuthToken: true
+      - name: fiori-auth
+
+resources:
+  - name: fiori-auth
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: xsuaa
+      service-plan: application
+      path: ./xs-security.json
+      config:
+        xsappname: fiori-${org}-${space}
+        tenant-mode: dedicated
+  - name: fiori-destination
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: destination
+      service-plan: lite
+  - name: fiori-messaging
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: enterprise-messaging
+      service-plan: default
+      path: ./event-mesh.json

fiori/package.json

@@ -5,11 +5,13 @@
     "@capire/bookstore": "*",
     "@sap/cds": ">=5",
     "@cap-js-community/odata-v2-adapter": "^1",
-    "express": "^4.17.1",
+    "express": "^4.17.1"
-    "passport": ">=0.4.1"
+  },
+  "devDependencies": {
+    "@cap-js/sqlite": "^1"
   },
   "scripts": {
-    "start": "cds run --in-memory?",
+    "start": "cds-serve",
     "watch": "cds watch"
   },
   "cds": {
@@ -22,9 +24,6 @@
         "kind": "odata",
         "model": "@capire/orders"
       },
-      "self": {
-        "model": "@capire/fiori"
-      },
       "messaging": {
         "[production]": {
           "kind": "enterprise-messaging"
@@ -39,6 +38,15 @@
       "db": {
         "kind": "sql"
       },
+      "[multimodule]": {
+        "db": {
+          "kind": "sqlite",
+          "impl": "@cap-js/sqlite",
+          "credentials": {
+            "url": "../db.sqlite"
+          }
+        }
+      },
       "db-ext": {
         "[development]": {
           "model": "db/sqlite"
@@ -51,5 +59,10 @@
     "hana": {
       "deploy-format": "hdbtable"
     }
-  }
+  },
+  "sapux": [
+    "app/admin-authors",
+    "app/admin-books",
+    "app/browse"
+  ]
 }

fiori/xs-security.json

@@ -0,0 +1,22 @@
+{
+  "scopes": [
+    {
+      "name": "$XSAPPNAME.emcallback",
+      "description": "Enterprise-Messaging Callback Access",
+      "grant-as-authority-to-apps": [
+        "$XSSERVICENAME(fiori-messaging)"
+      ]
+    },
+    {
+      "name": "$XSAPPNAME.emmanagement",
+      "description": "Enterprise-Messaging Management Access"
+    }
+  ],
+  "attributes": [],
+  "role-templates": [],
+  "authorities-inheritance": false,
+  "authorities": [
+    "$XSAPPNAME.emmanagement",
+    "$XSAPPNAME.mtcallback"
+  ]
+}

hello/srv/world.ts

@@ -1,4 +1,4 @@
-import type { Request } from "@sap/cds/apis/services"
+import { Request } from "@sap/cds"
 
 module.exports = class say {
     hello(req: Request) {

loggers/package.json

@@ -11,7 +11,7 @@
     "express": "^4.17.1"
   },
   "scripts": {
-    "start": "cds run",
+    "start": "cds-serve",
     "watch": "cds watch"
   },
   "cds": {

mta.yaml

@@ -0,0 +1,27 @@
+_schema-version: '3.1'
+ID: capire.samples
+version: 2.0.0
+description: "A monorepo with several samples for CAP."
+parameters:
+  enable-parallel-deployments: true
+build-parameters:
+  before-all:
+    - builder: custom
+      commands:
+        - npm ci
+        - npx cds build --production --ws
+modules:
+  - name: samples-db-deployer
+    type: hdb
+    path: gen/db
+    parameters:
+      buildpack: nodejs_buildpack
+    requires:
+      - name: samples-db
+
+resources:
+  - name: samples-db
+    type: com.sap.xs.hdi-container
+    parameters:
+      service: hana
+      service-plan: hdi-shared

orders/app/orders/webapp/i18n/i18n.properties

@@ -2,7 +2,7 @@
 # __ldi.translation.uuid=c3431418-9caf-11e8-98d0-529269fb1459
 
 # JCI app descriptor contains lower case TITLE
-appTitle=Bookshop Sample
+appTitle=Manage Orders
 
 # JCI app descriptor contains lower case DESCRIPTION
 appSubTitle=CAP Sample Application

orders/app/router/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "approuter",
+  "dependencies": {
+    "@sap/approuter": "^16.0.0"
+  },
+  "engines": {
+    "node": "^20.0.0"
+  },
+  "scripts": {
+    "start": "node node_modules/@sap/approuter/approuter.js"
+  }
+}

orders/app/router/xs-app.json

@@ -0,0 +1,22 @@
+{
+  "welcomeFile": "app/index.html",
+  "routes": [
+    {
+      "source": "^/app/(.*)$",
+      "target": "$1",
+      "localDir": ".",
+      "cacheControl": "no-cache, no-store, must-revalidate"
+    },
+    {
+      "source": "^/appconfig/",
+      "localDir": ".",
+      "cacheControl": "no-cache, no-store, must-revalidate"
+    },
+    {
+      "source": "^/(.*)$",
+      "target": "$1",
+      "destination": "srv-api",
+      "csrfProtection": true
+    }
+  ]
+}

orders/cds-plugin.js

@@ -1,3 +0,0 @@
-cds.once('bootstrap',(app)=>{
-  app.serve ('/orders') .from('@capire/orders','app/orders')
-})

orders/mta.yaml

@@ -0,0 +1,55 @@
+_schema-version: '3.1'
+ID: capire.orders
+version: 1.0.0
+description: "A simple CAP project."
+parameters:
+  enable-parallel-deployments: true
+build-parameters:
+  before-all:
+    - builder: custom
+      commands:
+        - npm ci
+        - npx cds build --production
+modules:
+  - name: orders-srv
+    type: nodejs
+    path: gen/srv
+    parameters:
+      buildpack: nodejs_buildpack
+      readiness-health-check-type: http
+      readiness-health-check-http-endpoint: /health
+    build-parameters:
+      builder: npm
+    provides:
+      - name: srv-api # required by consumers of CAP services (e.g. approuter)
+        properties:
+          srv-url: ${default-url}
+    requires:
+      - name: orders-auth
+
+  - name: orders
+    type: approuter.nodejs
+    path: app/router
+    parameters:
+      keep-existing-routes: true
+      disk-quota: 256M
+      memory: 256M
+    requires:
+      - name: srv-api
+        group: destinations
+        properties:
+          name: srv-api # must be used in xs-app.json as well
+          url: ~{srv-url}
+          forwardAuthToken: true
+      - name: orders-auth
+
+resources:
+  - name: orders-auth
+    type: org.cloudfoundry.managed-service
+    parameters:
+      service: xsuaa
+      service-plan: application
+      path: ./xs-security.json
+      config:
+        xsappname: orders-${org}-${space}
+        tenant-mode: dedicated

orders/package.json

@@ -7,8 +7,15 @@
   },
   "cds": {
     "requires": {
-      "orders-service": {
+      "db": { "kind": "sql" },
-        "model": "@capire/orders"
+      "[multimodule]": {
+        "db": {
+          "kind": "sqlite",
+          "impl": "@cap-js/sqlite",
+          "credentials": {
+            "url": "../db.sqlite"
+          }
+        }
       }
     }
   }

orders/xs-security.json

@@ -0,0 +1,5 @@
+{
+  "scopes": [],
+  "attributes": [],
+  "role-templates": []
+}

package.json

@@ -5,6 +5,7 @@
   "repository": "https://github.com/sap-samples/cloud-cap-samples.git",
   "author": "daniel.hutzel@sap.com",
   "dependencies": {
+    "@sap-cloud-sdk/resilience": "^3.14.0",
     "@sap/cds": ">=7"
   },
   "workspaces": [
@@ -20,13 +21,14 @@
     "./reviews"
   ],
   "devDependencies": {
+    "@cap-js/sqlite": "^1",
+    "@sap/cds-dk": "^7",
     "@sap/eslint-plugin-cds": "^2.6.1",
     "axios": "^1",
     "chai": "^4.3.4",
     "chai-as-promised": "^7.1.1",
     "chai-subset": "^1.6.0",
-    "semver": "^7",
+    "semver": "^7"
-    "sqlite3": "^5"
   },
   "scripts": {
     "cleanup": "rm -rf node_modules && rm -rf */node_modules && rm -rf */*/node_modules",
@@ -51,6 +53,16 @@
     "parallel": true,
     "timeout": 6666
   },
+  "cds": {
+    "requires": {
+      "db": {
+        "kind": "sql",
+        "[development]": {
+          "model": "db/sqlite"
+        }
+      }
+    }
+  },
   "license": "SEE LICENSE IN LICENSE",
   "private": true
 }

reviews/cds-plugin.js

@@ -1,3 +0,0 @@
-cds.once('bootstrap',(app)=>{
-  app.serve ('/reviews') .from ('@capire/reviews','app/vue')
-})

reviews/package.json

@@ -12,16 +12,22 @@
   },
   "cds": {
     "requires": {
-      "ReviewsService": {
-        "kind": "odata",
-        "model": "@capire/reviews"
-      },
       "messaging": {
         "[development]": { "kind": "file-based-messaging" },
         "[hybrid]": { "kind": "enterprise-messaging-shared" },
         "[production]": { "kind": "enterprise-messaging" }
       },
-      "db": { "kind": "sql" }
+      
+      "db": { "kind": "sql" },
+      "[multimodule]": {
+        "db": {
+          "kind": "sqlite",
+          "impl": "@cap-js/sqlite",
+          "credentials": {
+            "url": "../db.sqlite"
+          }
+        }
+      }
     }
   }
 }

samples.md

@@ -3,6 +3,8 @@
 The following list gives an overview of the samples provided in subdirectories.
 Each sub directory essentially is an individual npm package arranged in an [all-in-one monorepo](#all-in-one-monorepo) umbrella setup.
 
+![](etc/samples.drawio.svg)
+
 
 ## [@capire/hello-world](hello)
 
@@ -53,7 +55,7 @@ Each sub directory essentially is an individual npm package arranged in an [all-
 
 ## [@capire/bookstore](bookstore)
 
-- A [composite app, reusing and combining](https://cap.cloud.sap/docs/guides/verticalize) these packages:
+- A [composite app, reusing and combining](https://cap.cloud.sap/docs/guides/extensibility/composition) these packages:
   - [@capire/bookshop](bookshop)
   - [@capire/reviews](reviews)
   - [@capire/orders](orders)

test/cds.ql.test.js

@@ -676,7 +676,7 @@ describe('cds.ql → cqn', () => {
         .to.eql(INSERT.into(Foo).entries(...entries))
         .to.eql(INSERT.into(Foo).entries(entries))
         .to.eql({
-          INSERT: { into: 'Foo', entries },
+          INSERT: { into: cds.env.ql.quirks_mode ? 'Foo' : { ref: ['Foo'] }, entries },
         })
     })
 
@@ -692,7 +692,7 @@ describe('cds.ql → cqn', () => {
         .to.eql(INSERT.into(Foo).columns('a', 'b').rows([1, 2], [3, 4]))
         .to.eql({
           INSERT: {
-            into: 'Foo',
+            into: cds.env.ql.quirks_mode ? 'Foo' : { ref: ['Foo'] },
             columns: ['a', 'b'],
             rows: [
               [1, 2],
@@ -706,7 +706,7 @@ describe('cds.ql → cqn', () => {
       expect(INSERT.into(Foo).columns('a', 'b').values([1, 2]))
         .to.eql(INSERT.into(Foo).columns('a', 'b').values(1, 2))
         .to.eql({
-          INSERT: { into: 'Foo', columns: ['a', 'b'], values: [1, 2] },
+          INSERT: { into:  cds.env.ql.quirks_mode ? 'Foo' : { ref: ['Foo'] }, columns: ['a', 'b'], values: [1, 2] },
         })
     })
 
@@ -721,7 +721,7 @@ describe('cds.ql → cqn', () => {
     test('entity (..., <key>)', () => {
       const cqnWhere = {
           UPDATE: {
-            entity: 'capire.bookshop.Books',
+            entity: cds.env.ql.quirks_mode ? 'capire.bookshop.Books' : { ref: ['capire.bookshop.Books'] },
             where: [{ ref: ['ID'] }, '=', { val: 4711 }],
           },
         }
@@ -765,7 +765,7 @@ describe('cds.ql → cqn', () => {
         .to.eql(UPDATE(Foo).with({ foo: 11, bar: { '-=': 22 } }))
         .to.eql({
           UPDATE: {
-            entity: 'Foo',
+            entity: cds.env.ql.quirks_mode ? 'Foo' : { ref: ['Foo'] },
             data: { foo: 11 },
             with: {
               bar: { xpr: [{ ref: ['bar'] }, '-', { val: 22 }] },
@@ -776,7 +776,7 @@ describe('cds.ql → cqn', () => {
       // some more
       expect(UPDATE(Foo).with(`bar = coalesce(x,y), car = 'foo''s bar, car'`)).to.eql({
         UPDATE: {
-          entity: 'Foo',
+          entity: cds.env.ql.quirks_mode ? 'Foo' : { ref: ['Foo'] },
           data: {
             car: "foo's bar, car",
           },
@@ -796,7 +796,7 @@ describe('cds.ql → cqn', () => {
     test('from (..., <key>)', () => {
       const cqnWhere = {
           DELETE: {
-            from: 'capire.bookshop.Books',
+            from: cds.env.ql.quirks_mode ? 'capire.bookshop.Books' : { ref: ['capire.bookshop.Books'] },
             where: [{ ref: ['ID'] }, '=', { val: 4711 }],
           },
         }

test/hierarchical-data.test.js

@@ -1,4 +1,5 @@
 const cds = require('@sap/cds/lib')
+const { expect } = cds.test.in(__dirname,'..')
 
 describe('cap/samples - Hierarchical Data', ()=>{
 
@@ -12,7 +13,6 @@ describe('cap/samples - Hierarchical Data', ()=>{
 	`
 	const model = cds.compile.for.nodejs(csn)
 	const {Categories:Cats} = model.definitions
-	const {expect} = cds.test
 
 	before ('bootstrap sqlite in-memory db...', async()=>{
 		await cds.deploy (csn) .to ('sqlite::memory:') // REVISIT: cds.compile.to.sql should accept cds.compiled.for.nodejs models
@@ -33,22 +33,51 @@ describe('cap/samples - Hierarchical Data', ()=>{
 		]}
 	))
 
+	it ('should generate correct queries for expands', ()=>{
+		let q = SELECT.from (Cats, c => { c.ID, c.name, c.children (c => c.name) })
+		expect (q) .to.eql ({
+			SELECT: {
+				from: { ref:[ "Categories" ] },
+				columns: [
+					{ ref: [ "ID" ] },
+					{ ref: [ "name" ] },
+					{ ref: [ "children" ], expand: [ {ref:['name']} ] },
+				]
+			}
+		})
+		if (q.forSQL) expect (q.forSQL()) .to.eql ({
+			SELECT: {
+				from: { ref:[ "Categories" ], as: "Categories" },
+				columns: [
+					{ ref: [ "Categories", "ID" ] },
+					{ ref: [ "Categories", "name" ] },
+					{ as: "children", SELECT: { expand: true,
+						one: false,
+						columns: [{ ref: [ "children", "name" ]}],
+						from: { ref:["Categories"], as: "children" },
+						where: [
+							{ref:[ "Categories", "ID" ]}, "=", {ref:[ "children", "parent_ID" ]}
+						],
+					}},
+				],
+			}
+		})
+		if (q.toSql) expect (q.toSql()) .to.eql (
+			`SELECT json_insert('{}',` +
+				`'$."ID"',ID,` +
+				`'$."name"',name,` +
+				`'$."children"',children->'$'` +
+			`) as _json_ FROM (` +
+				`SELECT Categories.ID,Categories.name,(` +
+					`SELECT jsonb_group_array(jsonb_insert('{}','$."name"',name)) as _json_ FROM (` +
+						`SELECT children.name FROM Categories as children WHERE Categories.ID = children.parent_ID` +
+					`)` +
+				`) as children FROM Categories as Categories` +
+			`)`
+		)
+	})
+
 	it ('supports nested reads', async()=>{
-		if (require('semver').gte(cds.version, '5.9.0')) {
-			expect (await
-				SELECT.one.from (Cats, c=>{
-					c.ID, c.name.as('parent'), c.children (c=>{
-						c.name.as('child')
-					})
-				}) .where ({name:'Cat'})
-			) .to.eql (
-				{ ID:101, parent:'Cat', children:[
-					{ child:'Kitty' },
-					{ child:'Catwoman' },
-				]}
-			)
-			return
-		}
 		expect (await
 			SELECT.one.from (Cats, c=>{
 				c.ID, c.name.as('parent'), c.children (c=>{
@@ -57,32 +86,13 @@ describe('cap/samples - Hierarchical Data', ()=>{
 			}) .where ({name:'Cat'})
 		) .to.eql (
 			{ ID:101, parent:'Cat', children:[
-				{ ID:102, child:'Kitty' },
+				{ child:'Kitty' },
-				{ ID:106, child:'Catwoman' },
+				{ child:'Catwoman' },
 			]}
 		)
 	})
 
 	it ('supports deeply nested reads', async()=>{
-		if (require('semver').gte(cds.version, '5.9.0')) {
-			expect (await SELECT.one.from (Cats, c=>{
-				c.ID, c.name, c.children (
-					c => { c.name },
-					{levels:3}
-				)
-			}) .where ({name:'Cat'})
-			) .to.eql (
-				{ ID:101, name:'Cat', children:[
-					{ name:'Kitty', children:[
-						{ name:'Kitty Cat', children:[
-							{ name:'Aristocat' }, ]},  // level 3
-						{ name:'Kitty Bat', children:[] }, ]},
-					{ name:'Catwoman', children:[
-						{ name:'Catalina', children:[] } ]},
-				]}
-			)
-			return
-		}
 		expect (await SELECT.one.from (Cats, c=>{
 			c.ID, c.name, c.children (
 				c => { c.name },
@@ -91,12 +101,12 @@ describe('cap/samples - Hierarchical Data', ()=>{
 		}) .where ({name:'Cat'})
 		) .to.eql (
 			{ ID:101, name:'Cat', children:[
-				{ ID:102, name:'Kitty', children:[
+				{ name:'Kitty', children:[
-					{ ID:103, name:'Kitty Cat', children:[
+					{ name:'Kitty Cat', children:[
-						{ ID:104, name:'Aristocat' }, ]},  // level 3
+						{ name:'Aristocat' }, ]},  // level 3
-					{ ID:105, name:'Kitty Bat', children:[] }, ]},
+					{ name:'Kitty Bat', children:[] }, ]},
-				{ ID:106, name:'Catwoman', children:[
+				{ name:'Catwoman', children:[
-					{ ID:107, name:'Catalina', children:[] } ]},
+					{ name:'Catalina', children:[] } ]},
 			]}
 		)
 	})

test/localized-data/package.json

@@ -0,0 +1,5 @@
+{
+  "devDependencies": {
+    "@cap-js/sqlite": "^1"
+  }
+}