mirror of
https://github.com/stashapp/stash.git
synced 2025-12-17 12:24:38 +03:00
30 lines
730 B
TypeScript
30 lines
730 B
TypeScript
import React from "react";
|
|
import { Spinner } from "react-bootstrap";
|
|
import cx from "classnames";
|
|
|
|
interface ILoadingProps {
|
|
message?: string;
|
|
inline?: boolean;
|
|
small?: boolean;
|
|
}
|
|
|
|
const CLASSNAME = "LoadingIndicator";
|
|
const CLASSNAME_MESSAGE = `${CLASSNAME}-message`;
|
|
|
|
const LoadingIndicator: React.FC<ILoadingProps> = ({
|
|
message,
|
|
inline = false,
|
|
small = false,
|
|
}) => (
|
|
<div className={cx(CLASSNAME, { inline, small })}>
|
|
<Spinner animation="border" role="status" size={small ? "sm" : undefined}>
|
|
<span className="sr-only">Loading...</span>
|
|
</Spinner>
|
|
{message !== "" && (
|
|
<h4 className={CLASSNAME_MESSAGE}>{message ?? "Loading..."}</h4>
|
|
)}
|
|
</div>
|
|
);
|
|
|
|
export default LoadingIndicator;
|