add multitenancy

* chore: use newest cloud sdk version

* ci: use npm i instead of npm ci

* revert to npm ci

* update package-lock

.deploy/app-router/package.json

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

.deploy/app-router/resources/bookshop

@@ -0,0 +1 @@
+../../../bookshop/app/vue

.deploy/app-router/resources/orders

@@ -0,0 +1 @@
+../../../orders/app/orders

.deploy/app-router/resources/reviews

@@ -0,0 +1 @@
+../../../reviews/app/vue

.deploy/app-router/xs-app.json

@@ -0,0 +1,46 @@
+{
+  "welcomeFile": "app/bookshop/index.html",
+  "routes": [
+    {
+      "source": "^/-/cds/.*",
+      "destination": "mtx-api",
+      "authenticationType": "none"
+    },
+    {
+      "source": "^/app/(.*)$",
+      "target": "$1",
+      "localDir": "resources",
+      "cacheControl": "no-cache, no-store, must-revalidate"
+    },
+    {
+      "source": "^/admin/(.*)$",
+      "target": "/admin/$1",
+      "destination": "bookstore-api",
+      "csrfProtection": true
+    },
+    {
+      "source": "^/browse/(.*)$",
+      "target": "/browse/$1",
+      "destination": "bookstore-api",
+      "csrfProtection": true
+    },
+    {
+      "source": "^/user/(.*)$",
+      "target": "/user/$1",
+      "destination": "bookstore-api",
+      "csrfProtection": true
+    },
+    {
+      "source": "^/odata/v4/orders/(.*)$",
+      "target": "/odata/v4/orders/$1",
+      "destination": "orders-api",
+      "csrfProtection": true
+    },
+    {
+      "source": "^/reviews/(.*)$",
+      "target": "/reviews/$1",
+      "destination": "reviews-api",
+      "csrfProtection": true
+    }
+  ]
+}

.eslintrc

@@ -1,31 +0,0 @@
-{
-  "extends": [
-    "plugin:@sap/cds/recommended",
-    "eslint:recommended"
-  ],
-  "env": {
-    "browser": true,
-    "es2022": true,
-    "node": true,
-    "jest": true,
-    "mocha": true
-  },
-  "globals": {
-    "SELECT": true,
-    "INSERT": true,
-    "UPSERT": true,
-    "UPDATE": true,
-    "DELETE": true,
-    "CREATE": true,
-    "DROP": true,
-    "CDL": true,
-    "CQL": true,
-    "cds": true
-  },
-  "rules": {
-    "no-console": "off",
-    "require-atomic-updates": "off",
-        "require-await":"warn",
-        "no-unused-vars": ["warn", { "argsIgnorePattern": "_" }]
-  }
-}

.github/dependabot.yml

@@ -5,4 +5,16 @@ 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"]
+    - dependency-name: "chai-as-promised"
+        # chai-as-promised 8 doesn't work atm w/ cds.test, TODO fix that in cds.test
+      versions: ["8.x"]

.github/workflows/node.js.yml

@@ -11,19 +11,28 @@ on:
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [18.x, 16.x, 14.x]
+        node-version: [22.x, 20.x, 18.x]
 
     steps:
-    - uses: actions/checkout@v2
+    - uses: actions/checkout@v4
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
-    - run: npm i -g npm@8
     - run: npm ci
     - run: npm test
+
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version: 22.x
+    - run: npm ci
+    - run: npm run lint

.gitignore

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

.npmrc

@@ -1,3 +0,0 @@
-# Ensure we always use public packages, i.e. avoid using local registries from ~/.npmrc
-@sap:registry=https://registry.npmjs.org/
-registry=https://registry.npmjs.org/

.reuse/dep5

@@ -24,6 +24,6 @@ Disclaimer: The code in this project may include calls to APIs (“API Calls”)
  you any rights to use or access any SAP External Product, or provide any third
  parties the right to use of access any SAP External Product, through API Calls.
 
-Files: *
+Files: *.*
-Copyright: 2019-2020 SAP SE or an SAP affiliate company and cap-cloud-samples
+Copyright: 2019-2025 SAP SE or an SAP affiliate company and cap-cloud-samples
 License: Apache-2.0

.tours/db-native.tour

@@ -1,117 +0,0 @@
-{
-  "$schema": "https://aka.ms/codetour-schema",
-  "title": "Database Functions",
-  "steps": [
-    {
-      "title": "Introduction",
-      "description": "### Database Functions in CDS Models\n\nIn this tour, you'll learn how to add database-specific functions to CDS models in your application."
-    },
-    {
-      "file": "bookshop/db/schema.cds",
-      "description": "#### Basic Schema\n\nWe want to add two fields to the `Authors` entity, one for the author's age and one for the span of years that she or he lived.\n\nThese two fields can be computed out of the existing `dateOfBirth` and `dateOfDeath` fields.",
-      "selection": {
-        "start": {
-          "line": 19,
-          "character": 1
-        },
-        "end": {
-          "line": 21,
-          "character": 1
-        }
-      },
-      "title": "Base fields in Author"
-    },
-    {
-      "file": "bookshop/srv/admin-service.cds",
-      "description": "This is how the `Authors` entity gets exposed in an OData or REST service.\n\nIn the next step, you'll see how we extend this projection.",
-      "selection": {
-        "start": {
-          "line": 4,
-          "character": 1
-        },
-        "end": {
-          "line": 5,
-          "character": 1
-        }
-      },
-      "title": "Authors service"
-    },
-    {
-      "file": "fiori/db/sqlite/index.cds",
-      "description": "#### SQLite Implementation\n\nHere's the first implementation for SQLite.  It computes the two fields `age` and `lifetime` through SQLite's [strftime](https://sqlite.org/lang_datefunc.html) function.\n\nThrough the [`extend projection`](https://cap.cloud.sap/docs/cds/cdl#extend-view) clause you can add additional fields to projection entities.  These are deployed as database views, which is why we can integrate the database functions in the first place.\n",
-      "selection": {
-        "start": {
-          "line": 7,
-          "character": 1
-        },
-        "end": {
-          "line": 11,
-          "character": 1
-        }
-      },
-      "title": "SQLite implementation"
-    },
-    {
-      "file": "fiori/db/hana/index.cds",
-      "description": "#### SAP HANA Implementation\n\nThis is the second implementation for SAP HANA.  It computes the same two fields `age` and `lifetime` through the [YEARS_BETWEEN](https://help.sap.com/viewer/7c78579ce9b14a669c1f3295b0d8ca16/Cloud/en-US/7c0d2c161ea34def86de3f5eadd6a0af.html) and [YEAR](https://help.sap.com/viewer/7c78579ce9b14a669c1f3295b0d8ca16/Cloud/en-US/20f5fac6751910148dabd3c6821f907d.html) functions of SAP HANA.\n\n#### File Layout and Code Structure\n\nNote the path of the `.cds` file we are in: it's in a subfolder of `db`, so that it's _not_ automatically picked up when we start the application.  The same is true for the SQLite implementation: it's in a separate `db/sqlite/` folder as well.  In the next step, you'll see how these files are loaded.\n\nAlso, we choose to implement all of that as an extension of the original bookshop here in the _fiori_ package.  See the first [CAP Samples] code tour for more details on the different packages of this repository.",
-      "selection": {
-        "start": {
-          "line": 7,
-          "character": 1
-        },
-        "end": {
-          "line": 11,
-          "character": 1
-        }
-      },
-      "title": "SAP HANA implementation"
-    },
-    {
-      "file": "fiori/package.json",
-      "description": "#### Configuration\n\nThe `cds.requires` section in `package.json` is a place to configure which of the `db/sqlite` and `db/hana` folders are used for which database.\n\nWe use [Node.js profiles](https://cap.cloud.sap/docs/node.js/cds-env#profiles) to separate the configuration.\nIn the `development` profile, you can see that `db/sqlite` is set as the model, while the `db/hana` folder is configured in the `production` profile.  `db-ext` is a pseudo datasource, its name doesn't matter.\n\nSee [`cds.resolve`](https://cap.cloud.sap/docs/node.js/cds-compile#cds-resolve) to learn more about how models are found.",
-      "selection": {
-        "start": {
-          "line": 41,
-          "character": 1
-        },
-        "end": {
-          "line": 48,
-          "character": 1
-        }
-      },
-      "title": "Configuration"
-    },
-    {
-      "file": "fiori/package.json",
-      "description": "#### Run with SQLite\n\nTo run with `development` and an in-memory SQLite database, you don't need to do anything special, because it's activated by default.  Just run:\n\n>> cds watch fiori\n\nThen open [http://localhost:4004/admin/Authors](http://localhost:4004/admin/Authors) to see the two new fields.\n",
-      "line": 43,
-      "title": "Run with SQLite"
-    },
-    {
-      "file": "fiori/package.json",
-      "description": "#### Deploy the CDS Model to SAP HANA\n\nTo 'activate' SAP HANA through the `production` profile, you can use the global `--production` flag:\n\n>> cd fiori; cds deploy --to hana --production\n\n[Learn more about SAP HANA deployment](https://cap.cloud.sap/docs/guides/databases#get-hana)\n\n#### Run the Application\n\n>> cd fiori; cds watch --production\n\nThe service on [http://localhost:4004/admin/Authors](http://localhost:4004/admin/Authors) is the same as before, but this time the `Authors` entity is backed by a database view with an SAP HANA function.\n\n#### More\n\nIf you don't see data, you can add some in the next step.",
-      "line": 46,
-      "title": "Run with SAP HANA"
-    },
-    {
-      "file": "fiori/test/requests.http",
-      "description": "### Add More Data\n\nOptionally you can add some `Authors` data by clicking on the _Send Request_ link (provided by the [REST client](https://marketplace.visualstudio.com/items?itemName=humao.rest-client) extension).",
-      "line": 72,
-      "selection": {
-        "start": {
-          "line": 67,
-          "character": 1
-        },
-        "end": {
-          "line": 73,
-          "character": 1
-        }
-      },
-      "title": "Add Data"
-    },
-    {
-      "title": "Wrap-up",
-      "description": "### Summary\n\nThat's it!  You have seen: \n- How to integrate database-specific functions in a CDS model.\n- How to switch between the two implementations for SQLite and SAP HANA."
-    }
-  ]
-}

.tours/samples.tour

