🔒️(frontend) fix HIGH CVEs in libexpat 2.8.2-r0

Address the following HIGH severity CVEs in libexpat 2.8.2-r0,
reported by Trivy:

* CVE-2026-66046
* CVE-2026-76641

CHANGELOG.md

@@ -8,6 +8,10 @@ and this project adheres to
 
 ## [Unreleased]
 
+### Added
+
+- ✨(frontend) add 1080p sending resolution option #1660
+
 ### Fixed
 
 - 🐛(frontend) keep the sending resolution picked while the camera is off #1667

docker/dinum-frontend/Dockerfile

@@ -65,6 +65,7 @@ RUN apk update && apk upgrade  \
     musl \
     musl-utils \
     zlib>=1.3.2-r0 \
+    libexpat>=2.8.4-r0 \
     && apk del curl
 
 USER nginx

src/frontend/Dockerfile

@@ -53,6 +53,7 @@ RUN apk update && apk upgrade  \
     musl \
     musl-utils \
     zlib>=1.3.2-r0 \
+    libexpat>=2.8.4-r0 \
     && apk del curl
 
 USER nginx

src/frontend/src/features/settings/components/tabs/VideoTab.tsx

@@ -18,6 +18,7 @@ import {
   saveVideoPublishResolution,
   saveVideoSubscribeQuality,
   userChoicesStore,
+  VIDEO_RESOLUTIONS,
   VideoResolution,
 } from '@/stores/userChoices'
 import { RowWrapper } from './layout/RowWrapper'
@@ -70,7 +71,7 @@ export const VideoTab = ({ id }: VideoTabProps) => {
         isDisabled: true,
       }
 
-  const handleVideoResolutionChange = async (key: 'h720' | 'h360' | 'h180') => {
+  const handleVideoResolutionChange = async (key: VideoResolution) => {
     saveVideoPublishResolution(key)
     const videoTrack = localParticipant.getTrackPublication(
       Track.Source.Camera
@@ -124,20 +125,13 @@ export const VideoTab = ({ id }: VideoTabProps) => {
   }, [videoDeviceId, videoElement])
 
   const resolutionItems = useMemo(() => {
-    return [
-      {
-        value: 'h720',
-        label: `${t('resolution.publish.items.high')} (720p)`,
-      },
-      {
-        value: 'h360',
-        label: `${t('resolution.publish.items.medium')} (360p)`,
-      },
-      {
-        value: 'h180',
-        label: `${t('resolution.publish.items.low')} (180p)`,
-      },
-    ]
+    const labels: Record<VideoResolution, string> = {
+      h1080: `${t('resolution.publish.items.veryHigh')} (1080p)`,
+      h720: `${t('resolution.publish.items.high')} (720p)`,
+      h360: `${t('resolution.publish.items.medium')} (360p)`,
+      h180: `${t('resolution.publish.items.low')} (180p)`,
+    }
+    return VIDEO_RESOLUTIONS.map((value) => ({ value, label: labels[value] }))
   }, [t])
 
   const videoQualityItems = useMemo(() => {

src/frontend/src/locales/de/settings.json

@@ -56,6 +56,7 @@
       "publish": {
         "label": "Wähle die maximale Auflösung beim Senden",
         "items": {
+          "veryHigh": "Sehr hohe Auflösung",
           "high": "Hohe Auflösung",
           "medium": "Mittlere Auflösung",
           "low": "Niedrige Auflösung"

src/frontend/src/locales/en/settings.json

@@ -56,6 +56,7 @@
       "publish": {
         "label": "Select your sending resolution (max.)",
         "items": {
+          "veryHigh": "Very high definition",
           "high": "High definition",
           "medium": "Standard definition",
           "low": "Low definition"

src/frontend/src/locales/es/settings.json

@@ -56,6 +56,7 @@
       "publish": {
         "label": "Selecciona tu resolución de envío (máx.)",
         "items": {
+          "veryHigh": "Muy alta definición",
           "high": "Alta definición",
           "medium": "Definición estándar",
           "low": "Baja definición"

src/frontend/src/locales/fr/settings.json

@@ -56,6 +56,7 @@
       "publish": {
         "label": "Sélectionner votre résolution d'envoi (max.)",
         "items": {
+          "veryHigh": "Très haute définition",
           "high": "Haute définition",
           "medium": "Définition standard",
           "low": "Basse définition"

src/frontend/src/locales/nl/settings.json

@@ -56,6 +56,7 @@
       "publish": {
         "label": "Selecteer uw verzendresolutie (max.)",
         "items": {
+          "veryHigh": "Zeer hoge definitie",
           "high": "Hoge definitie",
           "medium": "Standaarddefinitie",
           "low": "Lage definitie"

src/frontend/src/stores/userChoices.ts

@@ -10,7 +10,12 @@ import {
 } from '@livekit/components-core'
 import { VideoQuality } from 'livekit-client'
 
-export type VideoResolution = 'h720' | 'h360' | 'h180'
+export const VIDEO_RESOLUTIONS = ['h1080', 'h720', 'h360', 'h180'] as const
+
+export type VideoResolution = (typeof VIDEO_RESOLUTIONS)[number]
+
+const isVideoResolution = (value: unknown): value is VideoResolution =>
+  VIDEO_RESOLUTIONS.includes(value as VideoResolution)
 
 export type LocalUserChoices = Omit<LocalUserChoicesLK, 'username'> & {
   processorConfig?: ProcessorConfig
@@ -21,13 +26,17 @@ export type LocalUserChoices = Omit<LocalUserChoicesLK, 'username'> & {
 }
 
 function getUserChoicesState(): LocalUserChoices {
-  return {
+  const stored: LocalUserChoices = {
     noiseReductionEnabled: false,
     audioOutputDeviceId: 'default', // Use 'default' to match LiveKit's standard device selection behavior
     videoPublishResolution: 'h720',
     videoSubscribeQuality: VideoQuality.HIGH,
     ...loadUserChoices(),
   }
+  if (!isVideoResolution(stored.videoPublishResolution)) {
+    stored.videoPublishResolution = 'h720'
+  }
+  return stored
 }
 
 export const userChoicesStore = proxy<LocalUserChoices>(getUserChoicesState())