StarMC/Astral-nook
StarMC/Astral-nook
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add progress bar to top of page for nicer loading indicator styles

Browse source
This commit is contained in:
Dane Everitt 2020-04-10 12:41:08 -07:00
parent 708c15eba8
commit d3a06e1ca8
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
12 changed files with 133 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

4
resources/scripts/components/server/backups/BackupContainer.tsx
View file

@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react';
import Spinner from '@/components/elements/Spinner';
import getServerBackups, { ServerBackup } from '@/api/server/backups/getServerBackups';
import getServerBackups from '@/api/server/backups/getServerBackups';
import useServer from '@/plugins/useServer';
import useFlash from '@/plugins/useFlash';
import { httpErrorToHuman } from '@/api/http';
@ -9,7 +9,6 @@ import CreateBackupButton from '@/components/server/backups/CreateBackupButton';
import FlashMessageRender from '@/components/FlashMessageRender';
import BackupRow from '@/components/server/backups/BackupRow';
import { ServerContext } from '@/state/server';
import ListRefreshIndicator from '@/components/elements/ListRefreshIndicator';
export default () => {
const { uuid } = useServer();
@ -36,7 +35,6 @@ export default () => {
return (
<div className={'mt-10 mb-6'}>
<ListRefreshIndicator visible={loading}/>
<FlashMessageRender byKey={'backups'} className={'mb-4'}/>
{!backups.length ?
<p className="text-center text-sm text-neutral-400">

2
resources/scripts/components/server/databases/DatabasesContainer.tsx
View file

@ -10,7 +10,6 @@ import CreateDatabaseButton from '@/components/server/databases/CreateDatabaseBu
import Can from '@/components/elements/Can';
import useFlash from '@/plugins/useFlash';
import useServer from '@/plugins/useServer';
import ListRefreshIndicator from '@/components/elements/ListRefreshIndicator';
export default () => {
const { uuid, featureLimits } = useServer();
@ -41,7 +40,6 @@ export default () => {
:
<CSSTransition classNames={'fade'} timeout={250}>
<>
<ListRefreshIndicator visible={loading}/>
{databases.length > 0 ?
databases.map((database, index) => (
<DatabaseRow

8
resources/scripts/components/server/schedules/ScheduleContainer.tsx
View file

@ -1,18 +1,15 @@
import React, { useEffect, useMemo, useState } from 'react';
import getServerSchedules, { Schedule } from '@/api/server/schedules/getServerSchedules';
import React, { useEffect, useState } from 'react';
import getServerSchedules from '@/api/server/schedules/getServerSchedules';
import { ServerContext } from '@/state/server';
import Spinner from '@/components/elements/Spinner';
import { RouteComponentProps } from 'react-router-dom';
import FlashMessageRender from '@/components/FlashMessageRender';
import ScheduleRow from '@/components/server/schedules/ScheduleRow';
import { httpErrorToHuman } from '@/api/http';
import { Actions, useStoreActions } from 'easy-peasy';
import { ApplicationStore } from '@/state';
import EditScheduleModal from '@/components/server/schedules/EditScheduleModal';
import Can from '@/components/elements/Can';
import useServer from '@/plugins/useServer';
import useFlash from '@/plugins/useFlash';
import ListRefreshIndicator from '@/components/elements/ListRefreshIndicator';
export default ({ match, history }: RouteComponentProps) => {
const { uuid } = useServer();
@ -37,7 +34,6 @@ export default ({ match, history }: RouteComponentProps) => {
return (
<div className={'my-10 mb-6'}>
<FlashMessageRender byKey={'schedules'} className={'mb-4'}/>
<ListRefreshIndicator visible={loading}/>
{(!schedules.length && loading) ?
<Spinner size={'large'} centered={true}/>
:

2
resources/scripts/components/server/users/UsersContainer.tsx
View file

@ -9,7 +9,6 @@ import FlashMessageRender from '@/components/FlashMessageRender';
import getServerSubusers from '@/api/server/users/getServerSubusers';
import { httpErrorToHuman } from '@/api/http';
import Can from '@/components/elements/Can';
import ListRefreshIndicator from '@/components/elements/ListRefreshIndicator';
export default () => {
const [ loading, setLoading ] = useState(true);
@ -48,7 +47,6 @@ export default () => {
return (
<div className={'mt-10 mb-6'}>
<ListRefreshIndicator visible={loading}/>
<FlashMessageRender byKey={'users'} className={'mb-4'}/>
{!subusers.length ?
<p className={'text-center text-sm text-neutral-400'}>