From e2d1b904085b7efe0bae2ecaf191e4e5b461f775 Mon Sep 17 00:00:00 2001 From: Kane Wang Date: Sat, 27 Apr 2024 18:00:23 +0800 Subject: [PATCH] add toast for clipboard --- package.json | 2 ++ pnpm-lock.yaml | 28 ++++++++++++++++++++ src/components/address-to-english-input.tsx | 17 ++++++++---- src/components/ui/sonner.tsx | 29 +++++++++++++++++++++ src/layouts/base-layout.astro | 2 ++ 5 files changed, 73 insertions(+), 5 deletions(-) create mode 100644 src/components/ui/sonner.tsx diff --git a/package.json b/package.json index 400ea1a..acf8513 100644 --- a/package.json +++ b/package.json @@ -28,12 +28,14 @@ "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "lucide-react": "^0.364.0", + "next-themes": "^0.3.0", "node-xlsx": "^0.24.0", "nzh": "^1.0.12", "qrcode": "^1.5.3", "react": "^18.2.0", "react-dom": "^18.2.0", "sharp": "^0.33.3", + "sonner": "^1.4.41", "swr": "^2.2.5", "tailwind-merge": "^2.2.2", "tailwindcss": "^3.4.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7d93d6d..1287f0f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -59,6 +59,9 @@ importers: lucide-react: specifier: ^0.364.0 version: 0.364.0(react@18.2.0) + next-themes: + specifier: ^0.3.0 + version: 0.3.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0) node-xlsx: specifier: ^0.24.0 version: 0.24.0 @@ -77,6 +80,9 @@ importers: sharp: specifier: ^0.33.3 version: 0.33.3 + sonner: + specifier: ^1.4.41 + version: 1.4.41(react-dom@18.2.0(react@18.2.0))(react@18.2.0) swr: specifier: ^2.2.5 version: 2.2.5(react@18.2.0) @@ -3009,6 +3015,12 @@ packages: natural-compare@1.4.0: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==, tarball: https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz} + next-themes@0.3.0: + resolution: {integrity: sha512-/QHIrsYpd6Kfk7xakK4svpDI5mmXP0gfvCoJdGpZQ2TOrQZmsW0QxjaiLn8wbIKjtm4BTSqLoix4lxYYOnLJ/w==, tarball: https://registry.npmjs.org/next-themes/-/next-themes-0.3.0.tgz} + peerDependencies: + react: ^16.8 || ^17 || ^18 + react-dom: ^16.8 || ^17 || ^18 + nlcst-to-string@3.1.1: resolution: {integrity: sha512-63mVyqaqt0cmn2VcI2aH6kxe1rLAmSROqHMA0i4qqg1tidkfExgpb0FGMikMCn86mw5dFtBtEANfmSSK7TjNHw==, tarball: https://registry.npmjs.org/nlcst-to-string/-/nlcst-to-string-3.1.1.tgz} @@ -3593,6 +3605,12 @@ packages: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==, tarball: https://registry.npmjs.org/slash/-/slash-3.0.0.tgz} engines: {node: '>=8'} + sonner@1.4.41: + resolution: {integrity: sha512-uG511ggnnsw6gcn/X+YKkWPo5ep9il9wYi3QJxHsYe7yTZ4+cOd1wuodOUmOpFuXL+/RE3R04LczdNCDygTDgQ==, tarball: https://registry.npmjs.org/sonner/-/sonner-1.4.41.tgz} + peerDependencies: + react: ^18.0.0 + react-dom: ^18.0.0 + source-map-js@1.2.0: resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==, tarball: https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz} engines: {node: '>=0.10.0'} @@ -7585,6 +7603,11 @@ snapshots: natural-compare@1.4.0: {} + next-themes@0.3.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0): + dependencies: + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + nlcst-to-string@3.1.1: dependencies: '@types/nlcst': 1.0.4 @@ -8297,6 +8320,11 @@ snapshots: slash@3.0.0: {} + sonner@1.4.41(react-dom@18.2.0(react@18.2.0))(react@18.2.0): + dependencies: + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + source-map-js@1.2.0: {} source-map-support@0.5.21: diff --git a/src/components/address-to-english-input.tsx b/src/components/address-to-english-input.tsx index 0967c3c..c83f2d8 100644 --- a/src/components/address-to-english-input.tsx +++ b/src/components/address-to-english-input.tsx @@ -3,6 +3,7 @@ import { cn } from "@/utils/cn.ts"; import type { AddressToEnglishJson } from "@/utils/get-address-data-json"; import { translateAddressToEnglish } from "@/utils/translate-address-to-english"; import { useDeferredValue, useEffect, useRef, useState } from "react"; +import { toast } from "sonner"; import useSWR from "swr"; export const AddressToEnglishInput = () => { @@ -94,14 +95,20 @@ export const AddressToEnglishInput = () => { /> {result && (
- + + +const Toaster = ({ ...props }: ToasterProps) => { + const { theme = "system" } = useTheme() + + return ( + + ) +} + +export { Toaster } diff --git a/src/layouts/base-layout.astro b/src/layouts/base-layout.astro index 80dc18f..b5947d9 100644 --- a/src/layouts/base-layout.astro +++ b/src/layouts/base-layout.astro @@ -7,6 +7,7 @@ import logo from "@/assets/logo.png"; import { cn } from "@/utils/cn"; import { TranslateFunction } from "@/utils/language"; import { createTranslation } from "../utils/language"; +import { Toaster } from "../components/ui/sonner"; interface Props { title: string; @@ -85,5 +86,6 @@ const themeScript = `!function e(){let t=localStorage.getItem("theme");!t&&windo
+