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

feat: add option to use variants with feedback (#5986)

Browse Source 
This PR will allow us to use a feature flag with variants to control
whether or not we should show the comments field of the feedback form.
This will allow us to see whether we can increase feedback collection if
we reduce the load on the customer.
This commit is contained in:
Fredrik Strand Oseberg 2024-01-22 13:14:27 +01:00 committed by GitHub
parent c5afa8ff11
commit 60d2176efa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 124 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

143
frontend/src/component/feedbackNew/FeedbackComponent.tsx
View File

@ -20,6 +20,7 @@ import { IToast } from 'interfaces/toast';
import { useTheme } from '@mui/material/styles';
import { FeedbackData, FeedbackMode } from './FeedbackContext';
import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
import { useUiFlag } from 'hooks/useUiFlag';
export const ParentContainer = styled('div')(({ theme }) => ({
position: 'relative',
@ -206,6 +207,7 @@ export const FeedbackComponent = ({
const { setHasSubmittedFeedback } = useUserSubmittedFeedback(
feedbackData.category,
);
const feedbackComments = useUiFlag('feedbackComments');
function isProvideFeedbackSchema(data: any): data is ProvideFeedbackSchema {
data.difficultyScore = data.difficultyScore
@ -349,50 +351,103 @@ export const FeedbackComponent = ({
</StyledScoreHelp>
</ScoreHelpContainer>
</StyledScoreContainer>
<Box>
<FormSubTitle>
{feedbackData.positiveLabel}
</FormSubTitle>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
name='positive'
multiline
rows={3}
variant='outlined'
size='small'
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
/>
</Box>
<Box>
<FormSubTitle>
{
feedbackData.areasForImprovementsLabel
}
</FormSubTitle>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
multiline
name='areasForImprovement'
rows={3}
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
variant='outlined'
size='small'
/>
</Box>
{feedbackComments !== false &&
feedbackComments.enabled &&
feedbackComments.name ===
'withoutComments' ? (
<>
<Box>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
name='positive'
hidden
value={
feedbackComments.name
}
multiline
rows={3}
variant='outlined'
size='small'
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
/>
</Box>
<Box>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
multiline
name='areasForImprovement'
rows={3}
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
variant='outlined'
size='small'
hidden
/>
</Box>
</>
) : (
<>
<Box>
<FormSubTitle>
{feedbackData.positiveLabel}
</FormSubTitle>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
name='positive'
multiline
rows={3}
variant='outlined'
size='small'
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
/>
</Box>
<Box>
<FormSubTitle>
{
feedbackData.areasForImprovementsLabel
}
</FormSubTitle>
<TextField
placeholder='Your answer here'
style={{ width: '100%' }}
multiline
name='areasForImprovement'
rows={3}
InputLabelProps={{
style: {
fontSize:
theme.fontSizes
.smallBody,
},
}}
variant='outlined'
size='small'
/>
</Box>
</>
)}
<StyledButtonContainer>
<StyledButton
disabled={!selectedScore}

1
frontend/src/interfaces/uiConfig.ts
View File

@ -77,6 +77,7 @@ export type UiFlags = {
adminTokenKillSwitch?: boolean;
executiveDashboard?: boolean;
changeRequestConflictHandling?: boolean;
feedbackComments?: Variant;
};
export interface IVersionInfo {

8
src/lib/__snapshots__/create-config.test.ts.snap
View File

@ -98,6 +98,14 @@ exports[`should create default config 1`] = `
"featureSearchFeedbackPosting": false,
"featureSearchFrontend": false,
"featuresExportImport": true,
"feedbackComments": {
"enabled": false,
"name": "feedbackComments",
"payload": {
"type": "json",
"value": "",
},
},
"filterInvalidClientMetrics": false,
"googleAuthEnabled": false,
"incomingWebhooks": false,

1
src/lib/routes/admin-api/config.ts
View File

@ -125,6 +125,7 @@ class ConfigController extends Controller {
const expFlags = this.config.flagResolver.getAll({
email: req.user.email,
});
const flags = { ...this.config.ui.flags, ...expFlags };
const response: UiConfigSchema = {

16
src/lib/types/experimental.ts
View File

@ -45,7 +45,8 @@ export type IFlagKey =
| 'extendedUsageMetricsUI'
| 'adminTokenKillSwitch'
| 'changeRequestConflictHandling'
| 'executiveDashboard';
| 'executiveDashboard'
| 'feedbackComments';
export type IFlags = Partial<{ [key in IFlagKey]: boolean | Variant }>;
@ -208,6 +209,19 @@ const flags: IFlags = {
process.env.UNLEASH_EXPERIMENTAL_EXECUTIVE_DASHBOARD,
false,
),
feedbackComments: {
name: 'feedbackComments',
enabled: parseEnvVarBoolean(
process.env.UNLEASH_EXPERIMENTAL_FEEDBACK_COMMENTS,
false,
),
payload: {
type: PayloadType.JSON,
value:
process.env.UNLEASH_EXPERIMENTAL_FEEDBACK_COMMENTS_PAYLOAD ??
'',
},
},
};
export const defaultExperimentalOptions: IExperimentalOptions = {