From bbd5a66d9984da41b3226a1a1927ebc5c7f2a50c Mon Sep 17 00:00:00 2001 From: Alexander Lobyntsev Date: Thu, 6 Jun 2024 15:51:48 +0700 Subject: [PATCH] chore(website): call Toast when clipboard successes --- .../components/roster/IconClipboard.tsx | 24 +++++++++++++++++-- website/plasma-website/pages/icons.tsx | 5 ++-- 2 files changed, 25 insertions(+), 4 deletions(-) diff --git a/website/plasma-website/components/roster/IconClipboard.tsx b/website/plasma-website/components/roster/IconClipboard.tsx index e3380590c2..9591fa682e 100644 --- a/website/plasma-website/components/roster/IconClipboard.tsx +++ b/website/plasma-website/components/roster/IconClipboard.tsx @@ -1,6 +1,8 @@ import React from 'react'; import styled from 'styled-components'; import { IconCopyOutline } from '@salutejs/plasma-icons'; +import { useToast } from '@salutejs/plasma-b2c'; +import type { ShowToastArgs } from '@salutejs/plasma-b2c'; const StyledClipboardIcon = styled(IconCopyOutline)` margin-left: -1.375rem; @@ -45,13 +47,31 @@ const StyledSource = styled.div` display: inline-flex; `; +const toastData: ShowToastArgs = { + text: '', + position: 'bottom', + role: 'status', + size: 'm', + view: 'dark', + timeout: 250, +}; + export const IconClipboard = ({ source, title }: { source: string; title: string }) => { + const { showToast } = useToast(); + const copyToClipboard = async () => { try { await navigator.clipboard.writeText(source); + + showToast({ + ...toastData, + text: 'Скопировано', + }); } catch (err) { - // eslint-disable-next-line no-console - console.warn('Ошибка при копировании текста'); + showToast({ + ...toastData, + text: 'Ошибка при копировании текста', + }); } }; diff --git a/website/plasma-website/pages/icons.tsx b/website/plasma-website/pages/icons.tsx index 6643734a01..ded0be539d 100644 --- a/website/plasma-website/pages/icons.tsx +++ b/website/plasma-website/pages/icons.tsx @@ -1,5 +1,6 @@ import React, { useState, useCallback } from 'react'; import styled from 'styled-components'; +import { ToastProvider } from '@salutejs/plasma-b2c'; import Head from 'next/head'; import { Header, Main, SearchForm, IconsList, Footer } from '../components/roster'; @@ -17,7 +18,7 @@ export default function Home() { ); return ( - <> + Plasma Icons @@ -27,6 +28,6 @@ export default function Home() {