From 1b2707f4f5ead5f90dc3ba7fd50f5108cde7e973 Mon Sep 17 00:00:00 2001
From: harshithpabbati <pabbatiharshith@gmail.com>
Date: Fri, 12 Nov 2021 17:09:29 +0530
Subject: [PATCH] Update call header title and disable hair check mute button
 when they are not found

---
 custom/basic-call/components/Call/Header.js       | 2 +-
 custom/shared/components/HairCheck/HairCheck.js   | 4 ++--
 custom/shared/components/MuteButton/MuteButton.js | 7 ++++---
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/custom/basic-call/components/Call/Header.js b/custom/basic-call/components/Call/Header.js
index b158054..c5e3c13 100644
--- a/custom/basic-call/components/Call/Header.js
+++ b/custom/basic-call/components/Call/Header.js
@@ -18,7 +18,7 @@ export const Header = () => {
           height="32"
         />
 
-        <HeaderCapsule>Basic call demo</HeaderCapsule>
+        <HeaderCapsule>{process.env.PROJECT_TITLE}</HeaderCapsule>
         <HeaderCapsule>
           {`${participantCount} ${
             participantCount === 1 ? 'participant' : 'participants'
diff --git a/custom/shared/components/HairCheck/HairCheck.js b/custom/shared/components/HairCheck/HairCheck.js
index 4646036..d7456cb 100644
--- a/custom/shared/components/HairCheck/HairCheck.js
+++ b/custom/shared/components/HairCheck/HairCheck.js
@@ -166,8 +166,8 @@ export const HairCheck = () => {
               )}
             </div>
             <div className="mute-buttons">
-              <MuteButton isMuted={isCamMuted} />
-              <MuteButton mic isMuted={isMicMuted} />
+              <MuteButton isMuted={isCamMuted} disabled={!!camError} />
+              <MuteButton mic isMuted={isMicMuted} disabled={!!micError} />
             </div>
             {tileMemo}
           </div>
diff --git a/custom/shared/components/MuteButton/MuteButton.js b/custom/shared/components/MuteButton/MuteButton.js
index 3004ce7..7b40ff8 100644
--- a/custom/shared/components/MuteButton/MuteButton.js
+++ b/custom/shared/components/MuteButton/MuteButton.js
@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import { useCallState } from '../../contexts/CallProvider';
 import Button from '../Button';
 
-export const MuteButton = ({ isMuted, mic = false, className, ...props }) => {
+export const MuteButton = ({ isMuted, mic = false, className, disabled = false, ...props }) => {
   const { callObject } = useCallState();
   const [muted, setMuted] = useState(!isMuted);
 
@@ -28,17 +28,18 @@ export const MuteButton = ({ isMuted, mic = false, className, ...props }) => {
 
   if (!callObject) return null;
 
-  const cx = classNames(className, { muted: !muted });
+  const cx = classNames(className, { muted: disabled || !muted });
 
   return (
     <Button
       size="large-circle"
       variant="blur"
       className={cx}
+      disabled={disabled}
       {...props}
       onClick={() => toggleDevice(!muted)}
     >
-      {Icon[+muted]}
+      {disabled ? Icon[0] : Icon[+muted]}
     </Button>
   );
 };