added useNotification @lib, using it in EventType (#468)

pull/487/head
Peer_Rich 2021-08-18 10:18:18 +02:00 committed by GitHub
parent c963620a25
commit a162949cf1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 77 additions and 1 deletions

View File

@ -17,6 +17,7 @@ import {
} from "@heroicons/react/solid";
import Logo from "./Logo";
import classNames from "@lib/classNames";
import { Toaster } from "react-hot-toast";
export default function Shell(props) {
const router = useRouter();
@ -69,6 +70,10 @@ export default function Shell(props) {
return session ? (
<>
<div>
<Toaster position="bottom-right" />
</div>
<div className="h-screen flex overflow-hidden bg-gray-100">
{/* Static sidebar for desktop */}
<div className="hidden md:flex md:flex-shrink-0">

49
lib/notification.ts Normal file
View File

@ -0,0 +1,49 @@
import toast from "react-hot-toast";
export default function showToast(message: string, variant: "success" | "warning" | "error") {
switch (variant) {
case "success":
toast.success(message, {
duration: 6000,
style: {
borderRadius: "2px",
background: "#333",
color: "#fff",
boxShadow: "none",
},
});
break;
case "error":
toast.error(message, {
duration: 6000,
style: {
borderRadius: "2px",
background: "#FEE2E2",
color: "#B91C1C",
boxShadow: "none",
},
});
break;
case "warning":
toast(message, {
duration: 6000,
style: {
borderRadius: "2px",
background: "#FFEDD5",
color: "#C2410C",
boxShadow: "none",
},
});
break;
default:
toast.success(message, {
duration: 6000,
style: {
borderRadius: "2px",
background: "#333",
color: "#fff",
boxShadow: "none",
},
});
}
}

View File

@ -44,6 +44,7 @@
"react-dates": "^21.8.0",
"react-dom": "17.0.2",
"react-easy-crop": "^3.5.2",
"react-hot-toast": "^2.1.0",
"react-multi-email": "^0.5.3",
"react-phone-number-input": "^3.1.25",
"react-select": "^4.3.1",

View File

@ -37,6 +37,7 @@ import { DateRangePicker, OrientationShape, toMomentObject } from "react-dates";
import Switch from "@components/ui/Switch";
import { Dialog, DialogTrigger } from "@components/Dialog";
import ConfirmationDialogContent from "@components/dialog/ConfirmationDialogContent";
import showToast from "@lib/notification";
dayjs.extend(utc);
dayjs.extend(timezone);
@ -237,6 +238,9 @@ export default function EventTypePage({
},
});
router.push("/event-types");
showToast("Event Type updated", "success");
setSuccessModalOpen(true);
}
@ -250,7 +254,7 @@ export default function EventTypePage({
"Content-Type": "application/json",
},
});
showToast("Event Type deleted", "success");
router.push("/event-types");
}
@ -876,6 +880,7 @@ export default function EventTypePage({
navigator.clipboard.writeText(
window.location.hostname + "/" + user.username + "/" + eventType.slug
);
showToast("Link copied!", "success");
}}
type="button"
className="flex text-md font-medium text-neutral-700">

View File

@ -19,6 +19,7 @@ import { useRouter } from "next/router";
import React, { Fragment, useRef } from "react";
import Shell from "../../components/Shell";
import prisma from "../../lib/prisma";
import showToast from "@lib/notification";
export default function Availability({ user, types }) {
const [session, loading] = useSession();
@ -54,6 +55,7 @@ export default function Availability({ user, types }) {
if (enteredTitle && enteredLength) {
await router.replace(router.asPath);
}
showToast("Event Type created", "success");
}
function autoPopulateSlug() {
@ -237,6 +239,7 @@ export default function Availability({ user, types }) {
<Tooltip content="Copy link">
<button
onClick={() => {
showToast("Link copied!", "success");
navigator.clipboard.writeText(
window.location.hostname + "/" + session.user.username + "/" + type.slug
);
@ -293,6 +296,7 @@ export default function Availability({ user, types }) {
{({ active }) => (
<button
onClick={() => {
showToast("Link copied!", "success");
navigator.clipboard.writeText(
window.location.hostname +
"/" +

View File

@ -3215,6 +3215,11 @@ globby@^11.0.3:
merge2 "^1.3.0"
slash "^3.0.0"
goober@^2.0.35:
version "2.0.41"
resolved "https://registry.yarnpkg.com/goober/-/goober-2.0.41.tgz#0a3d786ff9917bcf2a096eef703bf717838cbec9"
integrity sha512-kwjegMT5018zWydhOQlQneCgCtrKJaPsru7TaBWmTYV0nsMeUrM6L6O8JmNYb9UbPMgWcmtf+9p4Y3oJabIH1A==
google-auth-library@^7.0.2:
version "7.6.1"
resolved "https://registry.npmjs.org/google-auth-library/-/google-auth-library-7.6.1.tgz#be3d393212fc9dafee7d05975c4ebe88efecc16d"
@ -5550,6 +5555,13 @@ react-easy-crop@^3.5.2:
normalize-wheel "^1.0.1"
tslib "2.0.1"
react-hot-toast@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.1.0.tgz#f4fe3107a3ccd1d7e76ad3d3282967fbf2fccf2c"
integrity sha512-/wUoUVUC/qCYmkJvMzl/oXBIJe47vYqtwOpA76Pz8SrklrF8RBUTLG2eS+ivznzQzY8YlsyODIV7Qk3vOnFf1g==
dependencies:
goober "^2.0.35"
react-input-autosize@^3.0.0:
version "3.0.0"
resolved "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-3.0.0.tgz#6b5898c790d4478d69420b55441fcc31d5c50a85"