@@ -1,139 +0,0 @@
-{
-  "$schema": "https://aka.ms/codetour-schema",
-  "title": "CAP Samples",
-  "steps": [
-    {
-      "title": "Welcome",
-      "file": "README.md",
-      "description": "### Welcome to CAP Samples!\n\nThis tour leads you through a collection of samples for the [SAP Cloud Application Programming Model (CAP)](https://cap.cloud.sap).\nYou will learn which features of the programming model are demonstrated in which sample.\n\nLet's start!",
-      "line": 2,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 3,
-          "character": 108
-        }
-      }
-    },
-    {
-      "file": "hello/srv/world.cds",
-      "description": "### Hello World!\n\nThis is a simplistic [Hello World](https://cap.cloud.sap/docs/get-started/hello-world) service using [CDS](https://cap.cloud.sap/docs/cds/) and [cds.services](https://cap.cloud.sap/docs/node.js/api#services-api).",
-      "line": 2,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 4,
-          "character": 1
-        }
-      },
-      "title": "Hello World!"
-    },
-    {
-      "file": "bookshop/db/schema.cds",
-      "description": "### A Bookshop!\n\nIntroduces:\n- [Project Setup](https://cap.cloud.sap/docs/get-started/) and [Layouts](https://cap.cloud.sap/docs/get-started/projects)\n- [Domain Modeling](https://cap.cloud.sap/docs/guides/domain-models)\n- [Defining Services](https://cap.cloud.sap/docs/guides/providing-services)\n- [Generic Providers](https://cap.cloud.sap/docs/guides/generic-providers)\n- [Adding Custom Logic](https://cap.cloud.sap/docs/guides/service-impl)\n- [Using Databases](https://cap.cloud.sap/docs/guides/databases)\n",
-      "line": 1,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 32,
-          "character": 1
-        }
-      },
-      "title": "Bookshop"
-    },
-    {
-      "file": "common/index.cds",
-      "description": "### Extend and Reuse\n\nShowcases how to extend [@sap/cds/common](https://cap.cloud.sap/docs/cds/common) thereby covering:\n- Building [extension packages](https://cap.cloud.sap/docs/guides/domain-models#aspects-extensibility)\n- Providing [reuse packages](https://cap.cloud.sap/docs/get-started/projects#sharing-and-reusing-content)\n- [Verticalization](https://cap.cloud.sap/docs/cds/common#adapting-to-your-needs)\n- Using [Aspects](https://cap.cloud.sap/docs/cds/cdl#aspects)\n- Used in the [fiori app sample](#fiori)\n",
-      "line": 1,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 46,
-          "character": 1
-        }
-      },
-      "title": "Common"
-    },
-    {
-      "file": "orders/db/schema.cds",
-      "description": "### Orders - Compositions and Serving Documents\n\nA standalone orders management service, demonstrating:\n- Using [Compositions](https://cap.cloud.sap/docs/cds/cdl#compositions) in [Domain Models](https://cap.cloud.sap/docs/guides/domain-models), along with\n- [Serving deeply nested documents](https://cap.cloud.sap/docs/guides/generic-providers#serving-structured-data)\n",
-      "line": 1,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 27,
-          "character": 1
-        }
-      },
-      "title": "Orders"
-    },
-    {
-      "file": "reviews/db/schema.cds",
-      "description": "### Reviews - More Modularity\n\nShows how to implement a modular service to manage product reviews, including:\n- Consuming other services synchronously and asynchronously\n- Serving requests synchronously\n- Emitting events asynchronously\n- Grow as you go, with:\n- Mocking app services\n- Running service meshes\n- Late-cut Micro Services\n- As well as managed data, input validations, and authorization\n",
-      "line": 1,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 39,
-          "character": 1
-        }
-      },
-      "title": "Reviews"
-    },
-    {
-      "title": "Bookstore",
-      "description": "### Bookstore - Reuse and UI\n\n- A [composite app, reusing and combining](https://cap.cloud.sap/docs/guides/reuse-and-compose) these packages:\n  - [@capire/bookshop](bookshop)\n  - [@capire/reviews](reviews)\n  - [@capire/orders](orders)\n  - [@capire/common](common)\n- [The Vue.js app](bookshop/app/vue) imported from bookshop is served as well\n- [The Vue.js app](reviews/app/vue) imported from reviews is served as well\n- [The Fiori app](orders/app) imported from orders is served as well\n- [OpenAPI export + Swagger UI](https://cap.cloud.sap/docs/advanced/openapi)"
-    },
-    {
-      "file": "fiori/app/services.cds",
-      "description": "### Annotations for SAP Fiori Elements\n\nAdds an SAP Fiori elements application to bookstore, thereby introducing:\n- OData Annotations in `.cds` files\n- Support for Fiori Draft\n- Support for Value Helps\n- Serving SAP Fiori apps locally\n\nSee the [Serving Fiori UIs](https://cap.cloud.sap/docs/advanced/fiori) documentation for more information.",
-      "line": 1,
-      "selection": {
-        "start": {
-          "line": 1,
-          "character": 1
-        },
-        "end": {
-          "line": 13,
-          "character": 1
-        }
-      },
-      "title": "Fiori"
-    },
-    {
-      "file": "package.json",
-      "description": "### All-in-one Monorepo\n\nEach sample sub directory essentially is a standard npm package, some with standard npm dependencies to other samples. The root folder's [package.json](package.json) has local links to the sub folders, such that an `npm install` populates a local `node_modules` folder acts like a local npm registry to the individual sample packages.\n",
-      "selection": {
-        "start": {
-          "line": 8,
-          "character": 1
-        },
-        "end": {
-          "line": 16,
-          "character": 1
-        }
-      },
-      "title": "Packages"
-    }
-  ],
-  "isPrimary": true,
-  "description": "Overview of CAP Samples for Node.js"
-}

.vscode/extensions.json

