1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-02 01:17:58 +02:00

feat: add click away handler to sidebar content (#5751)

Does what it says on the can
This commit is contained in:
Fredrik Strand Oseberg 2024-01-04 12:33:00 +01:00 committed by GitHub
parent ff96563742
commit 5582339560
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,6 +1,7 @@
import { import {
Box, Box,
Button, Button,
ClickAwayListener,
IconButton, IconButton,
styled, styled,
TextField, TextField,
@ -257,6 +258,7 @@ export const FeedbackComponent = ({
condition={showFeedback} condition={showFeedback}
show={ show={
<ParentContainer> <ParentContainer>
<ClickAwayListener onClickAway={() => closeFeedback()}>
<StyledContainer> <StyledContainer>
<Tooltip title='Close' arrow> <Tooltip title='Close' arrow>
<StyledCloseButton <StyledCloseButton
@ -284,17 +286,23 @@ export const FeedbackComponent = ({
<FormTitle>{feedbackData.title}</FormTitle> <FormTitle>{feedbackData.title}</FormTitle>
<StyledScoreContainer> <StyledScoreContainer>
<StyledScoreInput> <StyledScoreInput>
{[1, 2, 3, 4, 5, 6, 7].map((score) => ( {[1, 2, 3, 4, 5, 6, 7].map(
<StyledScoreValue key={score}> (score) => (
<StyledScoreValue
key={score}
>
<input <input
type='radio' type='radio'
name='difficultyScore' name='difficultyScore'
value={score} value={score}
onChange={onScoreChange} onChange={
onScoreChange
}
/> />
<span>{score}</span> <span>{score}</span>
</StyledScoreValue> </StyledScoreValue>
))} ),
)}
</StyledScoreInput> </StyledScoreInput>
<ScoreHelpContainer> <ScoreHelpContainer>
<StyledScoreHelp> <StyledScoreHelp>
@ -320,14 +328,17 @@ export const FeedbackComponent = ({
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: fontSize:
theme.fontSizes.smallBody, theme.fontSizes
.smallBody,
}, },
}} }}
/> />
</Box> </Box>
<Box> <Box>
<FormSubTitle> <FormSubTitle>
{feedbackData.areasForImprovementsLabel} {
feedbackData.areasForImprovementsLabel
}
</FormSubTitle> </FormSubTitle>
<TextField <TextField
placeholder='Your answer here' placeholder='Your answer here'
@ -338,7 +349,8 @@ export const FeedbackComponent = ({
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: fontSize:
theme.fontSizes.smallBody, theme.fontSizes
.smallBody,
}, },
}} }}
variant='outlined' variant='outlined'
@ -357,6 +369,7 @@ export const FeedbackComponent = ({
</StyledForm> </StyledForm>
</StyledContent> </StyledContent>
</StyledContainer> </StyledContainer>
</ClickAwayListener>
</ParentContainer> </ParentContainer>
} }
/> />