github.com/minio/console@v1.4.1/web-app/src/screens/Console/Common/MainError/MainError.tsx (about)

     1  // This file is part of MinIO Console Server
     2  // Copyright (c) 2021 MinIO, Inc.
     3  //
     4  // This program is free software: you can redistribute it and/or modify
     5  // it under the terms of the GNU Affero General Public License as published by
     6  // the Free Software Foundation, either version 3 of the License, or
     7  // (at your option) any later version.
     8  //
     9  // This program is distributed in the hope that it will be useful,
    10  // but WITHOUT ANY WARRANTY; without even the implied warranty of
    11  // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    12  // GNU Affero General Public License for more details.
    13  //
    14  // You should have received a copy of the GNU Affero General Public License
    15  // along with this program.  If not, see <http://www.gnu.org/licenses/>.
    16  
    17  import React, { useCallback, useEffect, useState } from "react";
    18  import { Snackbar } from "mds";
    19  import { useSelector } from "react-redux";
    20  import get from "lodash/get";
    21  import { AppState, useAppDispatch } from "../../../../store";
    22  import {
    23    setErrorSnackMessage,
    24    setModalSnackMessage,
    25  } from "../../../../systemSlice";
    26  
    27  interface IMainErrorProps {
    28    isModal?: boolean;
    29  }
    30  
    31  const MainError = ({ isModal = false }: IMainErrorProps) => {
    32    const dispatch = useAppDispatch();
    33    const snackBar = useSelector((state: AppState) => {
    34      return isModal ? state.system.modalSnackBar : state.system.snackBar;
    35    });
    36    const [displayErrorMsg, setDisplayErrorMsg] = useState<boolean>(false);
    37  
    38    const closeErrorMessage = useCallback(() => {
    39      setDisplayErrorMsg(false);
    40    }, []);
    41  
    42    useEffect(() => {
    43      if (!displayErrorMsg) {
    44        dispatch(setErrorSnackMessage({ detailedError: "", errorMessage: "" }));
    45        dispatch(setModalSnackMessage(""));
    46      }
    47    }, [dispatch, displayErrorMsg]);
    48  
    49    useEffect(() => {
    50      if (snackBar.message !== "" && snackBar.type === "error") {
    51        //Error message received, we trigger the animation
    52        setDisplayErrorMsg(true);
    53      }
    54    }, [closeErrorMessage, snackBar.message, snackBar.type]);
    55  
    56    const message = get(snackBar, "message", "");
    57    const messageDetails = get(snackBar, "detailedErrorMsg", "");
    58  
    59    if (snackBar.type !== "error" || message === "") {
    60      return null;
    61    }
    62  
    63    return (
    64      <Snackbar
    65        onClose={closeErrorMessage}
    66        open={displayErrorMsg}
    67        variant={"error"}
    68        message={messageDetails ? messageDetails : `${message}.`}
    69        autoHideDuration={10}
    70        closeButton
    71      />
    72    );
    73  };
    74  
    75  export default MainError;