From 795da89c7778fec7db7f9396e43319598768ac8f Mon Sep 17 00:00:00 2001
From: Ferdinand Thiessen <opensource@fthiessen.de>
Date: Sun, 16 Feb 2025 17:52:18 +0100
Subject: [PATCH] chore: Adjust viteconfig for updated vite version

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
---
 cypress.config.mjs                                 | 4 ++--
 src/components/NcAppNavigation/NcAppNavigation.vue | 6 +++---
 src/components/NcAppSidebar/NcAppSidebar.vue       | 4 ++--
 vite.config.mts                                    | 4 ++--
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/cypress.config.mjs b/cypress.config.mjs
index 99d8ea56bc..a8c2c1fd27 100644
--- a/cypress.config.mjs
+++ b/cypress.config.mjs
@@ -77,9 +77,9 @@ export default defineConfig({
 							devSourcemap: true,
 							preprocessorOptions: {
 								scss: {
-									additionalData: `@use 'sass:math'; $scope_version:${SCOPE_VERSION}; @import 'variables'; @import 'material-icons';`,
+									additionalData: `@use 'sass:math'; @use 'variables.scss' as *; @use 'material-icons.css' as *; $scope_version:${SCOPE_VERSION};`,
 									sourceMapContents: false,
-									includePaths: [
+									loadPaths: [
 										resolve(__dirname, 'src/assets'),
 									],
 								},
diff --git a/src/components/NcAppNavigation/NcAppNavigation.vue b/src/components/NcAppNavigation/NcAppNavigation.vue
index c9f8d7a762..9d1890ff3b 100644
--- a/src/components/NcAppNavigation/NcAppNavigation.vue
+++ b/src/components/NcAppNavigation/NcAppNavigation.vue
@@ -56,8 +56,8 @@
 </template>
 
 <script>
-	import IconCheck from 'vue-material-design-icons/Check'
-	import IconCog from 'vue-material-design-icons/Cog'
+	import IconCheck from 'vue-material-design-icons/Check.vue'
+	import IconCog from 'vue-material-design-icons/Cog.vue'
 
 	export default {
 		components: {
@@ -346,7 +346,7 @@ export default {
 
 		isFocusWithinNavigation() {
 			const activeElement = document.activeElement
-			return this.$refs.appNavigationContainer.contains(activeElement)
+			return this.$refs.appNavigationContainer?.contains(activeElement)
 		},
 	},
 }
diff --git a/src/components/NcAppSidebar/NcAppSidebar.vue b/src/components/NcAppSidebar/NcAppSidebar.vue
index 515be3250e..e3ecabc17c 100644
--- a/src/components/NcAppSidebar/NcAppSidebar.vue
+++ b/src/components/NcAppSidebar/NcAppSidebar.vue
@@ -398,7 +398,7 @@ Note: the built-in toggle button is only available then NcAppSidebar is used in
 </template>
 
 <script>
-import Cog from 'vue-material-design-icons/Cog'
+import Cog from 'vue-material-design-icons/Cog.vue'
 
 export default {
 	components: {
@@ -479,7 +479,7 @@ If the sidebar should be shown conditionally without any explicit toggle button,
 </template>
 
 <script>
-import Cog from 'vue-material-design-icons/Cog'
+import Cog from 'vue-material-design-icons/Cog.vue'
 
 export default {
 	components: {
diff --git a/vite.config.mts b/vite.config.mts
index da96fe8809..e64557401d 100644
--- a/vite.config.mts
+++ b/vite.config.mts
@@ -87,9 +87,9 @@ const overrides = defineConfig({
 		devSourcemap: true,
 		preprocessorOptions: {
 			scss: {
-				additionalData: `@use 'sass:math'; $scope_version:${SCOPE_VERSION}; @import 'variables'; @import 'material-icons';`,
+				additionalData: `@use 'sass:math'; @use 'variables.scss' as *; @use 'material-icons.css' as *; $scope_version:${SCOPE_VERSION};`,
 				sourceMapContents: false,
-				includePaths: [
+				loadPaths: [
 					resolve(__dirname, 'src/assets'),
 				],
 			},