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

exports[`Render should render API keys table if there are any keys 1`] = `
<Page
  navModel={
    Object {
      "main": Object {
        "text": "Configuration",
      },
      "node": Object {
        "text": "Api Keys",
      },
    }
  }
>
  <PageContents
    isLoading={true}
  />
</Page>
`;

exports[`Render should render CTA if there are no API keys 1`] = `
<Page
  navModel={
    Object {
      "main": Object {
        "text": "Configuration",
      },
      "node": Object {
        "text": "Api Keys",
      },
    }
  }
>
  <PageContents
    isLoading={false}
  >
    <EmptyListCTA
      buttonIcon="key-skeleton-alt"
      buttonLink="#"
      buttonTitle=" New API Key"
      onClick={[Function]}
      proTip="Remember you can provide view-only API access to other applications."
      title="You haven't added any API Keys yet."
    />
    <SlideDown
      in={false}
    >
      <div
        className="gf-form-inline cta-form"
      >
        <button
          className="cta-form__close btn btn-transparent"
          onClick={[Function]}
        >
          <Icon
            name="times"
          />
        </button>
        <form
          className="gf-form-group"
          onSubmit={[Function]}
        >
          <h5>
            Add API Key
          </h5>
          <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 max-width-21"
            >
              <FormLabel
                tooltip="The api key life duration. For example 1d if your key is going to last for one day. All the supported units are: s,m,h,d,w,M,y"
              >
                Time to live
              </FormLabel>
              <Input
                className="gf-form-input"
                onChange={[Function]}
                placeholder="1d"
                type="text"
                validationEvents={
                  Object {
                    "onBlur": Array [
                      Object {
                        "errorMessage": "Not a valid duration",
                        "rule": [Function],
                      },
                    ],
                  }
                }
                value=""
              />
            </div>
            <div
              className="gf-form"
            >
              <button
                className="btn gf-form-btn btn-primary"
              >
                Add
              </button>
            </div>
          </div>
        </form>
      </div>
    </SlideDown>
  </PageContents>
</Page>
`;
