mirror of
https://github.com/iflytek/skillhub.git
synced 2026-10-07 02:57:51 +00:00
fix(toast): center feedback and remove native token tooltip
This commit is contained in:
parent
4c91b73592
commit
6786b8a95c
3 changed files with 35 additions and 44 deletions
|
|
@ -240,7 +240,7 @@ export function TokenList() {
|
|||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => handleCopyToken(token.id)}
|
||||
title={createdTokens[token.id] ? t('token.copy') : t('token.copyUnavailableTitle')}
|
||||
aria-label={createdTokens[token.id] ? t('token.copy') : t('token.copyUnavailableTitle')}
|
||||
>
|
||||
<Copy className="mr-1 h-4 w-4" />
|
||||
{t('token.copy')}
|
||||
|
|
|
|||
|
|
@ -3,43 +3,27 @@ import { CENTER_TOASTER_ID } from '@/shared/lib/toast'
|
|||
|
||||
export function Toaster() {
|
||||
return (
|
||||
<>
|
||||
<Sonner
|
||||
position="top-right"
|
||||
toastOptions={{
|
||||
classNames: {
|
||||
toast: 'glass-strong border border-border/40',
|
||||
title: 'text-foreground font-semibold',
|
||||
description: 'text-muted-foreground',
|
||||
actionButton: 'bg-primary text-primary-foreground',
|
||||
cancelButton: 'bg-muted text-muted-foreground',
|
||||
error: 'border-destructive/40',
|
||||
success: 'border-emerald-500/40',
|
||||
warning: 'border-amber-500/40',
|
||||
info: 'border-blue-500/40',
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Sonner
|
||||
id={CENTER_TOASTER_ID}
|
||||
position="top-center"
|
||||
className="!left-1/2 !right-auto !top-4 !-translate-x-1/2"
|
||||
offset={16}
|
||||
mobileOffset={16}
|
||||
toastOptions={{
|
||||
classNames: {
|
||||
toast: 'glass-strong mx-auto w-fit max-w-[min(100vw-2rem,32rem)] border border-border/40',
|
||||
title: 'text-foreground font-semibold text-center',
|
||||
description: 'text-muted-foreground text-center',
|
||||
actionButton: 'bg-primary text-primary-foreground',
|
||||
cancelButton: 'bg-muted text-muted-foreground',
|
||||
error: 'border-destructive/40',
|
||||
success: 'border-emerald-500/40',
|
||||
warning: 'border-amber-500/40',
|
||||
info: 'border-blue-500/40',
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
<Sonner
|
||||
id={CENTER_TOASTER_ID}
|
||||
position="top-center"
|
||||
className="!left-1/2 !right-auto !top-4 !-translate-x-1/2"
|
||||
offset={16}
|
||||
mobileOffset={16}
|
||||
toastOptions={{
|
||||
toasterId: CENTER_TOASTER_ID,
|
||||
classNames: {
|
||||
toast: 'glass-strong mx-auto w-fit max-w-[min(100vw-2rem,32rem)] border border-border/40',
|
||||
title: 'text-foreground font-semibold text-center',
|
||||
description: 'text-muted-foreground text-center',
|
||||
content: 'w-full text-center',
|
||||
actionButton: 'bg-primary text-primary-foreground',
|
||||
cancelButton: 'bg-muted text-muted-foreground',
|
||||
error: 'border-destructive/40',
|
||||
success: 'border-emerald-500/40',
|
||||
warning: 'border-amber-500/40',
|
||||
info: 'border-blue-500/40',
|
||||
},
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,18 +14,25 @@ export function centeredToastOptions(options?: ExternalToast): ExternalToast {
|
|||
}
|
||||
}
|
||||
|
||||
function withDefaultToaster(options?: ExternalToast): ExternalToast {
|
||||
return {
|
||||
toasterId: CENTER_TOASTER_ID,
|
||||
...options,
|
||||
}
|
||||
}
|
||||
|
||||
export const toast = {
|
||||
success: (message: string, description?: string, options?: ExternalToast) => {
|
||||
sonnerToast.success(message, { description, ...options })
|
||||
sonnerToast.success(message, { description, ...withDefaultToaster(options) })
|
||||
},
|
||||
error: (message: string, description?: string, options?: ExternalToast) => {
|
||||
sonnerToast.error(message, { description, ...options })
|
||||
sonnerToast.error(message, { description, ...withDefaultToaster(options) })
|
||||
},
|
||||
warning: (message: string, description?: string, options?: ExternalToast) => {
|
||||
sonnerToast.warning(message, { description, ...options })
|
||||
sonnerToast.warning(message, { description, ...withDefaultToaster(options) })
|
||||
},
|
||||
info: (message: string, description?: string, options?: ExternalToast) => {
|
||||
sonnerToast.info(message, { description, ...options })
|
||||
sonnerToast.info(message, { description, ...withDefaultToaster(options) })
|
||||
},
|
||||
promise: <T,>(
|
||||
promise: Promise<T>,
|
||||
|
|
@ -35,6 +42,6 @@ export const toast = {
|
|||
error: string | ((error: Error) => string)
|
||||
}
|
||||
) => {
|
||||
return sonnerToast.promise(promise, options)
|
||||
return sonnerToast.promise(promise, { ...options, toasterId: CENTER_TOASTER_ID })
|
||||
},
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue