import React from 'react'; import { ServerContext } from '@/state/server'; import TitledGreyBox from '@/components/elements/TitledGreyBox'; import { Form, Formik, FormikHelpers, useFormikContext } from 'formik'; import { Actions, useStoreActions } from 'easy-peasy'; import renameServer from '@/api/server/renameServer'; import Field from '@/components/elements/Field'; import { object, string } from 'yup'; import SpinnerOverlay from '@/components/elements/SpinnerOverlay'; import { ApplicationStore } from '@/state'; import { httpErrorToHuman } from '@/api/http'; import { Button } from '@/components/elements/button/index'; import tw from 'twin.macro'; interface Values { name: string; } const RenameServerBox = () => { const { isSubmitting } = useFormikContext(); return (
); }; export default () => { const server = ServerContext.useStoreState(state => state.server.data!); const setServer = ServerContext.useStoreActions(actions => actions.server.setServer); const { addError, clearFlashes } = useStoreActions((actions: Actions) => actions.flashes); const submit = ({ name }: Values, { setSubmitting }: FormikHelpers) => { clearFlashes('settings'); renameServer(server.uuid, name) .then(() => setServer({ ...server, name })) .catch(error => { console.error(error); addError({ key: 'settings', message: httpErrorToHuman(error) }); }) .then(() => setSubmitting(false)); }; return ( ); };