pt
/
superset
mirror of https://github.com/apache/superset.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: remove panel from userinfo component (#14364) 

* first pass

* fix merge

* fix lint

* covert pane to styled comp

* add theme

* fix lint

* fix test

* remove unused import
This commit is contained in:
Phillip Kelley-Dotson 2021-05-08 15:04:16 -07:00 committed by GitHub
parent e16c4d856e
commit cee22e28c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
superset-frontend/spec/javascripts/profile/App_spec.tsx
View File

@ -20,7 +20,6 @@ import React from 'react';
import { Row, Col } from 'src/common/components'; import { Row, Col } from 'src/common/components';
import { shallow } from 'enzyme'; import { shallow } from 'enzyme';
import App from 'src/profile/components/App'; import App from 'src/profile/components/App';
import Tabs from 'src/components/Tabs';
import { user } from './fixtures'; import { user } from './fixtures';
@ -40,6 +39,6 @@ describe('App', () => {
it('renders 4 Tabs', () => { it('renders 4 Tabs', () => {
const wrapper = shallow(<App {...mockedProps} />); const wrapper = shallow(<App {...mockedProps} />);
expect(wrapper.find(Tabs.TabPane)).toHaveLength(4); expect(wrapper.find('[tab]')).toHaveLength(4);
}); });
}); });

48
superset-frontend/src/profile/components/App.tsx
View File

@ -17,10 +17,9 @@
* under the License. * under the License.
*/ */
import React from 'react'; import React from 'react';
import { t, styled } from '@superset-ui/core';
import { Row, Col } from 'src/common/components'; import { Row, Col } from 'src/common/components';
import { Panel } from 'react-bootstrap';
import Tabs from 'src/components/Tabs'; import Tabs from 'src/components/Tabs';
import { t } from '@superset-ui/core';
import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes'; import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
import Favorites from './Favorites'; import Favorites from './Favorites';
import UserInfo from './UserInfo'; import UserInfo from './UserInfo';
@ -32,6 +31,11 @@ interface AppProps {
user: UserWithPermissionsAndRoles; user: UserWithPermissionsAndRoles;
} }
const StyledTabPane = styled(Tabs.TabPane)`
background-color: ${({ theme }) => theme.colors.grayscale.light5};
padding: ${({ theme }) => theme.gridUnit * 4}px;
`;
export default function App({ user }: AppProps) { export default function App({ user }: AppProps) {
return ( return (
<div className="container app"> <div className="container app">
@ -41,7 +45,7 @@ export default function App({ user }: AppProps) {
</Col> </Col>
<Col xs={24} md={18}> <Col xs={24} md={18}>
<Tabs centered> <Tabs centered>
<Tabs.TabPane <StyledTabPane
key="1" key="1"
tab={ tab={
<div> <div>
@ -49,13 +53,9 @@ export default function App({ user }: AppProps) {
</div> </div>
} }
> >
<Panel> <Favorites user={user} />
<Panel.Body> </StyledTabPane>
<Favorites user={user} /> <StyledTabPane
</Panel.Body>
</Panel>
</Tabs.TabPane>
<Tabs.TabPane
key="2" key="2"
tab={ tab={
<div> <div>
@ -63,13 +63,9 @@ export default function App({ user }: AppProps) {
</div> </div>
} }
> >
<Panel> <CreatedContent user={user} />
<Panel.Body> </StyledTabPane>
<CreatedContent user={user} /> <StyledTabPane
</Panel.Body>
</Panel>
</Tabs.TabPane>
<Tabs.TabPane
key="3" key="3"
tab={ tab={
<div> <div>
@ -77,13 +73,9 @@ export default function App({ user }: AppProps) {
</div> </div>
} }
> >
<Panel> <RecentActivity user={user} />
<Panel.Body> </StyledTabPane>
<RecentActivity user={user} /> <StyledTabPane
</Panel.Body>
</Panel>
</Tabs.TabPane>
<Tabs.TabPane
key="4" key="4"
tab={ tab={
<div> <div>
@ -91,12 +83,8 @@ export default function App({ user }: AppProps) {
</div> </div>
} }
> >
<Panel> <Security user={user} />
<Panel.Body> </StyledTabPane>
<Security user={user} />
</Panel.Body>
</Panel>
</Tabs.TabPane>
</Tabs> </Tabs>
</Col> </Col>
</Row> </Row>