fix: minor issues

AKharytonchyk · Apr 18, 2024 · aa6ae71 · aa6ae71
1 parent 521196a
commit aa6ae71
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 7 deletions.
diff --git a/public/index.html b/public/index.html
@@ -14,7 +14,7 @@
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <link rel="web-app-manifest" href="%PUBLIC_URL%/manifest.webappmanifest" />
     <link rel="icon" type="image/x-icon" sizes="16x16" href="%PUBLIC_URL%/icon.svg" /> 
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.

diff --git a/public/manifest.json → public/manifest.webappmanifest b/public/manifest.json → public/manifest.webappmanifest
@@ -1,5 +1,5 @@
 {
-  "short_name": "GitHub Dashboard",
+  "short_name": "GH Dashboard",
   "name": "GitHub PR overview dashboard",
   "icons": [
     {

diff --git a/src/components/AuthHeader.tsx b/src/components/AuthHeader.tsx
@@ -29,8 +29,8 @@ export const AuthHeader: React.FC<AuthHeaderProps> = ({
         showLabels
         value={location.pathname}
         onChange={(event, newValue) => navigate(newValue)}>
-        <BottomNavigationAction label="Dashboard" icon={<Dashboard />} sx={{ backgroundColor: "#f5f5f5"}} value="/"/>
-        <BottomNavigationAction label="Coverage" icon={<Biotech />} sx={{ backgroundColor: "#f5f5f5"}} value="/coverage"/>
+        <BottomNavigationAction label="Dashboard" icon={<Dashboard />} sx={{ backgroundColor: "#f5f5f5"}} value="/" title="Dashboard"/>
+        <BottomNavigationAction label="Coverage" icon={<Biotech />} sx={{ backgroundColor: "#f5f5f5"}} value="/coverage" title="Coverage"/>
       </BottomNavigation>
       <Box
         sx={{

diff --git a/src/components/MultiselectFilter.tsx b/src/components/MultiselectFilter.tsx
@@ -43,12 +43,15 @@ export const MultiselectFilter: React.FC<MultiselectFilterProps> = ({
     onChange(newValue);
   };
 
+  const id = React.useMemo(() => name.split(" ").join("-").toLowerCase(), [name]);
+  const labelId = React.useMemo(() => `${id}-label`, [id]);
+
   return (
     <FormControl sx={{ m: 1, minWidth: 300 }}>
-      <InputLabel id="options-label" size="small">{name}</InputLabel>
+      <InputLabel id={labelId} size="small">{name}</InputLabel>
       <Select
-        labelId="options-label"
-        id="options"
+        labelId={labelId}
+        id={id}
         multiple
         value={selectedOptions}
         onChange={handleChange}