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

exports[`Render should render alert rules 1`] = `
<Page
  navModel={Object {}}
>
  <PageContents
    isLoading={false}
  >
    <div
      className="page-action-bar"
    >
      <div
        className="gf-form gf-form--grow"
      >
        <Component
          inputClassName="gf-form-input"
          labelClassName="gf-form--has-input-icon gf-form--grow"
          onChange={[Function]}
          placeholder="Search alerts"
          value=""
        />
      </div>
      <div
        className="gf-form"
      >
        <label
          className="gf-form-label"
        >
          States
        </label>
        <div
          className="width-13"
        >
          <Select
            onChange={[Function]}
            options={
              Array [
                Object {
                  "label": "All",
                  "value": "all",
                },
                Object {
                  "label": "OK",
                  "value": "ok",
                },
                Object {
                  "label": "Not OK",
                  "value": "not_ok",
                },
                Object {
                  "label": "Alerting",
                  "value": "alerting",
                },
                Object {
                  "label": "No Data",
                  "value": "no_data",
                },
                Object {
                  "label": "Paused",
                  "value": "paused",
                },
                Object {
                  "label": "Pending",
                  "value": "pending",
                },
              ]
            }
            value="all"
          />
        </div>
      </div>
      <div
        className="page-action-bar__spacer"
      />
      <Button
        onClick={[Function]}
        variant="secondary"
      >
        How to add an alert
      </Button>
    </div>
    <section>
      <ol
        className="alert-rule-list"
      >
        <AlertRuleItem
          key="1"
          onTogglePause={[Function]}
          rule={
            Object {
              "dashboardId": 7,
              "dashboardSlug": "alerting-with-testdata",
              "dashboardUid": "ggHbN42mk",
              "evalData": Object {},
              "evalDate": "0001-01-01T00:00:00Z",
              "executionError": "",
              "id": 1,
              "name": "TestData - Always OK",
              "newStateDate": "2018-09-04T10:01:01+02:00",
              "panelId": 3,
              "state": "ok",
              "url": "/d/ggHbN42mk/alerting-with-testdata",
            }
          }
          search=""
        />
        <AlertRuleItem
          key="3"
          onTogglePause={[Function]}
          rule={
            Object {
              "dashboardId": 7,
              "dashboardSlug": "alerting-with-testdata",
              "dashboardUid": "ggHbN42mk",
              "evalData": Object {},
              "evalDate": "0001-01-01T00:00:00Z",
              "executionError": "error",
              "id": 3,
              "name": "TestData - ok",
              "newStateDate": "2018-09-04T10:01:01+02:00",
              "panelId": 3,
              "state": "ok",
              "url": "/d/ggHbN42mk/alerting-with-testdata",
            }
          }
          search=""
        />
      </ol>
    </section>
  </PageContents>
</Page>
`;

exports[`Render should render component 1`] = `
<Page
  navModel={Object {}}
>
  <PageContents
    isLoading={false}
  >
    <div
      className="page-action-bar"
    >
      <div
        className="gf-form gf-form--grow"
      >
        <Component
          inputClassName="gf-form-input"
          labelClassName="gf-form--has-input-icon gf-form--grow"
          onChange={[Function]}
          placeholder="Search alerts"
          value=""
        />
      </div>
      <div
        className="gf-form"
      >
        <label
          className="gf-form-label"
        >
          States
        </label>
        <div
          className="width-13"
        >
          <Select
            onChange={[Function]}
            options={
              Array [
                Object {
                  "label": "All",
                  "value": "all",
                },
                Object {
                  "label": "OK",
                  "value": "ok",
                },
                Object {
                  "label": "Not OK",
                  "value": "not_ok",
                },
                Object {
                  "label": "Alerting",
                  "value": "alerting",
                },
                Object {
                  "label": "No Data",
                  "value": "no_data",
                },
                Object {
                  "label": "Paused",
                  "value": "paused",
                },
                Object {
                  "label": "Pending",
                  "value": "pending",
                },
              ]
            }
            value="all"
          />
        </div>
      </div>
      <div
        className="page-action-bar__spacer"
      />
      <Button
        onClick={[Function]}
        variant="secondary"
      >
        How to add an alert
      </Button>
    </div>
    <section>
      <ol
        className="alert-rule-list"
      />
    </section>
  </PageContents>
</Page>
`;
