// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Render should render API keys table if there are any keys 1`] = `
<div>
  <PageHeader
    model={Object {}}
  />
  <PageLoader
    pageName="Api keys"
  />
</div>
`;

exports[`Render should render CTA if there are no API keys 1`] = `
<div>
  <PageHeader
    model={Object {}}
  />
  <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.",
        }
      }
    />
    <Component
      in={false}
    >
      <div
        className="cta-form"
      >
        <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]}
        >
          <div
            className="gf-form-inline"
          >
            <div
              className="gf-form max-width-21"
            >
              <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"
            >
              <span
                className="gf-form-label"
              >
                Role
              </span>
              <span
                className="gf-form-select-wrapper"
              >
                <select
                  className="gf-form-input gf-size-auto"
                  onChange={[Function]}
                  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"
            >
              <button
                className="btn gf-form-btn btn-success"
              >
                Add
              </button>
            </div>
          </div>
        </form>
      </div>
    </Component>
  </div>
</div>
`;
