mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-27 15:15:50 +00:00
Unify & fix XRPLoader component in dev tools
This commit is contained in:
@@ -2,12 +2,15 @@ import * as React from 'react';
|
|||||||
|
|
||||||
export interface XRPLoaderProps {
|
export interface XRPLoaderProps {
|
||||||
message?: string
|
message?: string
|
||||||
|
show: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function XRPLoader(props: XRPLoaderProps) {
|
export default function XRPLoader(props: XRPLoaderProps) {
|
||||||
|
const classnames = props.show ? "loader" : "loader collapse"
|
||||||
return (
|
return (
|
||||||
<div className="loader">
|
<div className={classnames}>
|
||||||
<img alt="(loading)" className="throbber" src="/img/xrp-loader-96.png" />
|
<img alt="(loading)" className="throbber" src="/img/xrp-loader-96.png" />
|
||||||
{props.message}
|
{props.message}
|
||||||
</div>);
|
</div>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +0,0 @@
|
|||||||
import * as React from 'react';
|
|
||||||
import { useThemeHooks } from '@redocly/theme/core/hooks';
|
|
||||||
|
|
||||||
export const Loader = () => {
|
|
||||||
const { useTranslate } = useThemeHooks();
|
|
||||||
const { translate } = useTranslate();
|
|
||||||
|
|
||||||
return <img className="throbber" src="/img/xrp-loader-96.png" alt={translate("(loading)")} />
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -22,7 +22,7 @@ import { CommandGroup, CommandMethod } from './components/websocket-api/types';
|
|||||||
|
|
||||||
import commandList from "./components/websocket-api/data/command-list.json";
|
import commandList from "./components/websocket-api/data/command-list.json";
|
||||||
import connections from "./components/websocket-api/data/connections.json";
|
import connections from "./components/websocket-api/data/connections.json";
|
||||||
import { Loader } from './components/Loader';
|
import XRPLoader from '../../@theme/components/XRPLoader';
|
||||||
|
|
||||||
export const frontmatter = {
|
export const frontmatter = {
|
||||||
seo: {
|
seo: {
|
||||||
@@ -245,7 +245,7 @@ export function WebsocketApiTool() {
|
|||||||
{sendLoading && (
|
{sendLoading && (
|
||||||
<div className="input-group loader send-loader">
|
<div className="input-group loader send-loader">
|
||||||
<span className="input-group-append">
|
<span className="input-group-append">
|
||||||
<Loader />
|
<XRPLoader show={true} />
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
@@ -274,7 +274,7 @@ export function WebsocketApiTool() {
|
|||||||
{wsLoading && (
|
{wsLoading && (
|
||||||
<div className="input-group loader connect-loader">
|
<div className="input-group loader connect-loader">
|
||||||
<span className="input-group-append">
|
<span className="input-group-append">
|
||||||
<Loader />
|
<XRPLoader show={true} />
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user