add action prop to support buttons

plugins/catalog/src/components/AboutCard/IconLinkVertical/IconLinkVertical.tsx

@@ -23,9 +23,10 @@ export type IconLinkVerticalProps = {
   href?: string;
   disabled?: boolean;
   label: string;
+  action?: React.ReactNode;
 };
 
-const useIconStyles = makeStyles({
+const useIconStyles = makeStyles(theme => ({
   link: {
     display: 'grid',
     justifyItems: 'center',
@@ -41,12 +42,16 @@ const useIconStyles = makeStyles({
     fontWeight: 600,
     letterSpacing: 1.2,
   },
-});
+  linkStyle: {
+    color: theme.palette.secondary.main,
+  },
+}));
 
 export function IconLinkVertical({
   icon = <LinkIcon />,
   href = '#',
   disabled = false,
+  action,
   ...props
 }: IconLinkVerticalProps) {
   const classes = useIconStyles();
@@ -64,6 +69,23 @@ export function IconLinkVertical({
     );
   }
 
+  if (action) {
+    return (
+      <Link
+        className={
+          disabled
+            ? classnames(classes.link, classes.linkStyle, classes.disabled)
+            : classnames(classes.link, classes.linkStyle)
+        }
+        href={href}
+        {...props}
+      >
+        {icon}
+        {action}
+      </Link>
+    );
+  }
+
   return (
     <Link className={classes.link} href={href} {...props}>
       {icon}

plugins/catalog/src/index.ts

@@ -23,3 +23,4 @@ export { Router } from './components/Router';
 export { useEntity, EntityContext } from './hooks/useEntity';
 export { AboutCard } from './components/AboutCard';
 export { EntityPageLayout } from './components/EntityPageLayout';
+export { IconLinkVertical } from './components/AboutCard/IconLinkVertical';