Add altText prop to Toast
We changed things so we could insert React elements into the content field.
This commit is contained in:
parent
8c480810b9
commit
6bc887c95b
3 changed files with 6 additions and 1 deletions
|
|
@ -225,6 +225,7 @@ const Header = () => {
|
||||||
const urlCopyToast = () => {
|
const urlCopyToast = () => {
|
||||||
return (
|
return (
|
||||||
<Toast
|
<Toast
|
||||||
|
altText={t('toasts.copied')}
|
||||||
open={copyToastOpen}
|
open={copyToastOpen}
|
||||||
duration={2400}
|
duration={2400}
|
||||||
type="foreground"
|
type="foreground"
|
||||||
|
|
@ -238,6 +239,7 @@ const Header = () => {
|
||||||
const remixToast = () => {
|
const remixToast = () => {
|
||||||
return (
|
return (
|
||||||
<Toast
|
<Toast
|
||||||
|
altText={t('toasts.remixed', { title: originalName })}
|
||||||
open={remixToastOpen}
|
open={remixToastOpen}
|
||||||
duration={2400}
|
duration={2400}
|
||||||
type="foreground"
|
type="foreground"
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ import * as ToastPrimitive from '@radix-ui/react-toast'
|
||||||
import './index.scss'
|
import './index.scss'
|
||||||
|
|
||||||
interface Props extends ToastPrimitive.ToastProps {
|
interface Props extends ToastPrimitive.ToastProps {
|
||||||
|
altText: string
|
||||||
className?: string
|
className?: string
|
||||||
title?: string
|
title?: string
|
||||||
content: React.ReactNode
|
content: React.ReactNode
|
||||||
|
|
@ -12,6 +13,7 @@ interface Props extends ToastPrimitive.ToastProps {
|
||||||
}
|
}
|
||||||
|
|
||||||
const Toast = ({
|
const Toast = ({
|
||||||
|
altText,
|
||||||
children,
|
children,
|
||||||
title,
|
title,
|
||||||
content,
|
content,
|
||||||
|
|
@ -39,7 +41,7 @@ const Toast = ({
|
||||||
<p>{content}</p>
|
<p>{content}</p>
|
||||||
</ToastPrimitive.Description>
|
</ToastPrimitive.Description>
|
||||||
{children && (
|
{children && (
|
||||||
<ToastPrimitive.Action asChild altText="">
|
<ToastPrimitive.Action asChild altText={altText}>
|
||||||
{children}
|
{children}
|
||||||
</ToastPrimitive.Action>
|
</ToastPrimitive.Action>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
|
|
@ -54,6 +54,7 @@ const UpdateToast = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Toast
|
<Toast
|
||||||
|
altText={t(`toasts.description.${updateType}`)}
|
||||||
className={classes}
|
className={classes}
|
||||||
title={t(`toasts.title`)}
|
title={t(`toasts.title`)}
|
||||||
content={t(`toasts.description.${updateType}`)}
|
content={t(`toasts.description.${updateType}`)}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue