Fixed double page class on api keys and org details page

This commit is contained in:
Torkel Ödegaard 2019-02-11 15:13:20 +01:00
parent 1c364b57b5
commit 4408817e65
4 changed files with 119 additions and 133 deletions

View File

@ -107,7 +107,7 @@ export class ApiKeysPage extends PureComponent<Props, any> {
renderEmptyList() { renderEmptyList() {
const { isAdding } = this.state; const { isAdding } = this.state;
return ( return (
<div className="page-container page-body"> <>
{!isAdding && ( {!isAdding && (
<EmptyListCTA <EmptyListCTA
model={{ model={{
@ -124,7 +124,7 @@ export class ApiKeysPage extends PureComponent<Props, any> {
/> />
)} )}
{this.renderAddApiKeyForm()} {this.renderAddApiKeyForm()}
</div> </>
); );
} }
@ -183,7 +183,7 @@ export class ApiKeysPage extends PureComponent<Props, any> {
const { apiKeys, searchQuery } = this.props; const { apiKeys, searchQuery } = this.props;
return ( return (
<div className="page-container page-body"> <>
<div className="page-action-bar"> <div className="page-action-bar">
<div className="gf-form gf-form--grow"> <div className="gf-form gf-form--grow">
<label className="gf-form--has-input-icon gf-form--grow"> <label className="gf-form--has-input-icon gf-form--grow">
@ -231,7 +231,7 @@ export class ApiKeysPage extends PureComponent<Props, any> {
</tbody> </tbody>
) : null} ) : null}
</table> </table>
</div> </>
); );
} }

View File

@ -35,118 +35,114 @@ exports[`Render should render CTA if there are no API keys 1`] = `
<PageContents <PageContents
isLoading={false} isLoading={false}
> >
<div <EmptyListCTA
className="page-container page-body" model={
> Object {
<EmptyListCTA "buttonIcon": "fa fa-plus",
model={ "buttonLink": "#",
Object { "buttonTitle": " New API Key",
"buttonIcon": "fa fa-plus", "onClick": [Function],
"buttonLink": "#", "proTip": "Remember you can provide view-only API access to other applications.",
"buttonTitle": " New API Key", "proTipLink": "",
"onClick": [Function], "proTipLinkTitle": "",
"proTip": "Remember you can provide view-only API access to other applications.", "proTipTarget": "_blank",
"proTipLink": "", "title": "You haven't added any API Keys yet.",
"proTipLinkTitle": "",
"proTipTarget": "_blank",
"title": "You haven't added any API Keys yet.",
}
} }
/> }
<Component />
in={false} <Component
in={false}
>
<div
className="cta-form"
> >
<div <button
className="cta-form" className="cta-form__close btn btn-transparent"
onClick={[Function]}
> >
<button <i
className="cta-form__close btn btn-transparent" className="fa fa-close"
onClick={[Function]} />
> </button>
<i <h5>
className="fa fa-close" Add API Key
/> </h5>
</button> <form
<h5> className="gf-form-group"
Add API Key onSubmit={[Function]}
</h5> >
<form <div
className="gf-form-group" className="gf-form-inline"
onSubmit={[Function]}
> >
<div <div
className="gf-form-inline" className="gf-form max-width-21"
> >
<div <span
className="gf-form max-width-21" className="gf-form-label"
> >
<span Key name
className="gf-form-label" </span>
> <input
Key name className="gf-form-input"
</span> onChange={[Function]}
<input placeholder="Name"
className="gf-form-input" type="text"
value=""
/>
</div>
<div
className="gf-form"
>
<span
className="gf-form-label"
>
Role
</span>
<span
className="gf-form-select-wrapper"
>
<select
className="gf-form-input gf-size-auto"
onChange={[Function]} onChange={[Function]}
placeholder="Name" value="Viewer"
type="text"
value=""
/>
</div>
<div
className="gf-form"
>
<span
className="gf-form-label"
> >
Role <option
</span> key="Viewer"
<span label="Viewer"
className="gf-form-select-wrapper"
>
<select
className="gf-form-input gf-size-auto"
onChange={[Function]}
value="Viewer" value="Viewer"
> >
<option Viewer
key="Viewer" </option>
label="Viewer" <option
value="Viewer" key="Editor"
> label="Editor"
Viewer value="Editor"
</option> >
<option Editor
key="Editor" </option>
label="Editor" <option
value="Editor" key="Admin"
> label="Admin"
Editor value="Admin"
</option> >
<option Admin
key="Admin" </option>
label="Admin" </select>
value="Admin" </span>
>
Admin
</option>
</select>
</span>
</div>
<div
className="gf-form"
>
<button
className="btn gf-form-btn btn-success"
>
Add
</button>
</div>
</div> </div>
</form> <div
</div> className="gf-form"
</Component> >
</div> <button
className="btn gf-form-btn btn-success"
>
Add
</button>
</div>
</div>
</form>
</div>
</Component>
</PageContents> </PageContents>
</Page> </Page>
`; `;

View File

@ -36,18 +36,16 @@ export class OrgDetailsPage extends PureComponent<Props> {
return ( return (
<Page navModel={navModel}> <Page navModel={navModel}>
<Page.Contents isLoading={isLoading}> <Page.Contents isLoading={isLoading}>
<div className="page-container page-body"> {!isLoading && (
{!isLoading && ( <div>
<div> <OrgProfile
<OrgProfile onOrgNameChange={name => this.onOrgNameChange(name)}
onOrgNameChange={name => this.onOrgNameChange(name)} onSubmit={this.onUpdateOrganization}
onSubmit={this.onUpdateOrganization} orgName={organization.name}
orgName={organization.name} />
/> <SharedPreferences resourceUri="org" />
<SharedPreferences resourceUri="org" />
</div>
)}
</div> </div>
)}
</Page.Contents> </Page.Contents>
</Page> </Page>
); );

View File

@ -15,11 +15,7 @@ exports[`Render should render component 1`] = `
> >
<PageContents <PageContents
isLoading={true} isLoading={true}
> />
<div
className="page-container page-body"
/>
</PageContents>
</Page> </Page>
`; `;
@ -39,19 +35,15 @@ exports[`Render should render organization and preferences 1`] = `
<PageContents <PageContents
isLoading={false} isLoading={false}
> >
<div <div>
className="page-container page-body" <OrgProfile
> onOrgNameChange={[Function]}
<div> onSubmit={[Function]}
<OrgProfile orgName="Cool org"
onOrgNameChange={[Function]} />
onSubmit={[Function]} <SharedPreferences
orgName="Cool org" resourceUri="org"
/> />
<SharedPreferences
resourceUri="org"
/>
</div>
</div> </div>
</PageContents> </PageContents>
</Page> </Page>