Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-04 00:18:01 +01:00
Code Issues Projects Releases Wiki Activity

Maintenance UI fixes (#2849)

Browse Source 
Maintenance UI fixes
This commit is contained in:
sjaanus 2023-01-09 15:54:14 +02:00 committed by GitHub
parent d13401b6ed
commit 7b075954a1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 35 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/component/admin/maintenance/MaintenanceToggle.tsx
View File

@ -1,8 +1,6 @@
import React from 'react';
import {
Box,
Card,
CardContent,
FormControlLabel,
styled,
Switch,
@ -12,24 +10,25 @@ import { useMaintenance } from 'hooks/api/getters/useMaintenance/useMaintenance'
import { useMaintenanceApi } from 'hooks/api/actions/useMaintenanceApi/useMaintenanceApi';
import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
const StyledCard = styled(Card)(({ theme }) => ({
const StyledContainer = styled('div')(({ theme }) => ({
display: 'flex',
flexDirection: 'column',
padding: theme.spacing(2.5),
padding: theme.spacing(3),
border: `1px solid ${theme.palette.dividerAlternative}`,
borderRadius: theme.shape.borderRadiusLarge,
boxShadow: theme.boxShadows.card,
fontSize: theme.fontSizes.smallBody,
}));
const CardTitleRow = styled(Box)(({ theme }) => ({
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
}));
const CardDescription = styled(Box)(({ theme }) => ({
color: theme.palette.text.secondary,
fontSize: theme.fontSizes.smallBody,
marginTop: theme.spacing(2),
}));
const SwitchLabel = styled(Typography)(({ theme }) => ({
@ -51,12 +50,11 @@ export const MaintenanceToggle = () => {
};
return (
<StyledCard>
<CardContent>
<StyledContainer>
<CardTitleRow>
<b>Maintenance Mode</b>
<FormControlLabel
sx={{ fontSize: '10px' }}
sx={{ margin: 0 }}
control={
<Switch
onChange={updateEnabled}
@ -73,12 +71,11 @@ export const MaintenanceToggle = () => {
/>
</CardTitleRow>
<CardDescription>
Maintenance Mode is useful when you want to freeze your
system so nobody can do any changes during this time. When
enabled it will show a banner at the top of the applications
and only an admin can enable it or disable it.
Maintenance Mode is useful when you want to freeze your system
so nobody can do any changes during this time. When enabled it
will show a banner at the top of the applications and only an
admin can enable it or disable it.
</CardDescription>
</CardContent>
</StyledCard>
</StyledContainer>
);
};

8
frontend/src/component/admin/maintenance/index.tsx
View File

@ -7,9 +7,7 @@ import AccessContext from 'contexts/AccessContext';
import React, { useContext } from 'react';
import { PageContent } from 'component/common/PageContent/PageContent';
import { PageHeader } from 'component/common/PageHeader/PageHeader';
import { Box, CardContent, styled } from '@mui/material';
import { CorsHelpAlert } from 'component/admin/cors/CorsHelpAlert';
import { CorsForm } from 'component/admin/cors/CorsForm';
import { Box, styled } from '@mui/material';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { MaintenanceTooltip } from './MaintenanceTooltip';
import { MaintenanceToggle } from './MaintenanceToggle';
@ -36,10 +34,10 @@ export const MaintenanceAdmin = () => {
const StyledBox = styled(Box)(({ theme }) => ({
display: 'grid',
gap: theme.spacing(2),
gap: theme.spacing(4),
}));
const MaintenancePage = () => {
const { uiConfig, loading } = useUiConfig();
const { loading } = useUiConfig();
if (loading) {
return null;