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

exports[`RelatedPackages renders correctly 1`] = `<DocumentFragment />`;

exports[`RelatedPackages renders correctly 2`] = `
<DocumentFragment>
  <div
    class="my-4 w-100"
  >
    <div
      class="mt-2 mb-1"
      data-testid="smallTitle"
    >
      <small
        class="card-title text-muted text-uppercase"
      >
        <span>
          Related packages
        </span>
      </small>
    </div>
    <div
      class="mt-3"
    >
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/stable/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo centrifugo"
                      class="image"
                      src="/image/cc7ac35f-abd3-4594-a375-aebfccbfe11e"
                      srcset="/image/cc7ac35f-abd3-4594-a375-aebfccbfe11e@1x 1x, /image/cc7ac35f-abd3-4594-a375-aebfccbfe11e@2x 2x, /image/cc7ac35f-abd3-4594-a375-aebfccbfe11e@3x 3x, /image/cc7ac35f-abd3-4594-a375-aebfccbfe11e@4x 4x"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          centrifugo
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              stable
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/incubator/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo kafka"
                      class="image"
                      src="/static/media/package_placeholder.svg"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          kafka
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              incubator
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/dhiatn/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo kafka-topics-ui"
                      class="image"
                      src="/image/c4b74ab7-dfcd-440c-9ffb-7b9187ea13e2"
                      srcset="/image/c4b74ab7-dfcd-440c-9ffb-7b9187ea13e2@1x 1x, /image/c4b74ab7-dfcd-440c-9ffb-7b9187ea13e2@2x 2x, /image/c4b74ab7-dfcd-440c-9ffb-7b9187ea13e2@3x 3x, /image/c4b74ab7-dfcd-440c-9ffb-7b9187ea13e2@4x 4x"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          kafka-topics-ui
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              dhiatn
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/stable/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo nats"
                      class="image"
                      src="/image/9d48cd3f-d6f0-499e-b070-4dd30def1306"
                      srcset="/image/9d48cd3f-d6f0-499e-b070-4dd30def1306@1x 1x, /image/9d48cd3f-d6f0-499e-b070-4dd30def1306@2x 2x, /image/9d48cd3f-d6f0-499e-b070-4dd30def1306@3x 3x, /image/9d48cd3f-d6f0-499e-b070-4dd30def1306@4x 4x"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          nats
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              stable
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/stable/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo rabbitmq"
                      class="image"
                      src="/image/2af77252-fa22-4b56-97c2-2e0da1307601"
                      srcset="/image/2af77252-fa22-4b56-97c2-2e0da1307601@1x 1x, /image/2af77252-fa22-4b56-97c2-2e0da1307601@2x 2x, /image/2af77252-fa22-4b56-97c2-2e0da1307601@3x 3x, /image/2af77252-fa22-4b56-97c2-2e0da1307601@4x 4x"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          rabbitmq
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              stable
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
      <div>
        <div
          class="card mb-2 w-100 card"
        >
          <a
            class="text-decoration-none link"
            data-testid="relatedPackageLink"
            href="/packages/helm/incubator/undefined"
          >
            <div
              class="card-body d-flex flex-column body"
            >
              <div
                class="d-flex align-items-start justify-content-between flex-grow-1 mw-100"
              >
                <div
                  class="d-flex align-items-center flex-grow-1 truncateWrapper"
                >
                  <div
                    class="d-flex align-items-center justify-content-center overflow-hidden imageWrapper"
                  >
                    <img
                      alt="Logo schema-registry"
                      class="image"
                      src="/static/media/package_placeholder.svg"
                    />
                  </div>
                  <div
                    class="ml-2 h-100 flex-grow-1 truncateWrapper"
                  >
                    <div
                      class="h-100 d-flex flex-row justify-content-between"
                    >
                      <div
                        class="mr-2 text-truncate w-100"
                      >
                        <div
                          class="align-self-end text-truncate card-title mb-2 title"
                        >
                          schema-registry
                        </div>
                        <div
                          class="card-subtitle align-items-center text-muted subtitle"
                        >
                          <div
                            class="w-100"
                          >
                            <div
                              class="text-truncate"
                            >
                              user
                              <span
                                class="px-1"
                              >
                                /
                              </span>
                              incubator
                            </div>
                          </div>
                        </div>
                      </div>
                      <div
                        class="align-self-start d-flex align-items-center text-uppercase kind"
                      >
                        <img
                          alt="Icon"
                          class="icon"
                          src="/static/media/helm-chart.svg"
                        />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        </div>
      </div>
    </div>
  </div>
</DocumentFragment>
`;
