Use usernameToColor from @nextcloud/vue

Signed-off-by: Joas Schilling <coding@schilljs.com>

package-lock.json

@@ -3864,12 +3864,13 @@
 			}
 		},
 		"@nextcloud/vue": {
-			"version": "2.0.0",
-			"resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-2.0.0.tgz",
-			"integrity": "sha512-Y8OmsRHvskpRbfcBXUy8U6+Ctl8kyWK8qHkmsi1kWL85l0262OxcTA9BU/Qh9vAn9sqTrT7skXRAVnQckO4y0A==",
+			"version": "2.1.0",
+			"resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-2.1.0.tgz",
+			"integrity": "sha512-x6reE5GSk/exYuGPCqkw8ITWBDGfBkenTyNYRZYmyw1XLEW8M7UQgQc1EaYY3mhcIanf3aix8q9Rad7kK6nmoQ==",
 			"requires": {
 				"@nextcloud/auth": "^1.2.3",
 				"@nextcloud/axios": "^1.3.2",
+				"@nextcloud/dialogs": "^1.3.0",
 				"@nextcloud/event-bus": "^1.1.4",
 				"@nextcloud/l10n": "^1.2.3",
 				"@nextcloud/router": "^1.0.2",

package.json

@@ -26,7 +26,7 @@
 		"@nextcloud/l10n": "^1.3.0",
 		"@nextcloud/moment": "^1.1.1",
 		"@nextcloud/router": "^1.1.0",
-		"@nextcloud/vue": "^2.0.0",
+		"@nextcloud/vue": "^2.1.0",
 		"attachmediastream": "^2.1.0",
 		"crypto-js": "^4.0.0",
 		"debounce": "^1.2.0",

src/components/CallView/shared/VideoBackground.vue

@@ -41,6 +41,7 @@
 
 <script>
 import axios from '@nextcloud/axios'
+import usernameToColor from '@nextcloud/vue/dist/Functions/usernameToColor'
 import { generateUrl } from '@nextcloud/router'
 import { ResizeObserver } from 'vue-resize'
 
@@ -79,7 +80,7 @@ export default {
 			if (!this.displayName) {
 				return `var(--color-text-maxcontrast)`
 			} else {
-				const color = this.displayName.toRgb()
+				const color = usernameToColor(this.displayName)
 				return `rgb(${color.r}, ${color.g}, ${color.b})`
 			}
 		},