fix(navigation): review and fix navigation tutorial

packages/navigation/README.md

@@ -32,7 +32,7 @@ Throughout this tutorial we will add features for navigating to pages and bookma
 >
 > You can view and download the files for all steps in the Demo Kit at [Navigation and Routing](https://sdk.openui5.org/#/entity/sap.ui.core.tutorial.navigation). Copy the code to your workspace and make sure that the application runs by calling the `webapp/index.html` file. Depending on your development environment you might have to adjust resource paths and configuration entries.
 >
-> For more information check the [Downloading Code for a Tutorial Step](https://sdk.openui5.org/topic/8b49fc198bf04b2d9800fc37fecbb218.html#loio8b49fc198bf04b2d9800fc37fecbb218/tutorials_download) section of the tutorials overview page [Get Started: Setup, Tutorials, and Demo Apps](https://sdk.openui5.org/topic/8b49fc198bf04b2d9800fc37fecbb218).
+> For more information, see the [Downloading Code for a Tutorial Step](https://sdk.openui5.org/#/topic/8b49fc198bf04b2d9800fc37fecbb218#loio8b49fc198bf04b2d9800fc37fecbb218/tutorials_download) section of the [Get Started: Setup, Tutorials, and Demo Apps](https://sdk.openui5.org/#/topic/8b49fc198bf04b2d9800fc37fecbb218) overview.
 
 ***
 

packages/navigation/steps/01/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/02/README.md

@@ -124,6 +124,7 @@ import UIComponent from "sap/ui/core/UIComponent";
 export default class Component extends UIComponent {
 
 	public static metadata = {
+		interfaces: ["sap.ui.core.IAsyncContentCreation"],
 		manifest: "json"
 	};
 

packages/navigation/steps/02/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/03/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/04/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/05/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/06/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/07/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/08/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/08/webapp/initMockServer.ts

@@ -1,7 +1,6 @@
 import mockserver from "ui5/tutorial/navigation/localService/mockserver";
 import MessageBox from "sap/m/MessageBox";
 
-// initialize the mock server
 mockserver.init().catch((error: Error) => {
   MessageBox.error(error.message);
 }).finally(() => {

packages/navigation/steps/09/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/10/webapp/index-cdn.html

@@ -5,7 +5,7 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<title>Navigation and Routing Tutorial</title>
 		<script id="sap-ui-bootstrap"
-			src="https://sdk.openui5.org/1.148.1/resources/sap-ui-core.js"
+			src="https://sdk.openui5.org/1.148.5/resources/sap-ui-core.js"
 			data-sap-ui-resource-roots='{
 				"ui5.tutorial.navigation": "./"
 			}'

packages/navigation/steps/11/README.md

@@ -386,47 +386,36 @@ export default class EmployeeOverviewContent extends BaseController {
 		if (searchQuery?.length > 0) {
 			const filters: Filter[] = [];
 
-			aFilters.push(new Filter("FirstName", FilterOperator.Contains, searchQuery));
-			aFilters.push(new Filter("LastName", FilterOperator.Contains, searchQuery));
-			oFilter = new Filter({ filters: aFilters, and: false }); // OR filter
+			filters.push(new Filter("FirstName", FilterOperator.Contains, searchQuery));
+			filters.push(new Filter("LastName", FilterOperator.Contains, searchQuery));
+			filter = new Filter({ filters: filters, and: false }); // OR filter
 		}
 
 		// update list binding
 		const binding = (<ListBinding> this.table.getBinding("items"));
-		binding.filter(oFilter, "Application");
+		binding.filter(filter, "Application");
 	}
 
 	/**
 	 * Applies sorting on our table control.
 	 * @param {string} fieldName the name of the field used for sorting
-	 * @param {string} sortDescending true or false as a string or boolean value to specify a descending sorting
+	 * @param {boolean} sortDescending whether to sort descending
 	 * @private
 	 */
-	private _applySorter(fieldName: string, sortDescending: string | boolean): void {
+	private _applySorter(fieldName: string, sortDescending: boolean): void {
 		// only continue if we have a valid sort field
 		if (fieldName && this.validSortFields.includes(fieldName)) {
-			let descending: boolean;
-
-			// convert the sort order to a boolean value
-			if (typeof sortDescending === "string") {
-				descending = sortDescending === "true";
-			} else if (typeof sortDescending === "boolean") {
-				descending = sortDescending;
-			} else {
-				descending = false;
-			}
-
 			// sort only if the sorter has changed
-			if (this.sortField && this.sortField === fieldName && this.sortDescending === descending) {
+			if (this.sortField && this.sortField === fieldName && this.sortDescending === sortDescending) {
 				return;
 			}
 
 			this.sortField = fieldName;
-			this.sortDescending = descending;
-			const sorter = new Sorter(fieldName, descending);
+			this.sortDescending = sortDescending;
+			const sorter = new Sorter(fieldName, sortDescending);
 
 			// sync with View Settings Dialog
-			this._syncViewSettingsDialogSorter(fieldName, descending);
+			this._syncViewSettingsDialogSorter(fieldName, sortDescending);
 
 			const binding = (<ListBinding> this.table.getBinding("items"));
 			binding.sort(sorter);
@@ -517,33 +506,22 @@ sap.ui.define(["sap/m/ViewSettingsDialog", "sap/m/ViewSettingsItem", "ui5/tutori
 	/**
 	 * Applies sorting on our table control.
 	 * @param {string} fieldName the name of the field used for sorting
-	 * @param {string | boolean} sortDescending true or false as a string or boolean value to specify a descending sorting
+	 * @param {boolean} sortDescending whether to sort descending
 	 * @private
 	 */
 	_applySorter(fieldName, sortDescending) {
 	  // only continue if we have a valid sort field
 	  if (fieldName && this.validSortFields.includes(fieldName)) {
-		let descending;
-
-		// convert the sort order to a boolean value
-		if (typeof sortDescending === "string") {
-		  descending = sortDescending === "true";
-		} else if (typeof sortDescending === "boolean") {
-		  descending = sortDescending;
-		} else {
-		  descending = false;
-		}
-
 		// sort only if the sorter has changed
-		if (this.sortField && this.sortField === fieldName && this.sortDescending === descending) {
+		if (this.sortField && this.sortField === fieldName && this.sortDescending === sortDescending) {
 		  return;
 		}
 		this.sortField = fieldName;
-		this.sortDescending = descending;
-		const sorter = new Sorter(fieldName, descending);
+		this.sortDescending = sortDescending;
+		const sorter = new Sorter(fieldName, sortDescending);
 
 		// sync with View Settings Dialog
-		this._syncViewSettingsDialogSorter(fieldName, descending);
+		this._syncViewSettingsDialogSorter(fieldName, sortDescending);
 		const binding = this.table.getBinding("items");
 		binding.sort(sorter);
 	  }