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

exports[`force user to update when too long since update was downloaded when application is started given checking for updates and it resolves, when update was downloaded renders 1`] = `
<body>
  <div>
    <div
      class="ClusterManager"
    >
      <div
        class="topBar"
      >
        <div
          class="items"
        >
          <i
            class="Icon material interactive focusable"
            data-testid="home-button"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="home"
            >
              home
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-back"
          >
            <span
              class="icon"
              data-icon-name="arrow_back"
            >
              arrow_back
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-forward"
          >
            <span
              class="icon"
              data-icon-name="arrow_forward"
            >
              arrow_forward
            </span>
          </i>
          <button
            class="updateButton"
            data-testid="update-button"
            data-warning-level="light"
            id="update-lens-button"
          >
            Update
            <i
              class="Icon icon material focusable"
            >
              <span
                class="icon"
                data-icon-name="arrow_drop_down"
              >
                arrow_drop_down
              </span>
            </i>
          </button>
        </div>
        <div
          class="items"
        />
      </div>
      <main>
        <div
          id="lens-views"
        />
        <div
          class="flex justify-center Welcome align-center"
          data-testid="welcome-page"
        >
          <div
            data-testid="welcome-banner-container"
            style="width: 320px;"
          >
            <i
              class="Icon logo svg focusable"
            >
              <span
                class="icon"
              />
            </i>
            <div
              class="flex justify-center"
            >
              <div
                data-testid="welcome-text-container"
                style="width: 320px;"
              >
                <h2>
                  Welcome to OpenLens!
                </h2>
                <p>
                  To get you started we have auto-detected your clusters in your
                   
                  kubeconfig file and added them to the catalog, your centralized
                   
                  view for managing all your cloud-native resources.
                  <br />
                  <br />
                  If you have any questions or feedback, please join our 
                  <a
                    class="link"
                    href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
                    rel="noreferrer"
                    target="_blank"
                  >
                    Lens Community slack channel
                  </a>
                  .
                </p>
                <ul
                  class="block"
                  data-testid="welcome-menu-container"
                  style="width: 320px;"
                >
                  <li
                    class="flex grid-12"
                  >
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="view_list"
                      >
                        view_list
                      </span>
                    </i>
                    <a
                      class="box col-10"
                    >
                      Browse Clusters in Catalog
                    </a>
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="navigate_next"
                      >
                        navigate_next
                      </span>
                    </i>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </main>
      <div
        class="HotbarMenu flex column"
      >
        <div
          class="HotbarItems flex column gaps"
        />
        <div
          class="HotbarSelector"
        >
          <i
            class="Icon Icon previous material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_left"
            >
              arrow_left
            </span>
          </i>
          <div
            class="HotbarIndex"
          >
            <div
              class="badge Badge small clickable"
              id="hotbarIndex"
            >
              0
            </div>
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_right"
            >
              arrow_right
            </span>
          </i>
        </div>
      </div>
      <div
        class="StatusBar"
      >
        <div
          class="leftSide"
          data-testid="status-bar-left"
        />
        <div
          class="rightSide"
          data-testid="status-bar-right"
        />
      </div>
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
  </div>
</body>
`;

exports[`force user to update when too long since update was downloaded when application is started given checking for updates and it resolves, when update was downloaded when enough time passes to consider that update must be installed renders 1`] = `
<body>
  <div>
    <div
      class="ClusterManager"
    >
      <div
        class="topBar"
      >
        <div
          class="items"
        >
          <i
            class="Icon material interactive focusable"
            data-testid="home-button"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="home"
            >
              home
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-back"
          >
            <span
              class="icon"
              data-icon-name="arrow_back"
            >
              arrow_back
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-forward"
          >
            <span
              class="icon"
              data-icon-name="arrow_forward"
            >
              arrow_forward
            </span>
          </i>
          <button
            class="updateButton"
            data-testid="update-button"
            data-warning-level="light"
            id="update-lens-button"
          >
            Update
            <i
              class="Icon icon material focusable"
            >
              <span
                class="icon"
                data-icon-name="arrow_drop_down"
              >
                arrow_drop_down
              </span>
            </i>
          </button>
        </div>
        <div
          class="items"
        />
      </div>
      <main>
        <div
          id="lens-views"
        />
        <div
          class="flex justify-center Welcome align-center"
          data-testid="welcome-page"
        >
          <div
            data-testid="welcome-banner-container"
            style="width: 320px;"
          >
            <i
              class="Icon logo svg focusable"
            >
              <span
                class="icon"
              />
            </i>
            <div
              class="flex justify-center"
            >
              <div
                data-testid="welcome-text-container"
                style="width: 320px;"
              >
                <h2>
                  Welcome to OpenLens!
                </h2>
                <p>
                  To get you started we have auto-detected your clusters in your
                   
                  kubeconfig file and added them to the catalog, your centralized
                   
                  view for managing all your cloud-native resources.
                  <br />
                  <br />
                  If you have any questions or feedback, please join our 
                  <a
                    class="link"
                    href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
                    rel="noreferrer"
                    target="_blank"
                  >
                    Lens Community slack channel
                  </a>
                  .
                </p>
                <ul
                  class="block"
                  data-testid="welcome-menu-container"
                  style="width: 320px;"
                >
                  <li
                    class="flex grid-12"
                  >
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="view_list"
                      >
                        view_list
                      </span>
                    </i>
                    <a
                      class="box col-10"
                    >
                      Browse Clusters in Catalog
                    </a>
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="navigate_next"
                      >
                        navigate_next
                      </span>
                    </i>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </main>
      <div
        class="HotbarMenu flex column"
      >
        <div
          class="HotbarItems flex column gaps"
        />
        <div
          class="HotbarSelector"
        >
          <i
            class="Icon Icon previous material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_left"
            >
              arrow_left
            </span>
          </i>
          <div
            class="HotbarIndex"
          >
            <div
              class="badge Badge small clickable"
              id="hotbarIndex"
            >
              0
            </div>
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_right"
            >
              arrow_right
            </span>
          </i>
        </div>
      </div>
      <div
        class="StatusBar"
      >
        <div
          class="leftSide"
          data-testid="status-bar-left"
        />
        <div
          class="rightSide"
          data-testid="status-bar-right"
        />
      </div>
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
  </div>
  <div
    class="Animate opacity-scale Dialog flex center modal pinned enter"
    style="--enter-duration: 100ms; --leave-duration: 100ms;"
  >
    <div
      class="box"
    >
      <div
        class="ForceUpdateModal"
        data-testid="must-update-immediately"
      >
        <div
          class="header"
        >
          <h2>
            Please update
          </h2>
        </div>
        <div
          class="content"
        >
          <p>
            An update to Lens Desktop is required to continue using the application.
          </p>
        </div>
        <div
          class="footer"
        >
          <button
            class="Button primary"
            data-testid="update-now-from-must-update-immediately-modal"
            type="button"
          >
            Update
             
            (
            <span
              data-testid="countdown-to-automatic-update"
            >
              5
            </span>
            )
          </button>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`force user to update when too long since update was downloaded when application is started given checking for updates and it resolves, when update was downloaded when not enough time passes to consider that update must be installed renders 1`] = `
