mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2024-11-22 09:36:43 +03:00
fix(devui): Fix buggy UI behaviors with redux-devtools-app (#709)
* fix(devui): Always run updateTabs on UNSAFE_componentWillReceiveProps. Otherwise, the changes in property tabs might not be reflected on the UI. * chore(*): Update devui version. Fix the container growing out of viewport when too many actions. * fix(devui): Update snapshots * Update Tabs.tsx * Update package.json * Update package.json Co-authored-by: Nathan Bierema <nbierema@gmail.com>
This commit is contained in:
parent
fcd73ab043
commit
ed25a72e99
|
@ -6,6 +6,8 @@ export const MainContainerWrapper = styled.div`
|
|||
height: 100%;
|
||||
width: 100%;
|
||||
flex-flow: column nowrap;
|
||||
flex-shrink: 1;
|
||||
min-height: 0;
|
||||
background-color: ${(props) => color(props.theme.base00, 'lighten', 0.03)};
|
||||
color: ${(props) => props.theme.base07};
|
||||
font-size: 12px;
|
||||
|
@ -30,7 +32,8 @@ export const MainContainerWrapper = styled.div`
|
|||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
height: 100%;
|
||||
flex-shrink: 1;
|
||||
min-height: 0;
|
||||
|
||||
> div {
|
||||
flex-grow: 1;
|
||||
|
@ -43,4 +46,6 @@ export const ContainerWrapper = styled.div`
|
|||
height: 100%;
|
||||
width: 100%;
|
||||
flex-flow: column nowrap;
|
||||
flex-shrink: 1;
|
||||
min-height: 0;
|
||||
`;
|
||||
|
|
|
@ -24,12 +24,6 @@ export default class Tabs<P> extends Component<TabsProps<P>> {
|
|||
SelectedComponent?: React.ComponentType<P>;
|
||||
selector?: () => P;
|
||||
|
||||
UNSAFE_componentWillReceiveProps(nextProps: TabsProps<P>) {
|
||||
if (nextProps.selected !== this.props.selected) {
|
||||
this.updateTabs(nextProps);
|
||||
}
|
||||
}
|
||||
|
||||
onMouseUp: React.MouseEventHandler<HTMLButtonElement> = (e) => {
|
||||
e.currentTarget.blur();
|
||||
};
|
||||
|
@ -38,7 +32,7 @@ export default class Tabs<P> extends Component<TabsProps<P>> {
|
|||
this.props.onClick(e.currentTarget.value);
|
||||
};
|
||||
|
||||
updateTabs(props: TabsProps<P>) {
|
||||
updateTabs(props: TabsProps<P>): void {
|
||||
const tabs = props.tabs;
|
||||
const selected = props.selected;
|
||||
|
||||
|
@ -67,6 +61,8 @@ export default class Tabs<P> extends Component<TabsProps<P>> {
|
|||
}
|
||||
|
||||
render() {
|
||||
this.updateTabs(nextProps);
|
||||
|
||||
const tabsHeader = (
|
||||
<TabsHeader
|
||||
tabs={this.tabsHeader!}
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
exports[`Container renders correctly 1`] = `
|
||||
<div
|
||||
class="sc-AxjAm XFnbZ"
|
||||
class="sc-AxjAm jlQKkV"
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue
Block a user