Fix links in actions modal

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2024-05-05 12:19:55 +02:00
parent 2fc245f871
commit 2c433c15e1
3 changed files with 7 additions and 6 deletions

View file

@ -41,7 +41,7 @@ interface IHStack extends Pick<React.HTMLAttributes<HTMLDivElement>, 'children'
/** Whether to let the flexbox grow. */ /** Whether to let the flexbox grow. */
grow?: boolean; grow?: boolean;
/** HTML element to use for container. */ /** 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. */ /** Whether to let the flexbox wrap onto multiple lines. */
wrap?: boolean; wrap?: boolean;
} }

View file

@ -39,7 +39,7 @@ interface IStack extends React.HTMLAttributes<HTMLDivElement> {
/** Whether to let the flexbox grow. */ /** Whether to let the flexbox grow. */
grow?: boolean; grow?: boolean;
/** HTML element to use for container. */ /** HTML element to use for container. */
element?: keyof JSX.IntrinsicElements; element?: React.ComponentType | keyof JSX.IntrinsicElements;
} }
/** Vertical stack of child elements. */ /** Vertical stack of child elements. */

View file

@ -2,6 +2,7 @@ import clsx from 'clsx';
import React from 'react'; import React from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import { spring } from 'react-motion'; import { spring } from 'react-motion';
import { Link } from 'react-router-dom';
import Icon from 'soapbox/components/icon'; import Icon from 'soapbox/components/icon';
import { HStack } from 'soapbox/components/ui'; 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' />; 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 Comp = href === '#' ? to ? Link : 'button' : 'a';
const compProps = href === '#' ? { onClick: onClick } : { href: href, rel: 'noopener' }; const compProps = href === '#' ? to ? { to, onClick } : { onClick } : { href: href, rel: 'noopener' };
return ( return (
<li key={`${text}-${i}`}> <li key={`${text}-${i}`}>
<HStack <HStack
{...compProps} {...compProps as any}
space={2.5} space={2.5}
data-index={i} data-index={i}
className={clsx( className={clsx(