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

fix: make environment switch text clickable (#887)

Browse Source 
* fix: make environment switch text clickable

* refactor: use a cursor pointer for the label

* refactor: avoid empty clickable area
This commit is contained in:
olav 2022-04-20 15:00:56 +02:00 committed by GitHub
parent fdd683813a
commit 27a2a1a776
2 changed files with 22 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvSwitches/FeatureOverviewEnvSwitch/FeatureOverviewEnvSwitch.styles.ts Normal file
View File

@ -0,0 +1,9 @@
import { makeStyles } from '@material-ui/core/styles';
export const useStyles = makeStyles(theme => ({
label: {
display: 'inline-flex',
alignItems: 'center',
cursor: 'pointer',
},
}));

6
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvSwitches/FeatureOverviewEnvSwitch/FeatureOverviewEnvSwitch.tsx
View File

@ -10,6 +10,7 @@ import StringTruncator from 'component/common/StringTruncator/StringTruncator';
import { UPDATE_FEATURE_ENVIRONMENT } from 'component/providers/AccessProvider/permissions'; import { UPDATE_FEATURE_ENVIRONMENT } from 'component/providers/AccessProvider/permissions';
import React from 'react'; import React from 'react';
import { formatUnknownError } from 'utils/formatUnknownError'; import { formatUnknownError } from 'utils/formatUnknownError';
import { useStyles } from './FeatureOverviewEnvSwitch.styles';
interface IFeatureOverviewEnvSwitchProps { interface IFeatureOverviewEnvSwitchProps {
env: IFeatureEnvironment; env: IFeatureEnvironment;
@ -29,6 +30,7 @@ const FeatureOverviewEnvSwitch = ({
useFeatureApi(); useFeatureApi();
const { refetchFeature } = useFeature(projectId, featureId); const { refetchFeature } = useFeature(projectId, featureId);
const { setToastData, setToastApiError } = useToast(); const { setToastData, setToastApiError } = useToast();
const styles = useStyles();
const handleToggleEnvironmentOn = async () => { const handleToggleEnvironmentOn = async () => {
try { try {
@ -91,7 +93,8 @@ const FeatureOverviewEnvSwitch = ({
); );
return ( return (
<div style={{ display: 'flex', alignItems: 'center' }}> <div>
<label className={styles.label}>
<PermissionSwitch <PermissionSwitch
permission={UPDATE_FEATURE_ENVIRONMENT} permission={UPDATE_FEATURE_ENVIRONMENT}
projectId={projectId} projectId={projectId}
@ -100,6 +103,7 @@ const FeatureOverviewEnvSwitch = ({
environmentId={env.name} environmentId={env.name}
/> />
{content} {content}
</label>
</div> </div>
); );
}; };