mirror of
https://github.com/scm-manager/scm-manager.git
synced 2025-11-06 13:35:44 +01:00
Scroll to top after page change/click on submit button
This commit is contained in:
@@ -4,7 +4,16 @@ import Button, { type ButtonProps } from "./Button";
|
|||||||
|
|
||||||
class SubmitButton extends React.Component<ButtonProps> {
|
class SubmitButton extends React.Component<ButtonProps> {
|
||||||
render() {
|
render() {
|
||||||
return <Button type="submit" color="primary" {...this.props} />;
|
return (
|
||||||
|
<Button
|
||||||
|
type="submit"
|
||||||
|
color="primary"
|
||||||
|
{...this.props}
|
||||||
|
action={() => {
|
||||||
|
window.scrollTo(0, 0);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ import {
|
|||||||
} from "../modules/indexResource";
|
} from "../modules/indexResource";
|
||||||
import PluginLoader from "./PluginLoader";
|
import PluginLoader from "./PluginLoader";
|
||||||
import type { IndexResources } from "@scm-manager/ui-types";
|
import type { IndexResources } from "@scm-manager/ui-types";
|
||||||
|
import ScrollToTop from "./ScrollToTop";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
error: Error,
|
error: Error,
|
||||||
@@ -32,7 +33,6 @@ type State = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
class Index extends Component<Props, State> {
|
class Index extends Component<Props, State> {
|
||||||
|
|
||||||
constructor(props: Props) {
|
constructor(props: Props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
@@ -66,9 +66,14 @@ class Index extends Component<Props, State> {
|
|||||||
return <Loading />;
|
return <Loading />;
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<PluginLoader loaded={ pluginsLoaded } callback={ this.pluginLoaderCallback }>
|
<ScrollToTop>
|
||||||
|
<PluginLoader
|
||||||
|
loaded={pluginsLoaded}
|
||||||
|
callback={this.pluginLoaderCallback}
|
||||||
|
>
|
||||||
<App />
|
<App />
|
||||||
</PluginLoader>
|
</PluginLoader>
|
||||||
|
</ScrollToTop>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
23
scm-ui/src/containers/ScrollToTop.js
Normal file
23
scm-ui/src/containers/ScrollToTop.js
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
// @flow
|
||||||
|
import React from "react";
|
||||||
|
import { withRouter } from "react-router-dom";
|
||||||
|
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
location: any,
|
||||||
|
children: any
|
||||||
|
}
|
||||||
|
|
||||||
|
class ScrollToTop extends React.Component<Props> {
|
||||||
|
componentDidUpdate(prevProps) {
|
||||||
|
if (this.props.location.pathname !== prevProps.location.pathname) {
|
||||||
|
window.scrollTo(0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return this.props.children;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withRouter(ScrollToTop);
|
||||||
Reference in New Issue
Block a user