@@ -4,15 +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"
 	],
 	// List of extensions recommended by VS Code that should not be recommended for users of this workspace.
 	"unwantedRecommendations": [

.vscode/settings.json

@@ -1,9 +1,8 @@
 {
   "files.exclude": {
-    ".reuse/**": true,
+    "**/node_modules": true,
-    "**/.gitignore": true,
+    "LICENSES": true,
-    "**/.vscode": true,
+    ".reuse": true
-    "LICENSES/**": true
   },
   "debug.javascript.terminalOptions": {
     "skipFiles": [
@@ -14,14 +13,5 @@
       "**/odata-v4/okra/**"
     ]
   },
-  "mochaExplorer.debuggerConfig": "Debug Mocha Tests",
+  "jest.jestCommandLine": "npx jest"
-  "mochaExplorer.parallel": true,
-  "eslint.probe": [
-    "cds",
-    "csn",
-    "csv",
-    "csv (semicolon)",
-    "tsv",
-    "tab"
-  ]
 }

README.md

@@ -1,87 +0,0 @@
-# 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)
-
-![](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/))
-2. Install [**@sap/cds-dk**](https://cap.cloud.sap/docs/get-started/) globally:
-
-   ```sh
-   npm i -g @sap/cds-dk
-   ```
-
-3. _Optional:_ [Use Visual Studio Code](https://cap.cloud.sap/docs/get-started/tools#vscode)
-
-### Download
-
-If you've [Git](https://git-scm.com/downloads) installed, clone this repo as shown below, otherwise [download as ZIP file](archive/main.zip).
-
-```sh
-git clone https://github.com/sap-samples/cloud-cap-samples samples
-cd samples
-```
-
-### Setup
-
-In the samples folder run:
-
-```sh
-npm install
-```
-
-### Run
-
-With that you're ready to run the samples, for example:
-
-```sh
-cds watch bookshop
-```
-
-After that open this link in your browser: [http://localhost:4004](http://localhost:4004)
-
-When asked to log in, type `alice` as user and leave the password field blank, which is the [default user](https://cap.cloud.sap/docs/node.js/authentication#mocked).
-
-### Testing
-
-Run the provided tests with [_jest_](http://jestjs.io) or [_mocha_](http://mochajs.org), for example:
-
-```sh
-npx jest
-```
-> While mocha is a bit smaller and faster, jest runs tests in parallel and isolation, which allows to run all tests.
-
-
-### Serve `npm`
-
-We've included a simple npm registry mock, which allows you to do an `npm install @capire/<package>` locally. Use it as follows:
-
-1. Start the @capire registry:
-```sh
-npm run registry
-```
-> While running this will have `@capire:registry=http://localhost:4444` set with npmrc.
-
-2. Install one of the @capire packages wherever you like, for example:
-
-```sh
-npm add @capire/common @capire/bookshop
-```
-
-
-## Code Tours
-
-Take one of the [guided tours](.tours) in VS Code through our CAP samples and learn which CAP features are showcased by the different parts of the repository. Just install the [CodeTour extension](https://marketplace.visualstudio.com/items?itemName=vsls-contrib.codetour) for VS Code. We'll add more code tours in the future. Stay tuned!
-
-## Get Support
-
-Check out the documentation at [https://cap.cloud.sap](https://cap.cloud.sap). <br>
-In case you've a question, find a bug, or otherwise need support, use our [community](https://answers.sap.com/tags/9f13aee1-834c-4105-8e43-ee442775e5ce) to get more visibility.
-
-
-## License
-
-Copyright (c) 2022 SAP SE or an SAP affiliate company. All rights reserved. This file is licensed under the Apache Software License, version 2.0 except as noted otherwise in the [LICENSE](LICENSE) file.

bookshop/app/vue/app.js

@@ -19,7 +19,7 @@ const books = Vue.createApp ({
         search: ({target:{value:v}}) => books.fetch(v && '&$search='+v),
 
         async fetch (etc='') {
-            const {data} = await GET(`/ListOfBooks?$expand=genre,currency${etc}`)
+            const {data} = await GET(`/ListOfBooks?$expand=genre($select=name),currency($select=symbol)${etc}`)
             books.list = data.value
         },
 
@@ -77,7 +77,7 @@ function csrfToken (request) {
         document.csrfToken = token
         request.headers['x-csrf-token'] = document.csrfToken
         return request
-    }).catch(_ => {
+    }).catch(() => {
         document.csrfToken = null // set mark to not try again
         return request
     })

bookshop/app/vue/index.html

@@ -3,7 +3,7 @@
 
 <head>
     <title> Capire Books </title>
-    <link rel="stylesheet" href="https://unpkg.com/primitive-ui/dist/css/main.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/primitive-ui/dist/css/main.css">
     <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js"></script>
     <style>

bookshop/db/data/sap.capire.bookshop-Books.csv

@@ -1,6 +1,6 @@
 ID,title,descr,author_ID,stock,price,currency_code,genre_ID
-201,Wuthering Heights,"Wuthering Heights, Emily Brontë's only novel, was published in 1847 under the pseudonym ""Ellis Bell"". It was written between October 1845 and June 1846. Wuthering Heights and Anne Brontë's Agnes Grey were accepted by publisher Thomas Newby before the success of their sister Charlotte's novel Jane Eyre. After Emily's death, Charlotte edited the manuscript of Wuthering Heights and arranged for the edited version to be published as a posthumous second edition in 1850.",101,12,11.11,GBP,11
+201,Wuthering Heights,"Wuthering Heights, Emily Brontë's only novel, was published in 1847 under the pseudonym ""Ellis Bell"". It was written between October 1845 and June 1846. Wuthering Heights and Anne Brontë's Agnes Grey were accepted by publisher Thomas Newby before the success of their sister Charlotte's novel Jane Eyre. After Emily's death, Charlotte edited the manuscript of Wuthering Heights and arranged for the edited version to be published as a posthumous second edition in 1850.",101,12,11.11,GBP,11aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa
-207,Jane Eyre,"Jane Eyre /ɛər/ (originally published as Jane Eyre: An Autobiography) is a novel by English writer Charlotte Brontë, published under the pen name ""Currer Bell"", on 16 October 1847, by Smith, Elder & Co. of London. The first American edition was published the following year by Harper & Brothers of New York. Primarily a bildungsroman, Jane Eyre follows the experiences of its eponymous heroine, including her growth to adulthood and her love for Mr. Rochester, the brooding master of Thornfield Hall. The novel revolutionised prose fiction in that the focus on Jane's moral and spiritual development is told through an intimate, first-person narrative, where actions and events are coloured by a psychological intensity. The book contains elements of social criticism, with a strong sense of Christian morality at its core and is considered by many to be ahead of its time because of Jane's individualistic character and how the novel approaches the topics of class, sexuality, religion and feminism.",107,11,12.34,GBP,11
+207,Jane Eyre,"Jane Eyre /ɛər/ (originally published as Jane Eyre: An Autobiography) is a novel by English writer Charlotte Brontë, published under the pen name ""Currer Bell"", on 16 October 1847, by Smith, Elder & Co. of London. The first American edition was published the following year by Harper & Brothers of New York. Primarily a bildungsroman, Jane Eyre follows the experiences of its eponymous heroine, including her growth to adulthood and her love for Mr. Rochester, the brooding master of Thornfield Hall. The novel revolutionised prose fiction in that the focus on Jane's moral and spiritual development is told through an intimate, first-person narrative, where actions and events are coloured by a psychological intensity. The book contains elements of social criticism, with a strong sense of Christian morality at its core and is considered by many to be ahead of its time because of Jane's individualistic character and how the novel approaches the topics of class, sexuality, religion and feminism.",107,11,12.34,GBP,11aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa
-251,The Raven,"""The Raven"" is a narrative poem by American writer Edgar Allan Poe. First published in January 1845, the poem is often noted for its musicality, stylized language, and supernatural atmosphere. It tells of a talking raven's mysterious visit to a distraught lover, tracing the man's slow fall into madness. The lover, often identified as being a student, is lamenting the loss of his love, Lenore. Sitting on a bust of Pallas, the raven seems to further distress the protagonist with its constant repetition of the word ""Nevermore"". The poem makes use of folk, mythological, religious, and classical references.",150,333,13.13,USD,16
+251,The Raven,"""The Raven"" is a narrative poem by American writer Edgar Allan Poe. First published in January 1845, the poem is often noted for its musicality, stylized language, and supernatural atmosphere. It tells of a talking raven's mysterious visit to a distraught lover, tracing the man's slow fall into madness. The lover, often identified as being a student, is lamenting the loss of his love, Lenore. Sitting on a bust of Pallas, the raven seems to further distress the protagonist with its constant repetition of the word ""Nevermore"". The poem makes use of folk, mythological, religious, and classical references.",150,333,13.13,USD,16aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa
-252,Eleonora,"""Eleonora"" is a short story by Edgar Allan Poe, first published in 1842 in Philadelphia in the literary annual The Gift. It is often regarded as somewhat autobiographical and has a relatively ""happy"" ending.",150,555,14,USD,15
+252,Eleonora,"""Eleonora"" is a short story by Edgar Allan Poe, first published in 1842 in Philadelphia in the literary annual The Gift. It is often regarded as somewhat autobiographical and has a relatively ""happy"" ending.",150,555,14,USD,15aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa
-271,Catweazle,"Catweazle is a British fantasy television series, starring Geoffrey Bayldon in the title role, and created by Richard Carpenter for London Weekend Television. The first series, produced and directed by Quentin Lawrence, was screened in the UK on ITV in 1970. The second series, directed by David Reid and David Lane, was shown in 1971. Each series had thirteen episodes, most but not all written by Carpenter, who also published two books based on the scripts.",170,22,150,JPY,13
+271,Catweazle,"Catweazle is a British fantasy television series, starring Geoffrey Bayldon in the title role, and created by Richard Carpenter for London Weekend Television. The first series, produced and directed by Quentin Lawrence, was screened in the UK on ITV in 1970. The second series, directed by David Reid and David Lane, was shown in 1971. Each series had thirteen episodes, most but not all written by Carpenter, who also published two books based on the scripts.",170,22,150,JPY,13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa

bookshop/db/data/sap.capire.bookshop-Books.texts.csv

@@ -1,5 +1,5 @@
-ID,locale,title,descr
+ID_texts,ID,locale,title,descr
-201,de,Sturmhöhe,"Sturmhöhe (Originaltitel: Wuthering Heights) ist der einzige Roman der englischen Schriftstellerin Emily Brontë (1818–1848). Der 1847 unter dem Pseudonym Ellis Bell veröffentlichte Roman wurde vom viktorianischen Publikum weitgehend abgelehnt, heute gilt er als ein Klassiker der britischen Romanliteratur des 19. Jahrhunderts."
+d2a65a27-9f2a-480f-bc38-84ee8ec5c13e,201,de,Sturmhöhe,"Sturmhöhe (Originaltitel: Wuthering Heights) ist der einzige Roman der englischen Schriftstellerin Emily Brontë (1818–1848). Der 1847 unter dem Pseudonym Ellis Bell veröffentlichte Roman wurde vom viktorianischen Publikum weitgehend abgelehnt, heute gilt er als ein Klassiker der britischen Romanliteratur des 19. Jahrhunderts."
-201,fr,Les Hauts de Hurlevent,"Les Hauts de Hurlevent (titre original : Wuthering Heights), parfois orthographié Les Hauts de Hurle-Vent, est l'unique roman d'Emily Brontë, publié pour la première fois en 1847 sous le pseudonyme d’Ellis Bell. Loin d'être un récit moralisateur, Emily Brontë achève néanmoins le roman dans une atmosphère sereine, suggérant le triomphe de la paix et du Bien sur la vengeance et le Mal."
+8c42c706-a979-41cf-9ffe-91e6cf1383a0,201,fr,Les Hauts de Hurlevent,"Les Hauts de Hurlevent (titre original : Wuthering Heights), parfois orthographié Les Hauts de Hurle-Vent, est l'unique roman d'Emily Brontë, publié pour la première fois en 1847 sous le pseudonyme d’Ellis Bell. Loin d'être un récit moralisateur, Emily Brontë achève néanmoins le roman dans une atmosphère sereine, suggérant le triomphe de la paix et du Bien sur la vengeance et le Mal."
-207,de,Jane Eyre,"Jane Eyre. Eine Autobiographie (Originaltitel: Jane Eyre. An Autobiography), erstmals erschienen im Jahr 1847 unter dem Pseudonym Currer Bell, ist der erste veröffentlichte Roman der britischen Autorin Charlotte Brontë und ein Klassiker der viktorianischen Romanliteratur des 19. Jahrhunderts. Der Roman erzählt in Form einer Ich-Erzählung die Lebensgeschichte von Jane Eyre (ausgesprochen /ˌdʒeɪn ˈɛə/), die nach einer schweren Kindheit eine Stelle als Gouvernante annimmt und sich in ihren Arbeitgeber verliebt, jedoch immer wieder um ihre Freiheit und Selbstbestimmung kämpfen muss. Als klein, dünn, blass, stets schlicht dunkel gekleidet und mit strengem Mittelscheitel beschrieben, gilt die Heldin des Romans Jane Eyre nicht zuletzt aufgrund der Kino- und Fernsehversionen der melodramatischen Romanvorlage als die bekannteste englische Gouvernante der Literaturgeschichte"
+9e1c4c81-dc90-4600-85b1-e9dd4bf12ce0,207,de,Jane Eyre,"Jane Eyre. Eine Autobiographie (Originaltitel: Jane Eyre. An Autobiography), erstmals erschienen im Jahr 1847 unter dem Pseudonym Currer Bell, ist der erste veröffentlichte Roman der britischen Autorin Charlotte Brontë und ein Klassiker der viktorianischen Romanliteratur des 19. Jahrhunderts. Der Roman erzählt in Form einer Ich-Erzählung die Lebensgeschichte von Jane Eyre (ausgesprochen /ˌdʒeɪn ˈɛə/), die nach einer schweren Kindheit eine Stelle als Gouvernante annimmt und sich in ihren Arbeitgeber verliebt, jedoch immer wieder um ihre Freiheit und Selbstbestimmung kämpfen muss. Als klein, dünn, blass, stets schlicht dunkel gekleidet und mit strengem Mittelscheitel beschrieben, gilt die Heldin des Romans Jane Eyre nicht zuletzt aufgrund der Kino- und Fernsehversionen der melodramatischen Romanvorlage als die bekannteste englische Gouvernante der Literaturgeschichte"
-252,de,Eleonora,"“Eleonora” ist eine Erzählung von Edgar Allan Poe. Sie wurde 1841 erstveröffentlicht. In ihr geht es um das Paradox der Treue in der Treulosigkeit."
+9be0524b-4cb9-4fc1-9dc2-d65b1c13cf53,252,de,Eleonora,"“Eleonora” ist eine Erzählung von Edgar Allan Poe. Sie wurde 1841 erstveröffentlicht. In ihr geht es um das Paradox der Treue in der Treulosigkeit."

bookshop/db/data/sap.capire.bookshop-Genres.csv

@@ -1,16 +1,43 @@
 ID,parent_ID,name
-10,,Fiction
+10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,,Fiction
-11,10,Drama
+11aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Drama
-12,10,Poetry
+12aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Poetry
-13,10,Fantasy
+13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Fantasy
-14,10,Science Fiction
+131aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Fairy Tale
-15,10,Romance
+132aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Epic Fantasy
-16,10,Mystery
+133aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,High Fantasy
-17,10,Thriller
+134aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,13aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Gothic
-18,10,Dystopia
+14aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Science Fiction
-19,10,Fairy Tale
+141aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,14aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Utopian and Dystopian
-20,,Non-Fiction
+1411aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,141aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Utopian
-21,20,Biography
+1412aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,141aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Dystopian
-22,21,Autobiography
+14121aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,1412aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Cyberpunk
-23,20,Essay
+141211aa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,14121aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Steampunk
-24,20,Speech
+142aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,14aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Space Opera
+143aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,14aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Time Travel
+144aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,14aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Tech Noir
+15aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Romance
+151aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,15aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Contemporary Romance
+152aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,15aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Historical Romance
+153aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,15aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Romantic Suspense
+16aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Mystery
+161aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,16aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Crime
+1611aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,161aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Thriller
+16111aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,1611aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Police Procedural
+16112aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,1611aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Legal Thriller
+16113aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,1611aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Medical Thriller
+16114aaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,1611aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Spy Thriller
+1612aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,161aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Detective
+1613aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,161aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Suspense
+162aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,16aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Noir
+1621aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,162aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Nordic Noir
+1622aaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,162aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Tart Noir
+163aaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,16aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Cozy Mystery
+17aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Adventure
+18aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Short Story
+19aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,10aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Graphic Novel
+20aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,,Non-Fiction
+21aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,20aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Biography
+22aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,21aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Autobiography
+23aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,20aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Essay
+24aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,20aaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa,Speech

bookshop/db/init.js

@@ -1,18 +1,15 @@
+const cds = require('@sap/cds')
+
 /**
  * In order to keep basic bookshop sample as simple as possible, we don't add
  * reuse dependencies. This db/init.js ensures we still have a minimum set of
  * currencies, if not obtained through @capire/common.
  */
 
-module.exports = async (tx)=>{
+// NOTE: We use cds.on('served') to delay the UPSERTs after the db init
-
+// to run after all INSERTs from .csv files happened.
-  const has_common = tx.model.definitions['sap.common.Currencies']?.elements.numcode
+module.exports = cds.on('served', ()=>
-  if (has_common) return
+  UPSERT.into ('sap.common.Currencies') .columns (
-
-  const already_filled = await tx.exists('sap.common.Currencies',{code:'EUR'})
-  if (already_filled) return
-
-  await tx.run (INSERT.into ('sap.common.Currencies') .columns (
     [ 'code', 'symbol', 'name' ]
   ) .rows (
     [ 'EUR', '€', 'Euro' ],
@@ -20,5 +17,5 @@ module.exports = async (tx)=>{
     [ 'GBP', '£', 'British Pound' ],
     [ 'ILS', '₪', 'Shekel' ],
     [ 'JPY', '¥', 'Yen' ],
-  ))
+  )
-}
+)

bookshop/db/schema.cds

@@ -2,30 +2,37 @@ 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);
+  title    : localized String(111)  @mandatory;
-  descr  : localized String(1111);
+  descr    : localized String(1111);
-  author : Association to Authors;
+  author   : Association to Authors @mandatory;
-  genre  : Association to Genres;
+  genre    : Association to Genres;
-  stock  : Integer;
+  stock    : Integer;
-  price  : Decimal;
+  price    : Price;
   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);
+  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 */
 entity Genres : sap.common.CodeList {
-  key ID   : Integer;
+  key ID   : UUID;
   parent   : Association to Genres;
   children : Composition of many Genres on children.parent = $self;
 }
+
+type Price : Decimal(9,2);
+
+
+// ------------------------------------------------------------------
+// temporary workaround for reuse in fiori sample and hana deployment
+annotate Books with @fiori.draft.enabled;

bookshop/index.js

@@ -1,2 +0,0 @@
-const { CatalogService } = require('./srv/cat-service')
-module.exports = { CatalogService }

bookshop/package.json

@@ -6,22 +6,18 @@
     "app",
     "srv",
     "db",
-    "index.cds",
+    "index.cds"
-    "index.js"
   ],
+  "devDependencies": {
+    "@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": {
-      "db": "sql"
-    }
   }
 }

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/access-control.cds

@@ -0,0 +1,2 @@
+using { AdminService } from './admin-service';
+annotate AdminService with @requires:'admin';

bookshop/srv/admin-service.cds

@@ -1,5 +1,6 @@
 using { sap.capire.bookshop as my } from '../db/schema';
-service AdminService @(requires:'admin') {
+service AdminService @(path:'/admin') {
-  entity Books as projection on my.Books;
   entity Authors as projection on my.Authors;
+  entity Books as projection on my.Books;
+  entity Genres as projection on my.Genres;
 }

bookshop/srv/admin-service.js

@@ -1,13 +1,14 @@
-const cds = require('@sap/cds/lib')
+const cds = require('@sap/cds')
 
 module.exports = class AdminService extends cds.ApplicationService { init(){
-  this.before ('NEW','Authors', genid)
+  this.before (['NEW','CREATE'],'Authors', genid)
-  this.before ('NEW','Books', genid)
+  this.before (['NEW','CREATE'],'Books', genid)
   return super.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'))
+  if (req.data.ID) return
-  req.data.ID = ID - ID % 100 + 100 + 1
+  const {id} = await SELECT.one.from(req.target).columns('max(ID) as id')
+  req.data.ID = id + 4 // Note: that is not safe! ok for this sample only.
 }

bookshop/srv/cat-service.js

@@ -1,29 +1,38 @@
 const cds = require('@sap/cds')
 
-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 }
+module.exports = CatalogService

bookshop/srv/user-service.cds

@@ -1,7 +1,7 @@
 /**
  * Exposes user information
  */
-service UserService {
+service UserService @(path: '/user') {
   /**
    * The current user
    */

bookshop/test/genres.http

@@ -3,15 +3,15 @@
 #   Genres
 #
 
-GET http://localhost:4004/test/Genres?
+GET http://localhost:4004/odata/v4/test/Genres?
 ###
 
-GET http://localhost:4004/test/Genres?
+GET http://localhost:4004/odata/v4/test/Genres?
 &$filter=parent_ID eq null&$select=name
 &$expand=children($select=name)
 ###
 
-POST http://localhost:4004/test/Genres?
+POST http://localhost:4004/odata/v4/test/Genres?
 Content-Type: application/json
 
 { "ID":100, "name":"Some Sample Genres...", "children":[
@@ -26,13 +26,13 @@ Content-Type: application/json
 ]}
 ###
 
-GET http://localhost:4004/test/Genres(100)?
+GET http://localhost:4004/odata/v4/test/Genres(100)?
 # &$expand=children
 # &$expand=children($expand=children($expand=children($expand=children)))
 ###
 
-DELETE http://localhost:4004/test/Genres(103)
+DELETE http://localhost:4004/odata/v4/test/Genres(103)
 ###
 
-DELETE http://localhost:4004/test/Genres(100)
+DELETE http://localhost:4004/odata/v4/test/Genres(100)
 ###

bookstore/_i18n/i18n_de.properties

@@ -0,0 +1,12 @@
+Books = Bücher
+Book = Buch
+Title = Titel
+Description = Beschreibung
+Stock = Bestand
+Image = Bild
+Price = Preis
+Currency = Währung
+
+Authors = Autoren
+Author = Autor
+AuthorID = ID des Autors

bookstore/_i18n/i18n_en.properties

@@ -0,0 +1,21 @@
+Books = Books
+Book = Book
+ID = ID
+Title = Title
+Description = Description
+Stock = Stock
+Image = Image
+Price = Price
+Currency = Currency
+
+Authors = Authors
+Author = Author
+AuthorID = Author''s ID
+Name = Name
+DateOfBirth = Date of Birth
+DateOfDeath = Date of Death
+PlaceOfBirth = Place of Birth
+PlaceOfDeath = Place of Death
+
+Genres = Genres
+Genre = Genre

bookstore/_i18n/i18n_fr.properties

@@ -0,0 +1,20 @@
+Books = Livres
+Book = Livre
+Title = Titre
+Description = Description
+Stock = Action
+Image = Image
+Price = Prix
+Currency = Devise
+
+Authors = Auteurs
+Author = Auteur
+AuthorID = ID de l''auteur
+Name = Nom
+DateOfBirth = Date de naissance
+DateOfDeath = Date de décès
+PlaceOfBirth = Lieu de naissance
+PlaceOfDeath = Lieu de décès
+
+Genres = Genre
+Genre = Genre

bookstore/_i18n/messages_de.properties

@@ -0,0 +1,34 @@
+400 = Ungültige Anfrage
+401 = Nicht autorisiert
+403 = Verboten
+404 = Nicht gefunden
+405 = Methode nicht zulässig
+406 = Nicht akzeptabel
+407 = Proxy-Authentifizierung erforderlich
+408 = Anfrage-Timeout
+409 = Konflikt
+410 = Weg
+411 = Erforderliche Länge
+412 = Vorbedingung fehlgeschlagen
+413 = Nutzlast zu groß
+414 = URI zu lang
+415 = Nicht unterstützter Medientyp
+416 = Bereich nicht erfüllbar
+417 = Erwartung fehlgeschlagen
+422 = Nicht verarbeitbarer Inhalt
+424 = Fehlgeschlagene Abhängigkeit
+428 = Vorbedingung erforderlich
+429 = Zu viele Anfragen
+431 = Anfrage-Headerfelder zu groß
+451 = Aus rechtlichen Gründen nicht verfügbar
+500 = Interner Serverfehler
+501 = Der Server unterstützt die zur Erfüllung der Anfrage erforderliche Funktionalität nicht
+502 = Ungültiges Gateway
+503 = Dienst nicht verfügbar
+504 = Gateway-Timeout
+
+ASSERT_RANGE = Wert {0} liegt nicht im angegebenen Bereich [{1}, {2}]
+ASSERT_FORMAT = Wert "{0}" liegt nicht im angegebenen Format "{1}"
+ASSERT_ARRAY = Wert muss ein Array sein
+ASSERT_ENUM = Wert {0} ist gemäß Enumerationsdeklaration {{1}} ungültig
+ASSERT_NOT_NULL = Wert ist erforderlich

bookstore/_i18n/messages_en.properties

@@ -0,0 +1,34 @@
+400 = Bad Request
+401 = Unauthorized
+403 = Forbidden
+404 = Not Found
+405 = Method Not Allowed
+406 = Not Acceptable
+407 = Proxy Authentication Required
+408 = Request Timeout
+409 = Conflict
+410 = Gone
+411 = Length Required
+412 = Precondition Failed
+413 = Payload Too Large
+414 = URI Too Long
+415 = Unsupported Media Type
+416 = Range Not Satisfiable
+417 = Expectation Failed
+422 = Unprocessable Content
+424 = Failed Dependency
+428 = Precondition Required
+429 = Too Many Requests
+431 = Request Header Fields Too Large
+451 = Unavailable For Legal Reasons
+500 = Internal Server Error
+501 = The server does not support the functionality required to fulfill the request
+502 = Bad Gateway
+503 = Service Unavailable
+504 = Gateway Timeout
+
+ASSERT_RANGE = Value {0} is not in specified range [{1}, {2}]
+ASSERT_FORMAT = Value "{0}" is not in specified format "{1}"
+ASSERT_ARRAY = Value must be an array
+ASSERT_ENUM = Value {0} is invalid according to enum declaration {{1}}
+ASSERT_NOT_NULL = Value is required

bookstore/_i18n/messages_fr.properties

@@ -0,0 +1,34 @@
+400 = Requête incorrecte
+401 = Non autorisée
+403 = Interdite
+404 = Introuvable
+405 = Méthode non autorisée
+406 = Non acceptable
+407 = Authentification proxy requise
+408 = Délai d''expiration de la requête
+409 = Conflit
+410 = Disparu
+411 = Longueur requise
+412 = Échec de la condition préalable
+413 = Charge utile trop importante
+414 = URI trop longue
+415 = Type de média non pris en charge
+416 = Plage non satisfaisante
+417 = Échec de l''attente
+422 = Contenu non traitable
+424 = Dépendance échouée
+428 = Condition préalable requise
+429 = Trop de requêtes
+431 = Champs d''en-tête de requête trop importants
+451 = Indisponible pour des raisons juridiques
+500 = Erreur interne du serveur
+501 = Le serveur ne prend pas en charge la fonctionnalité requise pour répondre à la requête
+502 = Passerelle incorrecte
+503 = Service indisponible
+504 = Délai d''attente de la passerelle
+
+ASSERT_RANGE = La valeur {0} n''est pas dans la plage spécifiée [{1}, {2}]
+ASSERT_FORMAT = La valeur "{0}" n''est pas au format spécifié "{1}"
+ASSERT_ARRAY = La valeur doit être un tableau
+ASSERT_ENUM = La valeur {0} n''est pas valide selon la déclaration d''énumération {{1}}
+ASSERT_NOT_NULL = La valeur est obligatoire

bookstore/app/routes.js

@@ -0,0 +1,6 @@
+// Add routes to UIs from imported packages
+module.exports = (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')
+}

bookstore/cds-plugin.js

@@ -0,0 +1 @@
+require('./srv/server')

bookstore/package.json

@@ -7,8 +7,12 @@
     "@capire/orders": "*",
     "@capire/common": "*",
     "@capire/data-viewer": "*",
+    "@sap-cloud-sdk/http-client": "^4",
+    "@sap-cloud-sdk/resilience": "^4",
     "@sap/cds": ">=5",
-    "express": "^4.17.1"
+    "express": "^4.17.1",
+    "@cap-js/hana": "^1",
+    "@sap/cds-mtxs": "^2"
   },
   "cds": {
     "requires": {
@@ -20,15 +24,15 @@
         "kind": "odata",
         "model": "@capire/orders"
       },
-      "messaging": {
+      "messaging": true,
-        "[development]": { "kind": "file-based-messaging" },
+      "db": true,
-        "[hybrid]": { "kind": "enterprise-messaging-shared" },
+      "multitenancy": true,
-        "[production]": { "kind": "enterprise-messaging" }
+      "auth": "xsuaa"
-      },
+
-      "db": {
-        "kind": "sql"
-      }
     },
     "log": { "service": true }
+  },
+  "scripts": {
+    "start": "cds-serve"
   }
-}
+}

bookstore/server.js

@@ -1,22 +0,0 @@
-const cds = require ('@sap/cds')
-
-// 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')
-
-// Returning cds.server
-module.exports = cds.server
-
-// 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,18 +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
-// Add orders fiori app (in case of embedded orders service)
 using from '@capire/orders/app/fiori';
-
-// Add data browser
 using from '@capire/data-viewer';
-
-// Incorporate pre-build extensions from...
 using from '@capire/common';

bookstore/srv/server.js

@@ -1,10 +1,11 @@
-////////////////////////////////////////////////////////////////////////////
+const cds = require ('@sap/cds')
-//
+
-//    Mashing up bookshop services with required services...
+// Add routes to UIs from imported packages
-//
+if (!cds.env.production) cds.once ('bootstrap', require('../app/routes'))
-module.exports = async()=>{ // called by server.js
+
+// Mashing up bookshop services with required services...
+cds.once ('served', async ()=>{ // called by server.js
 
-  const cds = require('@sap/cds')
   const CatalogService = await cds.connect.to ('CatalogService')
   const ReviewsService = await cds.connect.to ('ReviewsService')
   const OrdersService = await cds.connect.to ('OrdersService')
@@ -18,7 +19,7 @@ module.exports = async()=>{ // called by server.js
   // Note: prepend is neccessary to intercept generic default handler
   //
   CatalogService.prepend (srv => srv.on ('READ', 'Books/reviews', (req) => {
-    console.debug ('> delegating request to ReviewsService')
+    console.debug ('> delegating request to ReviewsService') // eslint-disable-line no-console
     const [id] = req.params, { columns, limit } = req.query.SELECT
     return ReviewsService.read ('Reviews',columns).limit(limit).where({subject:String(id)})
   }))
@@ -28,8 +29,8 @@ module.exports = async()=>{ // called by server.js
   //
   CatalogService.on ('OrderedBook', async (msg) => {
     const { book, quantity, buyer } = msg.data
-    const { title, price } = await db.tx(msg).read (Books, book, b => { b.title, b.price })
+    const { title, price } = await db.read (Books, book, b => { b.title, b.price })
-    return OrdersService.tx(msg).create ('Orders').entries({
+    return OrdersService.create ('OrdersNoDraft').entries({
       OrderNo: 'Order at '+ (new Date).toLocaleString(),
       Items: [{ product:{ID:`${book}`}, title, price, quantity }],
       buyer, createdBy: buyer
@@ -40,7 +41,7 @@ module.exports = async()=>{ // called by server.js
   // Update Books' average ratings when ReviewsService signals updated reviews
   //
   ReviewsService.on ('reviewed', (msg) => {
-    console.debug ('> received:', msg.event, msg.data)
+    console.debug ('> received:', msg.event, msg.data) // eslint-disable-line no-console
     const { subject, count, rating } = msg.data
     return UPDATE(Books,subject).with({ numberOfReviews:count, rating })
   })
@@ -49,10 +50,10 @@ module.exports = async()=>{ // called by server.js
   // Reduce stock of ordered books for orders are created from Orders admin UI
   //
   OrdersService.on ('OrderChanged', (msg) => {
-    console.debug ('> received:', msg.event, msg.data)
+    console.debug ('> received:', msg.event, msg.data) // eslint-disable-line no-console
     const { product, deltaQuantity } = msg.data
     return UPDATE (Books) .where ('ID =', product)
     .and ('stock >=', deltaQuantity)
     .set ('stock -=', deltaQuantity)
   })
-}
+})

bookstore/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
-}

bookstore/test/requests.http

@@ -12,11 +12,12 @@
 #
 
 GET {{reviews-service}}/Reviews
+Authorization: Basic me:
 
 ###
 
 POST {{reviews-service}}/Reviews
-Authorization: Basic {{$processEnv USER}}:
+Authorization: Basic me:
 Content-Type: application/json
 
 {"subject":"201", "title":"boo", "rating":3 }
@@ -41,7 +42,7 @@ GET {{bookshop}}/browse/Books(201)?
 ###
 
 GET {{bookshop}}/browse/Books?
-  &$select=title,author&$expand=currency
+&$select=title,author&$expand=currency
 Accept-Language: de
 
 #################################################
@@ -50,23 +51,23 @@ Accept-Language: de
 #
 @newOrderID = e939604c-ab83-4d4f-bdb6-95fe30b3773e
 
-GET {{bookshop}}/orders/Orders
+GET {{bookshop}}/odata/v4/orders/Orders
 
 ### Create order, still inactive
-POST {{bookshop}}/orders/Orders
+POST {{bookshop}}/odata/v4/orders/Orders
 Content-Type: application/json
 
 {"ID": "{{newOrderID}}"}
 
 ### Get inactive order.  We have to specify `IsActiveEntity`.
-GET {{bookshop}}/orders/Orders(ID={{newOrderID}},IsActiveEntity=false)
+GET {{bookshop}}/odata/v4/orders/Orders(ID={{newOrderID}},IsActiveEntity=false)
 
 ### Activate order using `.../<servicename>.draftActivate`
-POST {{bookshop}}/orders/Orders(ID={{newOrderID}},IsActiveEntity=false)/OrdersService.draftActivate
+POST {{bookshop}}/odata/v4/orders/Orders(ID={{newOrderID}},IsActiveEntity=false)/OrdersService.draftActivate
 Content-Type: application/json
 
 ### Get active order
-GET {{bookshop}}/orders/Orders(ID={{newOrderID}},IsActiveEntity=true)
+GET {{bookshop}}/odata/v4/orders/Orders(ID={{newOrderID}},IsActiveEntity=true)
 
 ### Create author
 POST {{bookshop}}/admin/Authors

common/cds-plugin.js

@@ -0,0 +1 @@
+// dummy to auto-load the plugin

common/package.json

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

db

@@ -0,0 +1 @@
+shared-db/db

eslint.config.mjs

@@ -0,0 +1,20 @@
+import cds from '@sap/cds/eslint.config.mjs'
+export default [ ...cds.recommended ]
+
+//
+// The above is the recommended minimalistic eslint config, just using
+// recommended defaults provided by cds. Alternatively, go for enhanced
+// project-specific options, but only if really required, like this:
+//
+// export default [ ...cds.recommended, {
+//   rules: {
+//     'complexity': [ 'warn', 66 ],
+//     'require-await': 'warn',
+//     'no-await-in-loop': 'warn',
+//   },
+// }, {
+//   ignores: [
+//     '**/webapp/**'
+//   ]
+// }]
+//

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/data-viewer/app/viewer/app.js

@@ -1,5 +1,5 @@
 /* global Vue axios */ //> from vue.html
-const GET = (url) => axios.get('/-data'+url)
+const GET = (url) => axios.get('/odata/v4/-data'+url)
 const storageGet = (key, def) => localStorage.getItem('data-viewer:'+key) || def
 const storageSet = (key, val) => localStorage.setItem('data-viewer:'+key, val)
 const columnKeysFirst = (c1, c2) => {

etc/data-viewer/cds-plugin.js

@@ -0,0 +1,4 @@
+const cds = require("@sap/cds")
+cds.on ('served', ()=> {
+  cds.app.serve ('/data') .from ('@capire/data-viewer','app/viewer')
+})

etc/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;

etc/data-viewer/srv/data-service.js

@@ -18,7 +18,7 @@ class DataService extends cds.ApplicationService { init(){
       .sort((e1, e2) => e1.name.localeCompare(e2.name))
       .map(e => {
         const columns = Object.entries(e.elements)
-          .filter(([_, el]) => !(el instanceof cds.Association)) // exclude assocs+compositions
+          .filter(([,el]) => !(el instanceof cds.Association)) // exclude assocs+compositions
           .map(([name, el]) => { return { name, type: el.type, isKey:!!el.key }})
         return { name: e.name, columns }
       })
@@ -34,10 +34,14 @@ class DataService extends cds.ApplicationService { init(){
     query.SELECT.limit = req.query.SELECT.limit  // forward $skip / $top
 
     const dataSource = findDataSource(dataSourceName, entityName)
-    const res = await dataSource.run(query)
+    let res = await dataSource.run(query)
+    if (!Array.isArray(res))  res = [res] // singleton result
     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
+      }
     })
   })
 
@@ -46,6 +50,7 @@ class DataService extends cds.ApplicationService { init(){
 
 module.exports = { DataService }
 
+/** @returns {cds.Service} */
 function findDataSource(dataSourceName, entityName) {
   for (let srv of Object.values(cds.services)) { // all connected services
     if (!srv.name)  continue // FIXME intermediate/pending in cds.services ?

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>

etc/loggers/package.json

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

etc/loggers/srv/loggers.js

@@ -1,4 +1,4 @@
-const cds = require ('@sap/cds/lib')
+const cds = require ('@sap/cds')
 const LOG = cds.log('cds.log')
 
 module.exports = class LogService extends cds.Service {

event-mesh.json

@@ -0,0 +1,29 @@
+{
+  "version": "1.1.0",
+  "options": {
+    "management": true,
+    "messagingrest": true,
+    "messaging": true
+  },
+  "rules": {
+    "topicRules": {
+      "publishFilter": [
+        "*"
+      ],
+      "subscribeFilter": [
+        "*"
+      ]
+    },
+    "queueRules": {
+      "publishFilter": [
+        "*"
+      ],
+      "subscribeFilter": [
+        "*"
+      ]
+    }
+  },
+  "authorities": [
+    "$ACCEPT_GRANTED_AUTHORITIES"
+  ]
+}

fiori/.env

@@ -0,0 +1 @@
+cds.requires.[hybrid].messaging.kind=file-based-messaging

fiori/app/_i18n/i18n.properties

@@ -1,43 +0,0 @@
-Books = Books
-Book = Book
-ID = ID
-Title = Title
-Author = Author
-AuthorID = Author ID
-Stock = Stock
-Name = Name
-Description = Description
-Image = Image
-AuthorName = Author's Name
-DateOfBirth = Date of Birth
-DateOfDeath = Date of Death
-PlaceOfBirth = Place of Birth
-PlaceOfDeath = Place of Death
-Age = Age
-Lifetime = Lifetime
-Authors = Authors
-
-Order = Order
-Orders = Orders
-OrderNo = Order Number
-OrderItems = Order Items
-Customer = Customer
-Product = Product
-ProductID = Product ID
-ProductTitle = Product Title
-UnitPrice = Unit Price
-Quantity = Quantity
-
-Price = Price
-Currency = Currency
-Date = Date
-Rating = Rating
-NumberOfReviews = Number of Reviews
-
-Genre = Genre
-Genres = Genres
-SubGenres = Sub Genres
-
-NumCode = Numeric Code
-MinorUnit = Minor Unit
-Exponent = Exponent

fiori/app/_i18n/i18n_de.properties

@@ -1,14 +1,5 @@
-Books = Bücher
-Book = Buch
-ID = ID
-Title = Titel
-Authors = Autoren
-Author = Autor
-AuthorID = ID des Autors
 AuthorName = Name des Autors
 Age = Alter
-Name = Name
+rder = Bestellung
-Stock = Bestand
-Order = Bestellung
 Orders = Bestellungen
 Price = Preis

fiori/app/_i18n/i18n_en.properties

@@ -0,0 +1,8 @@
+Age = Age
+Lifetime = Lifetime
+
+SubGenres = Subgenre
+
+NumCode = Numeric Code
+MinorUnit = Minor Unit
+Exponent = Exponent

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/fiori-service.cds

@@ -1,6 +1,8 @@
 using { AdminService } from '@capire/bookstore';
 using from '../common'; // to help UI linter get the complete annotations
 
+
+
 ////////////////////////////////////////////////////////////////////////////
 //
 //	Books Object Page
@@ -40,7 +42,48 @@ annotate AdminService.Books with @(
 	}
 );
 
+////////////////////////////////////////////////////////////////////////////
+//
+//	Value Help for Tree Table
+//
+annotate AdminService.Books with {
+    genre @(Common: {
+        Label    : 'Genre',
+        ValueList: {
+            CollectionPath              : 'Genres',
+            Parameters                  : [
+            {
+                $Type            : 'Common.ValueListParameterDisplayOnly',
+                ValueListProperty: 'name',
+            },
+            {
+                $Type            : 'Common.ValueListParameterInOut',
+                LocalDataProperty: genre_ID,
+                ValueListProperty: 'ID',
+            }
+            ],
+            PresentationVariantQualifier: 'VH',
+        }
+    });
+}
 
+annotate AdminService.Genres with @UI: {
+    PresentationVariant #VH: {
+        $Type                      : 'UI.PresentationVariantType',
+        Visualizations             : ['@UI.LineItem'],
+        RecursiveHierarchyQualifier: 'GenreHierarchy'
+    },
+    LineItem               : [{
+        $Type: 'UI.DataField',
+        Value: name,
+        Label :'{i18n>Name}'
+    }],
+};
+
+// Hide ID because of the ValueHelp
+annotate AdminService.Genres with {
+  ID @UI.Hidden;
+};
 
 ////////////////////////////////////////////////////////////
 //
@@ -82,5 +125,3 @@ extend service AdminService {
 // Workaround for Fiori popup for asking user to enter a new UUID on Create
 annotate AdminService.Books with { ID @Core.Computed; }
 
-// Show Genre as drop down, not a dialog
-annotate AdminService.Books with { genre @Common.ValueListWithFixedValues; }

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

@@ -3,7 +3,6 @@
     "LaunchPage": {
       "adapter": {
         "config": {
-          "catalogs": [],
           "groups": [
             {
               "id": "Bookshop",
@@ -24,7 +23,7 @@
                   "id": "BrowseGenres",
                   "tileType": "sap.ushell.ui.tile.StaticTile",
                   "properties": {
-                    "title": "Browse Genres (OData v2)",
+                    "title": "Browse Genres",
                     "targetURL": "#Genres-display"
                   }
                 }
@@ -50,7 +49,7 @@
                   "tileType": "sap.ushell.ui.tile.StaticTile",
                   "properties": {
                     "title": "Manage Authors",
-                    "targetURL": "#Authors-display"
+                    "targetURL": "#Authors-manage"
                   }
                 },
                 {
@@ -99,7 +98,7 @@
             },
             "BrowseAuthors": {
               "semanticObject": "Authors",
-              "action": "display",
+              "action": "manage",
               "title": "Browse Authors",
               "signature": {
                 "parameters": {

fiori/app/browse/fiori-service.cds

@@ -6,8 +6,8 @@ using CatalogService from '@capire/bookstore';
 //
 annotate CatalogService.Books with @(UI : {
     HeaderInfo        : {
-        TypeName       : 'Book',
+        TypeName       : '{i18n>Book}',
-        TypeNamePlural : 'Books',
+        TypeNamePlural : '{i18n>Books}',
         Description    : {Value : author}
     },
     HeaderFacets      : [{

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/common.cds

@@ -69,28 +69,81 @@ annotate my.Books with {
   image  @title: '{i18n>Image}';
 }
 
+////////////////////////////////////////////////////////////////////////////
+//
+//	Computed Fields for Tree Tables 
+//
+//  DISCLAIMER: The below are an alpha version implementation and will change in final release !!!
+//
+aspect Hierarchy {
+  LimitedDescendantCount : Integer64 = null;
+  DistanceFromRoot       : Integer64 = null;
+  DrillState             : String = null;
+  Matched                : Boolean = null;
+  MatchedDescendantCount : Integer64 = null;
+  LimitedRank            : Integer64 = null;
+}
+
+annotate Hierarchy with @Capabilities.FilterRestrictions.NonFilterableProperties: [
+  'LimitedDescendantCount',
+  'DistanceFromRoot',
+  'DrillState',
+  'Matched',
+  'MatchedDescendantCount',
+  'LimitedRank'
+];
+
+annotate Hierarchy with @Capabilities.SortRestrictions.NonSortableProperties: [
+  'LimitedDescendantCount',
+  'DistanceFromRoot',
+  'DrillState',
+  'Matched',
+  'MatchedDescendantCount',
+  'LimitedRank'
+];
+
+extend my.Genres with Hierarchy;
+
+////////////////////////////////////////////////////////////////////////////
+//
+//	Genres Tree Table Annotations
+//
+//  DISCLAIMER: The below are an alpha version implementation and will change in final release !!!
+//
+annotate my.Genres with @Aggregation.RecursiveHierarchy #GenreHierarchy: {
+  $Type                   : 'Aggregation.RecursiveHierarchyType',
+  NodeProperty            : ID, // identifies a node
+  ParentNavigationProperty: parent // navigates to a node's parent
+};
+
+annotate my.Genres with @Hierarchy.RecursiveHierarchy #GenreHierarchy: {
+  $Type                 : 'Hierarchy.RecursiveHierarchyType',
+  LimitedDescendantCount: LimitedDescendantCount,
+  DistanceFromRoot      : DistanceFromRoot,
+  DrillState            : DrillState,
+  Matched               : Matched,
+  MatchedDescendantCount: MatchedDescendantCount,
+  LimitedRank           : LimitedRank
+};
+
+annotate my.Genres with @(
+ readonly,
+ cds.search: {name}
+);
 ////////////////////////////////////////////////////////////////////////////
 //
 //	Genres List
 //
 annotate my.Genres with @(
-  Common.SemanticKey : [name],
+    Common.SemanticKey : [name],
-  UI                 : {
+    UI : {
-    SelectionFields : [name],
+        SelectionFields : [name],
-    LineItem        : [
+        LineItem : [
-      { Value: name },
+         { Value : name, Label : '{i18n>Name}' },
-      {
+        ],
-        Value : parent.name,
+    }
-        Label: 'Main Genre'
-      },
-    ],
-  }
 );
 
-annotate my.Genres with {
-  ID  @Common.Text : name  @Common.TextArrangement : #TextOnly;
-}
-
 ////////////////////////////////////////////////////////////////////////////
 //
 //	Genre Details
@@ -102,12 +155,7 @@ annotate my.Genres with @(UI : {
     TypeNamePlural : '{i18n>Genres}',
     Title          : { Value: name },
     Description    : { Value: ID }
-  },
+  }
-  Facets         : [{
-    $Type  : 'UI.ReferenceFacet',
-    Label  : '{i18n>SubGenres}',
-    Target : 'children/@UI.LineItem'
-  }, ],
 });
 
 ////////////////////////////////////////////////////////////////////////////
@@ -115,7 +163,6 @@ annotate my.Genres with @(UI : {
 //	Genres Elements
 //
 annotate my.Genres with {
-  ID   @title: '{i18n>ID}';
   name @title: '{i18n>Genre}';
 }
 

fiori/app/fiori-apps.html

@@ -1,7 +1,7 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
 
+<head>
 	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -10,21 +10,22 @@
 	<script>
 		window["sap-ushell-config"] = {
 			defaultRenderer: "fiori2",
-			applications: {}
+			applications: {},
 		};
 	</script>
 
-	<script id="sap-ushell-bootstrap" src="https://sapui5.hana.ondemand.com/test-resources/sap/ushell/bootstrap/sandbox.js"></script>
+	<script id="sap-ushell-bootstrap" src="https://ui5.sap.com/test-resources/sap/ushell/bootstrap/sandbox.js"></script>
-	<script id="sap-ui-bootstrap" src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
+	<script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js"
-			data-sap-ui-libs="sap.m, sap.ushell, sap.collaboration, sap.ui.layout"
+		data-sap-ui-libs="sap.m, sap.ushell, sap.collaboration, sap.ui.layout" data-sap-ui-compatVersion="edge"
-			data-sap-ui-compatVersion="edge"
+		data-sap-ui-theme="sap_horizon"></script>
-			data-sap-ui-theme="sap_horizon"
-			data-sap-ui-frameOptions="allow"
-	></script>
 	<script>
-		sap.ui.getCore().attachInit(()=> sap.ushell.Container.createRenderer().placeAt("content"))
+		sap.ui.getCore().attachInit(() =>
+			sap.ushell.Container.createRenderer().placeAt("content")
+		);
 	</script>
-
 </head>
-<body class="sapUiBody" id="content"></body>
+
+<body class="sapUiBody" id="content">
+</body>
+
 </html>

fiori/app/genres/fiori-service.cds

@@ -1,8 +1,3 @@
-using { sap.capire.bookshop } from '../../db/common';
+/*
-
+All annotations needed for UI5 Tree Table View are located in '../common'
-annotate bookshop.GenreHierarchy {
+*/
-  ID             @sap.hierarchy.node.for;
-  parent         @sap.hierarchy.parent.node.for;
-  hierarchyLevel @sap.hierarchy.level.for;
-  drillState     @sap.hierarchy.drill.state.for;
-}

fiori/app/genres/webapp/Component.js

@@ -1,7 +1,3 @@
-sap.ui.define(["sap/suite/ui/generic/template/lib/AppComponent"], (AppComponent) =>
+sap.ui.define(["sap/fe/core/AppComponent"], ac => ac.extend("genres.Component", {
-  AppComponent.extend("genres.Component", {
+  metadata:{ manifest:'json' }
-    metadata: {
+}))
-      manifest: "json",
-    },
-  })
-);

fiori/app/genres/webapp/i18n/i18n.properties

@@ -1,4 +1,4 @@
 #XTIT
-appTitle=Genres
+appTitle=Browse Genres
 #XTXT
-appDescription=Browse Genres
+appDescription=Genres as Tree View

fiori/app/genres/webapp/i18n/i18n_de.properties

@@ -0,0 +1,2 @@
+appTitle=Zeige Genres
+appDescription=Genres als Baumansicht

fiori/app/genres/webapp/manifest.json

@@ -1,155 +1,124 @@
 {
-  "_version": "1.8.0",
+	"_version": "1.8.0",
-  "sap.app": {
+	"sap.app": {
-    "id": "genres",
+		"id": "genres",
-    "type": "application",
+		"type": "application",
-    "i18n": "i18n/i18n.properties",
+		"title": "{{appTitle}}",
-    "applicationVersion": {
+		"description": "{{appDescription}}",
-      "version": "1.0.0"
+		"applicationVersion": {
-    },
+			"version": "1.0.0"
-    "title": "Browse Genres Hierarchy (OData v2)",
+		},
-    "description": "{{appDescription}}",
+		"dataSources": {
-    "tags": {
+			"AdminService": {
-      "keywords": []
+				"uri": "admin/",
-    },
+				"type": "OData",
-    "crossNavigation": {
+				"settings": {
-      "inbounds": {
+					"odataVersion": "4.0"
-        "appShow": {
+				}
-          "title": "{{appTitle}}",
+			}
-          "semanticObject": "GenreHierarchy",
+		},
-          "action": "display",
+		"crossNavigation": {
-          "deviceTypes": {
+			"inbounds": {
-            "desktop": true,
+				"Genres-display": {
-            "tablet": true,
+					"signature": {
-            "phone": true
+						"parameters": {},
-          },
+						"additionalParameters": "allowed"
-          "icon": "sap-icon://settings",
+					},
-          "size": "1x1"
+					"semanticObject": "Genres",
-        }
+					"action": "display"
-      },
+				}
-      "outbounds": {}
+			}
-    },
+		}
-    "ach": "",
+	},
-    "resources": "resources.json",
+	"sap.ui5": {
-    "dataSources": {
+		"dependencies": {
-      "main": {
+			"minUI5Version": "1.122.0",
-        "uri": "/v2/browse",
+			"libs": {
-        "type": "OData",
+				"sap.fe.templates": {}
-        "settings": {
+			}
-          "annotations": ["localAnnotations"],
+		},
-          "localUri": "localService/metadata.xml"
+		"models": {
-        }
+			"i18n": {
-      },
+				"type": "sap.ui.model.resource.ResourceModel",
-      "localAnnotations": {
+				"uri": "i18n/i18n.properties"
-        "type": "ODataAnnotation",
+			},
-        "uri": "annotations/localAnnotations.xml",
+			"": {
-        "settings": {
+				"dataSource": "AdminService",
-          "localUri": "annotations/localAnnotations.xml"
+				"settings": {
-        }
+					"synchronizationMode": "None",
-      }
+					"operationMode": "Server",
-    },
+					"autoExpandSelect": true,
-    "offline": false,
+					"earlyRequests": true,
-    "sourceTemplate": {
+					"groupProperties": {
-      "id": "ui5template.smartTemplate",
+						"default": {
-      "version": "1.40.12"
+						  "submit": "Auto"
-    }
+						}
-  },
+					}
-  "sap.ui": {
+				}
-    "technology": "UI5",
+			}
-    "icons": {
+		},
-      "icon": "",
+		"routing": {
-      "favIcon": "",
+			"routes": [
-      "phone": "",
+				{
-      "phone@2": "",
+					"pattern": ":?query:",
-      "tablet": "",
+					"name": "GenresList",
-      "tablet@2": ""
+					"target": "GenresList"
-    },
+				},
-    "deviceTypes": {
+				{
-      "desktop": true,
+					"pattern": "Genres({key}):?query:",
-      "tablet": true,
+					"name": "GenresDetails",
-      "phone": true
+					"target": "GenresDetails"
-    },
+				}
-    "supportedThemes": ["sap_hcb", "sap_belize", "sap_belize_deep", "sap_fiori_3"]
+			],
-  },
+			"targets": {
-  "sap.ui5": {
+				"GenresList": {
-    "resources": {
+					"type": "Component",
-      "js": [],
+					"id": "GenresList",
-      "css": []
+					"name": "sap.fe.templates.ListReport",
-    },
+					"options": {
-    "dependencies": {
+						"settings": {
-      "minUI5Version": "1.65.6",
+							"contextPath": "/Genres",
-      "libs": {},
+							"navigation": {
-      "components": {}
+								"Genres": {
-    },
+									"detail": {
-    "models": {
+										"route": "GenresDetails"
-      "i18n": {
+										}
-        "type": "sap.ui.model.resource.ResourceModel",
+								}
-        "uri": "i18n/i18n.properties"
+							},
-      },
+							"controlConfiguration": {
-      "@i18n": {
+                                "@com.sap.vocabularies.UI.v1.LineItem": {
-        "type": "sap.ui.model.resource.ResourceModel",
+                                    "tableSettings": {
-        "uri": "i18n/i18n.properties"
+                                        "hierarchyQualifier": "GenreHierarchy",
-      },
+                                        "type": "TreeTable"
-      "json": {
+                                    }
-        "type": "sap.ui.model.json.JSONModel"
+                                }
-      },
+                            }
-      "i18n|sap.suite.ui.generic.template.ListReport|Genres": {
+						}
-        "type": "sap.ui.model.resource.ResourceModel",
+					}
-        "uri": "i18n/ListReport/Genres/i18n.properties"
+				},
-      },
+				"GenresDetails": {
-      "": {
+					"type": "Component",
-        "dataSource": "main",
+					"id": "GenresDetails",
-        "preload": true,
+					"name": "sap.fe.templates.ObjectPage",
-        "settings": {
+					"options": {
-          "useBatch": true,
+						"settings": {
-          "defaultBindingMode": "TwoWay",
+							"contextPath": "/Genres"
-          "defaultCountMode": "Inline",
+						}
-          "refreshAfterChange": true,
+					}
-          "metadataUrlParams": {
+				}
-            "sap-value-list": "none"
+			}
-          }
+		},
-        }
+		"contentDensities": {
-      }
+			"compact": true,
-    },
+			"cozy": true
-    "contentDensities": {
+		}
-      "compact": true,
+	},
-      "cozy": true
+	"sap.ui": {
-    }
+		"technology": "UI5",
-  },
+		"fullWidth": false
-  "sap.ui.generic.app": {
+	},
-    "_version": "1.3.0",
+	"sap.fiori": {
-    "settings": {
+		"registrationIds": [],
-      "forceGlobalRefresh": false,
+		"archeType": "transactional"
-      "useColumnLayoutForSmartForm": false,
+	}
-      "showBasicSearch": false
-    },
-    "pages": {
-      "ListReport|Genres": {
-        "entitySet": "GenreHierarchy",
-        "component": {
-          "name": "sap.suite.ui.generic.template.ListReport",
-          "list": true,
-          "settings": {
-            "condensedTableLayout": true,
-            "smartVariantManagement": true,
-            "tableType": "TreeTable",
-            "enableTableFilterInPageVariant": true,
-            "dataLoadSettings": {
-              "loadDataOnAppLaunch": "always"
-            }
-          }
-        }
-      }
-    }
-  },
-  "sap.fiori": {
-    "registrationIds": [],
-    "archeType": "transactional"
-  },
-  "sap.platform.hcp": {
-    "uri": ""
-  },
-  "sap.platform.cf": {
-    "oAuthScopes": []
-  }
 }

fiori/app/services.cds

@@ -5,6 +5,6 @@
 using from './admin-authors/fiori-service';
 using from './admin-books/fiori-service';
 using from './browse/fiori-service';
-using from './genres/fiori-service';
+
 using from './common';
 using from '@capire/bookstore/srv/mashup';

fiori/db/common.cds

@@ -1,14 +0,0 @@
-namespace sap.capire.bookshop;
-
-using { sap.capire.bookshop } from '@capire/bookstore/srv/mashup';
-
-entity GenreHierarchy : bookshop.Genres {
-  hierarchyLevel : Integer default 0;
-  drillState     : String default 'leaf';
-  parent         : Association to GenreHierarchy;
-  children       : Composition of many GenreHierarchy on children.parent = $self;
-}
-
-extend service CatalogService with {
-  @readonly entity GenreHierarchy as projection on bookshop.GenreHierarchy;
-}

fiori/db/data/sap.capire.bookshop-GenreHierarchy.csv

@@ -1,16 +0,0 @@
-ID;parent_ID;name;hierarchyLevel;drillState
-10;;Fiction;0;expanded
-11;10;Drama;1;leaf
-12;10;Poetry;1;leaf
-13;10;Fantasy;1;leaf
-14;10;Science Fiction;1;leaf
-15;10;Romance;1;leaf
-16;10;Mystery;1;leaf
-17;10;Thriller;1;leaf
-18;10;Dystopia;1;leaf
-20;;Non-Fiction;0;expanded
-19;10;Fairy Tale;1;leaf
-21;20;Biography;1;expanded
-22;21;Autobiography;2;leaf
-23;20;Essay;1;leaf
-24;20;Speech;1;leaf

fiori/package.json

@@ -4,12 +4,13 @@
   "dependencies": {
     "@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,20 +23,8 @@
         "kind": "odata",
         "model": "@capire/orders"
       },
-      "messaging": {
+      "messaging": true,
-        "[production]": {
+      "db": true,
-          "kind": "enterprise-messaging"
-        },
-        "[development]": {
-          "kind": "file-based-messaging"
-        },
-        "[hybrid]": {
-          "kind": "enterprise-messaging-shared"
-        }
-      },
-      "db": {
-        "kind": "sql"
-      },
       "db-ext": {
         "[development]": {
           "model": "db/sqlite"
@@ -44,9 +33,11 @@
           "model": "db/hana"
         }
       }
-    },
-    "hana": {
-      "deploy-format": "hdbtable"
     }
-  }
+  },
+  "sapux": [
+    "app/admin-authors",
+    "app/admin-books",
+    "app/browse"
+  ]
 }

fiori/server.js

@@ -1,8 +1,32 @@
-// install OData v2 adapter
+const cds = require('@sap/cds/lib')
-const cds = require("@sap/cds")
+if (cds.requires.db?.kind === 'sqlite') {
-const proxy = require('@cap-js-community/odata-v2-adapter')
+  cds.on ('serving:AdminService', srv => srv.prepend(() => {
-const opts = global.it ? { target:'auto' } : {}   // for tests, set 'auto' to detect port dynamically
+    const {Genres} = srv.entities
-cds.on('bootstrap', app => app.use(proxy(opts)))  // install proxy
+  // Register a simplistic handler for hierarchical queries
-cds.log('cov2ap','silent') // suppress anoying log outpout, e.g. for `npm run mocha -- --reporter nyan`
+    srv.on('READ', Genres, (req,next) => {
+      const q = req.query
+      // Expand query on a single row
+      if (q.SELECT.recurse?.where?.[0].ref[0] === 'Distance') {
+        q.SELECT.where[0] = 'parent_ID'
+      // Initial query
+      } else if (!q.SELECT.search && !is_count(q)) {
+        q.SELECT.where ??= [ 'parent_ID is null' ]
+      }
+      // Use scalar subselect for DrillState
+      q.SELECT.from.as = 'g'
+      q.SELECT.columns = q.SELECT.columns.map (c => {
+        if (c.ref == 'DrillState') return { xpr:[`
+          CASE WHEN ( SELECT count(1) from ${Genres} where parent_ID = g.ID ) > 0
+          THEN 'collapsed' ELSE 'leaf' END`
+        ], as: 'DrillState' }
+        else return c
+      })
+      // Suppress error message: Feature "recurse" queries not supported.
+      delete q.SELECT.__proto__.recurse
+      delete q.SELECT.recurse
+      return next()
+    })
+  }))
+}
 
-module.exports = require('@capire/bookstore/server.js')
+const is_count = q => q.SELECT.columns?.length === 1 && q.SELECT.columns[0].func === 'count'

hello/README.md

@@ -1,15 +0,0 @@
-# Hello World Getting Started Sample
-
-## Next Steps
-
-- To run the JavaScript implementation, open a new terminal and run `cds watch`.
-- To run the TypeScript implementation, open a new terminal and run `cds-ts watch`.
-
-Then call the service at: http://localhost:4004/say/hello(to='world')
-
-## Learn More
-
-Learn more about:
-
-- [Hello World!](https://cap.cloud.sap/docs/get-started/hello-world)
-- [Using TypeScript](https://cap.cloud.sap/docs/node.js/typescript)

hello/package.json

@@ -1,42 +0,0 @@
-{
-  "name": "@capire/hello-world",
-  "version": "1.0.0",
-  "scripts": {
-    "test": "npx jest --silent",
-    "start": "cds serve srv/world.cds",
-    "start:ts": "cds-ts serve srv/world.cds"
-  },
-  "dependencies": {
-    "@sap/cds": ">=5.0.4"
-  },
-  "devDependencies": {
-    "@types/jest": "*",
-    "@types/node": "*",
-    "typescript": ">=4.3.5"
-  },
-  "eslintConfig": {
-    "extends": "eslint:recommended",
-    "env": {
-      "es2020": true,
-      "node": true,
-      "jest": true,
-      "mocha": true
-    },
-    "globals": {
-      "SELECT": true,
-      "INSERT": true,
-      "UPDATE": true,
-      "DELETE": true,
-      "CREATE": true,
-      "DROP": true,
-      "CDL": true,
-      "CQL": true,
-      "CXL": true,
-      "cds": true
-    },
-    "rules": {
-      "no-console": "off",
-      "require-atomic-updates": "off"
-    }
-  }
-}

hello/srv/world.cds

@@ -1,3 +0,0 @@
-service say {
-  function hello (to:String) returns String;
-}

hello/srv/world.js

@@ -1,7 +0,0 @@
-module.exports = class say {
-  hello(req) {
-    let {to} = req.data
-    if (to === 'me') to = require('os').userInfo().username
-    return `Hello ${to}!`
-  }
-}

hello/srv/world.ts

@@ -1,7 +0,0 @@
-import type { Request } from "@sap/cds/apis/services"
-
-module.exports = class say {
-    hello(req: Request) {
-        return `Hello ${req.data.to} from a TypeScript file!`
-    }
-}

hello/test/hello-world-test.js

@@ -1,13 +0,0 @@
-const cds = require ('@sap/cds')
-describe('Hello world!', () => {
-
-    beforeAll (()=> process.env.CDS_TYPESCRIPT = true)
-    afterAll (()=> delete process.env.CDS_TYPESCRIPT)
-    const {GET} = cds.test.in(__dirname,'../srv').run('serve', 'world.cds')
-
-    it('should say hello with class impl', async () => {
-        const {data} = await GET`/say/hello(to='world')`
-        expect(data.value).toMatch(/Hello world.*typescript.*/i)
-    })
-
-})