wip file picker

CHANGELOG.md

@@ -13,7 +13,6 @@ and this project adheres to
 
 - ✨(summary) add dutch and german languages
 - 🔧(agents) make Silero VAD optional
-- 🚸(frontend) explain to a user they were ejected
 
 ### Changed
 

src/frontend/src/features/rooms/components/Conference.tsx

@@ -25,12 +25,12 @@ import { VideoConference } from '../livekit/prefabs/VideoConference'
 import { css } from '@/styled-system/css'
 import { BackgroundProcessorFactory } from '../livekit/components/blur'
 import { LocalUserChoices } from '@/stores/userChoices'
+import { navigateTo } from '@/navigation/navigateTo'
 import { MediaDeviceErrorAlert } from './MediaDeviceErrorAlert'
 import { usePostHog } from 'posthog-js/react'
 import { useConfig } from '@/api/useConfig'
 import { isFireFox } from '@/utils/livekit'
 import { useIsMobile } from '@/utils/useIsMobile'
-import { navigateTo } from '@/navigation/navigateTo'
 
 export const Conference = ({
   roomId,
@@ -228,20 +228,10 @@ export const Conference = ({
             posthog.captureException(e)
           }}
           onDisconnected={(e) => {
-            switch (e) {
-              case DisconnectReason.CLIENT_INITIATED:
-                navigateTo('feedback')
-                return
-              case DisconnectReason.DUPLICATE_IDENTITY:
-              case DisconnectReason.PARTICIPANT_REMOVED:
-                navigateTo(
-                  'feedback',
-                  {},
-                  {
-                    state: { reason: e },
-                  }
-                )
-                return
+            if (e == DisconnectReason.CLIENT_INITIATED) {
+              navigateTo('feedback', { duplicateIdentity: false })
+            } else if (e == DisconnectReason.DUPLICATE_IDENTITY) {
+              navigateTo('feedback', { duplicateIdentity: true })
             }
           }}
           onMediaDeviceFailure={(e, kind) => {

src/frontend/src/features/rooms/livekit/components/effects/EffectsConfiguration.tsx

@@ -8,7 +8,7 @@ import {
   ProcessorType,
 } from '../blur'
 import { css } from '@/styled-system/css'
-import { H, P, Text, ToggleButton } from '@/primitives'
+import { Button, H, P, Text, ToggleButton } from '@/primitives'
 import { VisualOnlyTooltip } from '@/primitives/VisualOnlyTooltip'
 import { styled } from '@/styled-system/jsx'
 import { BlurOn } from '@/components/icons/BlurOn'
@@ -18,6 +18,8 @@ import { Loader } from '@/primitives/Loader'
 import { useSyncAfterDelay } from '@/hooks/useSyncAfterDelay'
 import { FunnyEffects } from './FunnyEffects'
 import { useHasFunnyEffectsAccess } from '../../hooks/useHasFunnyEffectsAccess'
+import { RiImageAddFill } from '@remixicon/react'
+import { FileTrigger } from 'react-aria-components'
 
 enum BlurRadius {
   NONE = 0,
@@ -405,6 +407,17 @@ export const EffectsConfiguration = ({
                   >
                     <BlurOnStrong />
                   </ToggleButton>
+                  <FileTrigger
+                    acceptedFileTypes={['image/*']}
+                    allowsMultiple={false}
+                    onSelect={(e) => {
+                      console.log(e)
+                    }}
+                  >
+                    <Button variant="bigSquare">
+                      <RiImageAddFill />
+                    </Button>
+                  </FileTrigger>
                 </div>
                 <div aria-live="polite" className="sr-only">
                   {blurStatusMessage}

src/frontend/src/features/rooms/routes/Feedback.tsx

@@ -3,9 +3,7 @@ import { Button } from '@/primitives'
 import { Screen } from '@/layout/Screen'
 import { Center, HStack, styled, VStack } from '@/styled-system/jsx'
 import { Rating } from '@/features/rooms/components/Rating.tsx'
-import { useLocation } from 'wouter'
-import { useMemo } from 'react'
-import { DisconnectReason } from 'livekit-client'
+import { useLocation, useSearchParams } from 'wouter'
 
 // fixme - duplicated with home, refactor in a proper style
 const Heading = styled('h1', {
@@ -26,23 +24,17 @@ export const FeedbackRoute = () => {
   const { t } = useTranslation('rooms')
   const [, setLocation] = useLocation()
 
-  const reasonKey = useMemo(() => {
-    const state = window.history.state
-
-    if (!state?.reason) return
-    switch (state.reason) {
-      case DisconnectReason.DUPLICATE_IDENTITY:
-        return 'duplicateIdentity'
-      case DisconnectReason.PARTICIPANT_REMOVED:
-        return 'participantRemoved'
-    }
-  }, [])
+  const [searchParams] = useSearchParams()
 
   return (
     <Screen layout="centered" footer={false}>
       <Center>
         <VStack>
-          <Heading>{t(`feedback.heading.${reasonKey || 'normal'}`)}</Heading>
+          <Heading>
+            {t(
+              `feedback.heading.${searchParams.get('duplicateIdentity') ? 'duplicateIdentity' : 'normal'}`
+            )}
+          </Heading>
           <HStack>
             <Button variant="secondary" onPress={() => window.history.back()}>
               {t('feedback.back')}

src/frontend/src/locales/de/rooms.json

@@ -2,8 +2,7 @@
   "feedback": {
     "heading": {
       "normal": "Sie haben das Meeting verlassen",
-      "duplicateIdentity": "Sie haben dem Meeting von einem anderen Gerät aus beigetreten",
-      "participantRemoved": "Sie wurden von einem Administrator aus dem Anruf entfernt"
+      "duplicateIdentity": "Sie haben dem Meeting von einem anderen Gerät aus beigetreten"
     },
     "home": "Zur Startseite zurückkehren",
     "back": "Dem Meeting erneut beitreten"

src/frontend/src/locales/en/rooms.json

@@ -2,8 +2,7 @@
   "feedback": {
     "heading": {
       "normal": "You have left the meeting",
-      "duplicateIdentity": "You have joined the meeting from another device",
-      "participantRemoved": "You have been removed from the meeting by an administrator"
+      "duplicateIdentity": "You have joined the meeting from another device"
     },
     "home": "Return to home",
     "back": "Rejoin the meeting"

src/frontend/src/locales/fr/rooms.json

@@ -2,8 +2,7 @@
   "feedback": {
     "heading": {
       "normal": "Vous avez quitté la réunion",
-      "duplicateIdentity": "Vous avez rejoint la réunion depuis un autre appareil",
-      "participantRemoved": "Vous avez été exclu de l'appel par un administrateur"
+      "duplicateIdentity": "Vous avez rejoint la réunion depuis un autre appareil"
     },
     "home": "Retourner à l'accueil",
     "back": "Réintégrer la réunion"

src/frontend/src/locales/nl/rooms.json

@@ -2,8 +2,7 @@
   "feedback": {
     "heading": {
       "normal": "Je hebt de vergadering verlaten",
-      "duplicateIdentity": "U heeft de vergadering via een ander apparaat geopend",
-      "participantRemoved": "U bent door een beheerder uit het gesprek verwijderd"
+      "duplicateIdentity": "U heeft de vergadering via een ander apparaat geopend"
     },
     "home": "Keer terug naar het hoofdscherm",
     "back": "Sluit weer bij de vergadering aan"

src/frontend/src/routes.ts

@@ -43,6 +43,11 @@ export const routes: Record<
   feedback: {
     name: 'feedback',
     path: '/feedback',
+    to: (params: { duplicateIdentity?: false }) =>
+      '/feedback' +
+      (params.duplicateIdentity
+        ? `?duplicateIdentity=${params?.duplicateIdentity}`
+        : ''),
     Component: FeedbackRoute,
   },
   legalTerms: {