diff --git a/src/components/ui/hstack/hstack.tsx b/src/components/ui/hstack/hstack.tsx
index 082f210b8..9d39fa8cb 100644
--- a/src/components/ui/hstack/hstack.tsx
+++ b/src/components/ui/hstack/hstack.tsx
@@ -41,7 +41,7 @@ interface IHStack extends Pick<React.HTMLAttributes<HTMLDivElement>, 'children'
   /** Whether to let the flexbox grow. */
   grow?: boolean;
   /** HTML element to use for container. */
-  element?: keyof JSX.IntrinsicElements;
+  element?: React.ComponentType | keyof JSX.IntrinsicElements;
   /** Whether to let the flexbox wrap onto multiple lines. */
   wrap?: boolean;
 }
diff --git a/src/components/ui/stack/stack.tsx b/src/components/ui/stack/stack.tsx
index feceff437..e501d5943 100644
--- a/src/components/ui/stack/stack.tsx
+++ b/src/components/ui/stack/stack.tsx
@@ -39,7 +39,7 @@ interface IStack extends React.HTMLAttributes<HTMLDivElement> {
   /** Whether to let the flexbox grow. */
   grow?: boolean;
   /** HTML element to use for container. */
-  element?: keyof JSX.IntrinsicElements;
+  element?: React.ComponentType | keyof JSX.IntrinsicElements;
 }
 
 /** Vertical stack of child elements. */
diff --git a/src/features/ui/components/modals/actions-modal.tsx b/src/features/ui/components/modals/actions-modal.tsx
index c08cdd584..89aa9bc08 100644
--- a/src/features/ui/components/modals/actions-modal.tsx
+++ b/src/features/ui/components/modals/actions-modal.tsx
@@ -2,6 +2,7 @@ import clsx from 'clsx';
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
 import { spring } from 'react-motion';
+import { Link } from 'react-router-dom';
 
 import Icon from 'soapbox/components/icon';
 import { HStack } from 'soapbox/components/ui';
@@ -25,15 +26,15 @@ const ActionsModal: React.FC<IActionsModal> = ({ status, actions, onClick, onClo
       return <li key={`sep-${i}`} className='m-2 block h-[1px] bg-gray-200 black:bg-gray-800 dark:bg-gray-600' />;
     }
 
-    const { icon = null, text, meta = null, href = '#', destructive } = action;
+    const { icon = null, text, meta = null, href = '#', to, destructive } = action;
 
-    const Comp = href === '#' ? 'button' : 'a';
-    const compProps = href === '#' ? { onClick: onClick } : { href: href, rel: 'noopener' };
+    const Comp = href === '#' ? to ? Link : 'button' : 'a';
+    const compProps = href === '#' ? to ? { to, onClick } : { onClick } : { href: href, rel: 'noopener' };
 
     return (
       <li key={`${text}-${i}`}>
         <HStack
-          {...compProps}
+          {...compProps as any}
           space={2.5}
           data-index={i}
           className={clsx(