src/shared/toast.ts

   1 import { isBrowser } from "@utils/browser";
   2 import { ThemeColor } from "@utils/types";
   3 import Toastify from "toastify-js";
   4 import { I18NextService } from "./services";
   5
   6 export function toast(text: string, background: ThemeColor = "success") {
   7   if (isBrowser()) {
   8     const backgroundColor = `var(--bs-${background})`;
   9     Toastify({
  10       text: text,
  11       backgroundColor: backgroundColor,
  12       gravity: "bottom",
  13       position: "left",
  14       duration: 5000,
  15     }).showToast();
  16   }
  17 }
  18
  19 export function pictrsDeleteToast(filename: string, deleteUrl: string) {
  20   if (isBrowser()) {
  21     const clickToDeleteText = I18NextService.i18n.t("click_to_delete_picture", {
  22       filename,
  23     });
  24     const deletePictureText = I18NextService.i18n.t("picture_deleted", {
  25       filename,
  26     });
  27     const failedDeletePictureText = I18NextService.i18n.t(
  28       "failed_to_delete_picture",
  29       {
  30         filename,
  31       }
  32     );
  33
  34     const backgroundColor = `var(--bs-light)`;
  35
  36     const toast = Toastify({
  37       text: clickToDeleteText,
  38       backgroundColor: backgroundColor,
  39       gravity: "top",
  40       position: "right",
  41       duration: 10000,
  42       onClick: () => {
  43         if (toast) {
  44           fetch(deleteUrl).then(res => {
  45             toast.hideToast();
  46             if (res.ok === true) {
  47               alert(deletePictureText);
  48             } else {
  49               alert(failedDeletePictureText);
  50             }
  51           });
  52         }
  53       },
  54       close: true,
  55     });
  56
  57     toast.showToast();
  58   }
  59 }