<body>
  <div>
    <div
      class="ClusterManager"
    >
      <div
        class="topBar"
      >
        <div
          class="items"
        >
          <i
            class="Icon material interactive focusable"
            data-testid="home-button"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="home"
            >
              home
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-back"
          >
            <span
              class="icon"
              data-icon-name="arrow_back"
            >
              arrow_back
            </span>
          </i>
          <i
            class="Icon material interactive disabled focusable"
            data-testid="history-forward"
          >
            <span
              class="icon"
              data-icon-name="arrow_forward"
            >
              arrow_forward
            </span>
          </i>
          <button
            class="updateButton"
            data-testid="update-button"
            data-warning-level="light"
            id="update-lens-button"
          >
            Update
            <i
              class="Icon icon material focusable"
            >
              <span
                class="icon"
                data-icon-name="arrow_drop_down"
              >
                arrow_drop_down
              </span>
            </i>
          </button>
        </div>
        <div
          class="items"
        />
      </div>
      <main>
        <div
          id="lens-views"
        />
        <div
          class="flex justify-center Welcome align-center"
          data-testid="welcome-page"
        >
          <div
            data-testid="welcome-banner-container"
            style="width: 320px;"
          >
            <i
              class="Icon logo svg focusable"
            >
              <span
                class="icon"
              />
            </i>
            <div
              class="flex justify-center"
            >
              <div
                data-testid="welcome-text-container"
                style="width: 320px;"
              >
                <h2>
                  Welcome to OpenLens!
                </h2>
                <p>
                  To get you started we have auto-detected your clusters in your
                   
                  kubeconfig file and added them to the catalog, your centralized
                   
                  view for managing all your cloud-native resources.
                  <br />
                  <br />
                  If you have any questions or feedback, please join our 
                  <a
                    class="link"
                    href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
                    rel="noreferrer"
                    target="_blank"
                  >
                    Lens Community slack channel
                  </a>
                  .
                </p>
                <ul
                  class="block"
                  data-testid="welcome-menu-container"
                  style="width: 320px;"
                >
                  <li
                    class="flex grid-12"
                  >
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="view_list"
                      >
                        view_list
                      </span>
                    </i>
                    <a
                      class="box col-10"
                    >
                      Browse Clusters in Catalog
                    </a>
                    <i
                      class="Icon box col-1 material focusable"
                    >
                      <span
                        class="icon"
                        data-icon-name="navigate_next"
                      >
                        navigate_next
                      </span>
                    </i>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </main>
      <div
        class="HotbarMenu flex column"
      >
        <div
          class="HotbarItems flex column gaps"
        />
        <div
          class="HotbarSelector"
        >
          <i
            class="Icon Icon previous material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_left"
            >
              arrow_left
            </span>
          </i>
          <div
            class="HotbarIndex"
          >
            <div
              class="badge Badge small clickable"
              id="hotbarIndex"
            >
              0
            </div>
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="arrow_right"
            >
              arrow_right
            </span>
          </i>
        </div>
      </div>
      <div
        class="StatusBar"
      >
        <div
          class="leftSide"
          data-testid="status-bar-left"
        />
        <div
          class="rightSide"
          data-testid="status-bar-right"
        />
      </div>
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
  </div>
</body>
`;
