Remove last calls to useServer

This commit is contained in:
Dane Everitt 2020-08-25 22:09:54 -07:00
parent 6bc51adad7
commit 8c98264eed
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
13 changed files with 44 additions and 64 deletions

View file

@ -8,7 +8,6 @@ import { ServerContext } from '@/state/server';
import { httpErrorToHuman } from '@/api/http';
import FlashMessageRender from '@/components/FlashMessageRender';
import useFlash from '@/plugins/useFlash';
import useServer from '@/plugins/useServer';
import Button from '@/components/elements/Button';
import tw from 'twin.macro';
@ -29,7 +28,7 @@ const schema = object().shape({
});
export default () => {
const { uuid } = useServer();
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const { addError, clearFlashes } = useFlash();
const [ visible, setVisible ] = useState(false);

View file

@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faDatabase, faTrashAlt, faEye } from '@fortawesome/free-solid-svg-icons';
import { faDatabase, faEye, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
import Modal from '@/components/elements/Modal';
import { Form, Formik, FormikHelpers } from 'formik';
import Field from '@/components/elements/Field';
@ -12,7 +12,6 @@ import { httpErrorToHuman } from '@/api/http';
import RotatePasswordButton from '@/components/server/databases/RotatePasswordButton';
import Can from '@/components/elements/Can';
import { ServerDatabase } from '@/api/server/getServerDatabases';
import useServer from '@/plugins/useServer';
import useFlash from '@/plugins/useFlash';
import tw from 'twin.macro';
import Button from '@/components/elements/Button';
@ -26,7 +25,7 @@ interface Props {
}
export default ({ database, className }: Props) => {
const { uuid } = useServer();
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const { addError, clearFlashes } = useFlash();
const [ visible, setVisible ] = useState(false);
const [ connectionVisible, setConnectionVisible ] = useState(false);

View file

@ -1,5 +1,4 @@
import React, { useEffect, useState } from 'react';
import { Helmet } from 'react-helmet';
import getServerDatabases from '@/api/server/getServerDatabases';
import { ServerContext } from '@/state/server';
import { httpErrorToHuman } from '@/api/http';
@ -9,17 +8,19 @@ import Spinner from '@/components/elements/Spinner';
import CreateDatabaseButton from '@/components/server/databases/CreateDatabaseButton';
import Can from '@/components/elements/Can';
import useFlash from '@/plugins/useFlash';
import useServer from '@/plugins/useServer';
import PageContentBlock from '@/components/elements/PageContentBlock';
import tw from 'twin.macro';
import Fade from '@/components/elements/Fade';
import ServerContentBlock from '@/components/elements/ServerContentBlock';
import { useDeepMemoize } from '@/plugins/useDeepMemoize';
export default () => {
const { uuid, featureLimits, name: serverName } = useServer();
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const databaseLimit = ServerContext.useStoreState(state => state.server.data!.featureLimits.databases);
const { addError, clearFlashes } = useFlash();
const [ loading, setLoading ] = useState(true);
const databases = ServerContext.useStoreState(state => state.databases.data);
const databases = useDeepMemoize(ServerContext.useStoreState(state => state.databases.data));
const setDatabases = ServerContext.useStoreActions(state => state.databases.setDatabases);
useEffect(() => {
@ -36,10 +37,7 @@ export default () => {
}, []);
return (
<PageContentBlock>
<Helmet>
<title> {serverName} | Databases </title>
</Helmet>
<ServerContentBlock title={'Databases'}>
<FlashMessageRender byKey={'databases'} css={tw`mb-4`}/>
{(!databases.length && loading) ?
<Spinner size={'large'} centered/>
@ -56,7 +54,7 @@ export default () => {
))
:
<p css={tw`text-center text-sm text-neutral-400`}>
{featureLimits.databases > 0 ?
{databaseLimit > 0 ?
'It looks like you have no databases.'
:
'Databases cannot be created for this server.'
@ -64,13 +62,13 @@ export default () => {
</p>
}
<Can action={'database.create'}>
{(featureLimits.databases > 0 && databases.length > 0) &&
{(databaseLimit > 0 && databases.length > 0) &&
<p css={tw`text-center text-xs text-neutral-400 mt-2`}>
{databases.length} of {featureLimits.databases} databases have been allocated to this
{databases.length} of {databaseLimit} databases have been allocated to this
server.
</p>
}
{featureLimits.databases > 0 && featureLimits.databases !== databases.length &&
{databaseLimit > 0 && databaseLimit !== databases.length &&
<div css={tw`mt-6 flex justify-end`}>
<CreateDatabaseButton/>
</div>
@ -79,6 +77,6 @@ export default () => {
</>
</Fade>
}
</PageContentBlock>
</ServerContentBlock>
);
};