Add custom audio renderer for iPhone earpiece and only render joined participants (#3249)

* Add custom audio renderer to only render joined participants & add ios earpice workaround

fix left right to match chromium + safari
(firefox is swapped)

earpice as setting

Simpler code and documentation
The doc explains, what this class actually does and why it is so complicated.

Signed-off-by: Timo K <toger5@hotmail.de>

use only one audioContext, remove (non working) standby fallback

* Add tests

* use optional audio context and effect to initiate it + review

src/UserMenu.tsx

@@ -119,7 +119,7 @@ export const UserMenu: FC<Props> = ({
           key={key}
           Icon={Icon}
           label={label}
-          data-test-id={dataTestid}
+          data-testid={dataTestid}
           onSelect={() => onAction(key)}
         />
       ))}