Accompanying changes

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

src/button/Button.tsx

@@ -139,11 +139,12 @@ export function MicButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger
+      tooltip={() => (muted ? "Unmute microphone" : "Mute microphone")}
+    >
       <Button variant="toolbar" {...rest} off={muted}>
         {muted ? <MuteMicIcon /> : <MicIcon />}
       </Button>
-      {() => (muted ? "Unmute microphone" : "Mute microphone")}
     </TooltipTrigger>
   );
 }
@@ -156,11 +157,12 @@ export function VideoButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger
+      tooltip={() => (muted ? "Turn on camera" : "Turn off camera")}
+    >
       <Button variant="toolbar" {...rest} off={muted}>
         {muted ? <DisableVideoIcon /> : <VideoIcon />}
       </Button>
-      {() => (muted ? "Turn on camera" : "Turn off camera")}
     </TooltipTrigger>
   );
 }
@@ -175,11 +177,12 @@ export function ScreenshareButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger
+      tooltip={() => (enabled ? "Stop sharing screen" : "Share screen")}
+    >
       <Button variant="toolbarSecondary" {...rest} on={enabled}>
         <ScreenshareIcon />
       </Button>
-      {() => (enabled ? "Stop sharing screen" : "Share screen")}
     </TooltipTrigger>
   );
 }
@@ -192,7 +195,7 @@ export function HangupButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger tooltip={() => "Leave"}>
       <Button
         variant="toolbar"
         className={classNames(styles.hangupButton, className)}
@@ -200,7 +203,6 @@ export function HangupButton({
       >
         <HangupIcon />
       </Button>
-      {() => "Leave"}
     </TooltipTrigger>
   );
 }
@@ -213,11 +215,10 @@ export function SettingsButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger tooltip={() => "Settings"}>
       <Button variant="toolbar" {...rest}>
         <SettingsIcon />
       </Button>
-      {() => "Settings"}
     </TooltipTrigger>
   );
 }
@@ -230,22 +231,20 @@ export function InviteButton({
   [index: string]: unknown;
 }) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger tooltip={() => "Invite"}>
       <Button variant="toolbar" {...rest}>
         <AddUserIcon />
       </Button>
-      {() => "Invite"}
     </TooltipTrigger>
   );
 }
 
 export function OptionsButton(props: Omit<Props, "variant">) {
   return (
-    <TooltipTrigger>
+    <TooltipTrigger tooltip={() => "Options"}>
       <Button variant="icon" {...props}>
         <OverflowIcon />
       </Button>
-      {() => "Options"}
     </TooltipTrigger>
   );
 }

src/button/LinkButton.tsx

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React from "react";
+import React, { ReactNode } from "react";
 import { Link } from "react-router-dom";
 import classNames from "classnames";
 
@@ -25,10 +25,10 @@ import {
   ButtonSize,
 } from "./Button";
 interface Props {
-  className: string;
-  variant: ButtonVariant;
-  size: ButtonSize;
-  children: JSX.Element;
+  className?: string;
+  variant?: ButtonVariant;
+  size?: ButtonSize;
+  children: ReactNode;
   [index: string]: unknown;
 }