Browse Source

Fixed double page class on api keys and org details page

Torkel Ödegaard 6 years ago
parent
commit
4408817e65

+ 4 - 4
public/app/features/api-keys/ApiKeysPage.tsx

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

+ 95 - 99
public/app/features/api-keys/__snapshots__/ApiKeysPage.test.tsx.snap

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

+ 9 - 11
public/app/features/org/OrgDetailsPage.tsx

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

+ 10 - 18
public/app/features/org/__snapshots__/OrgDetailsPage.test.tsx.snap

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