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

Fix: jumping screen (#288)

* fix: add overflow-y scroll to html

* fix: add tab exceptions to scroll to top

* fix: remove unused imports
This commit is contained in:
Fredrik Strand Oseberg 2021-05-05 21:51:04 +02:00 committed by GitHub
parent 7b27f68b8e
commit 8d525ac477
4 changed files with 38 additions and 8 deletions

View File

@ -5,6 +5,8 @@
html { html {
height: 100%; height: 100%;
overflow: auto; overflow: auto;
overflow-y: scroll;
} }
body { body {
height: 100%; height: 100%;

View File

@ -39,7 +39,10 @@ class AddTagDialogComponent extends Component {
onCancel = evt => { onCancel = evt => {
evt.preventDefault(); evt.preventDefault();
this.setState({ openDialog: false, tag: { type: 'simple', value: '' } }); this.setState({
openDialog: false,
tag: { type: 'simple', value: '' },
});
}; };
onSubmit = async evt => { onSubmit = async evt => {
evt.preventDefault(); evt.preventDefault();
@ -49,7 +52,10 @@ class AddTagDialogComponent extends Component {
} }
try { try {
await this.props.submit(this.props.featureToggleName, tag); await this.props.submit(this.props.featureToggleName, tag);
this.setState({ openDialog: false, tag: { type: 'simple', value: '' } }); this.setState({
openDialog: false,
tag: { type: 'simple', value: '' },
});
} catch (e) { } catch (e) {
this.setState({ errors: { general: e.message } }); this.setState({ errors: { general: e.message } });
} }
@ -58,7 +64,9 @@ class AddTagDialogComponent extends Component {
const { tag, errors, openDialog } = this.state; const { tag, errors, openDialog } = this.state;
return ( return (
<React.Fragment> <React.Fragment>
<Button onClick={this.handleOpenDialog.bind(this)}>Add tag</Button> <Button onClick={this.handleOpenDialog.bind(this)}>
Add tag
</Button>
<Dialogue <Dialogue
open={openDialog} open={openDialog}
@ -69,13 +77,17 @@ class AddTagDialogComponent extends Component {
onClose={this.onCancel} onClose={this.onCancel}
> >
<> <>
<DialogContentText>Tags allows you to group features together</DialogContentText> <DialogContentText>
Tags allows you to group features together
</DialogContentText>
<form onSubmit={this.onSubmit}> <form onSubmit={this.onSubmit}>
<section className={styles.dialogueFormContent}> <section className={styles.dialogueFormContent}>
<TagTypeSelect <TagTypeSelect
name="type" name="type"
value={tag.type} value={tag.type}
onChange={v => this.setValue('type', v.target.value)} onChange={v =>
this.setValue('type', v.target.value)
}
/> />
<br /> <br />
<TextField <TextField
@ -86,10 +98,14 @@ class AddTagDialogComponent extends Component {
placeholder="Your tag" placeholder="Your tag"
value={tag.value} value={tag.value}
error={errors.value} error={errors.value}
onChange={v => this.setValue('value', v.target.value)} onChange={v =>
this.setValue('value', v.target.value)
}
/> />
</section> </section>
{errors.general && <p style={{ color: 'red' }}>{errors.general}</p>} {errors.general && (
<p style={{ color: 'red' }}>{errors.general}</p>
)}
</form> </form>
</> </>
</Dialogue> </Dialogue>

View File

@ -9,6 +9,18 @@ class ScrollToTop extends Component {
componentDidUpdate(prevProps) { componentDidUpdate(prevProps) {
if (this.props.location !== prevProps.location) { if (this.props.location !== prevProps.location) {
if (
this.props.location.pathname.includes('/features/metrics') ||
this.props.location.pathname.includes('/features/variants') ||
this.props.location.pathname.includes('/features/strategies') ||
this.props.location.pathname.includes('/features/logs') ||
this.props.location.pathname.includes('/admin/api') ||
this.props.location.pathname.includes('/admin/users') ||
this.props.location.pathname.includes('/admin/auth')
) {
return;
}
window.scrollTo(0, 0); window.scrollTo(0, 0);
} }
} }

View File

@ -1,4 +1,4 @@
import React, { useContext } from 'react'; import { useContext } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import UsersList from './UsersList'; import UsersList from './UsersList';
import AdminMenu from '../admin-menu'; import AdminMenu from '../admin-menu';