Use pluralize for catalog kind header component

Signed-off-by: Marek Šneberger <marek@sneberger.cz>

plugins/catalog/package.json

@@ -49,6 +49,7 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "history": "^5.0.0",
     "lodash": "^4.17.21",
+    "pluralize": "^8.0.0",
     "react-helmet": "6.1.0",
     "react-use": "^17.2.4",
     "zen-observable": "^0.9.0"

plugins/catalog/src/components/CatalogKindHeader/CatalogKindHeader.tsx

@@ -31,6 +31,7 @@ import {
 } from '@backstage/plugin-catalog-react';
 import useAsync from 'react-use/lib/useAsync';
 import { useApi } from '@backstage/core-plugin-api';
+import pluralize from 'pluralize';
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({
@@ -132,7 +133,7 @@ export function CatalogKindHeader(props: CatalogKindHeaderProps) {
     >
       {Object.keys(options).map(kind => (
         <MenuItem value={kind} key={kind}>
-          {`${options[kind]}s`}
+          {`${pluralize(options[kind])}`}
         </MenuItem>
       ))}
     </Select>

yarn.lock

@@ -4750,6 +4750,7 @@ __metadata:
     cross-fetch: ^3.1.5
     history: ^5.0.0
     lodash: ^4.17.21
+    pluralize: ^8.0.0
     react-helmet: 6.1.0
     react-use: ^17.2.4
     zen-observable: ^0.9.0