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

exports[`ConfirmApproveContent Component should render Confirm approve page correctly and display fallback copy for when we are able to retrieve a erc721 or erc1155 name in the setApprovalForAll screen and when giving a setApprovalForAll allowance 1`] = `
<div>
  <div
    class="confirm-approve-content"
  >
    <div
      class="box confirm-approve-content__icon-display-content box--display-flex box--flex-direction-row"
    >
      <div
        class="box box--display-flex box--flex-direction-row box--align-items-center"
      >
        <div
          class=""
        >
          <img
            alt="https://metamask.github.io/test-dapp/"
            class="url-icon confirm-approve-content__siteimage-identicon"
            src="https://metamask.github.io/test-dapp/metamask-fox.svg"
          />
        </div>
        <h6
          class="box mm-text mm-text--body-sm mm-text--color-text-alternative box--margin-left-1 box--flex-direction-row"
        >
          https://metamask.github.io/test-dapp/
        </h6>
      </div>
    </div>
    <div
      class="confirm-approve-content__title"
      data-testid="confirm-approve-title"
    >
      <span>
         
        Allow access to and transfer of all your 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          ZenAcademy
        </span>
        
        ?
         
      </span>
    </div>
    <div
      class="confirm-approve-content__description"
    >
      This allows a third party to access and transfer the following NFTs without further notice until you revoke its access.
    </div>
    <div
      class="box box--margin-top-2 box--margin-bottom-4 box--flex-direction-row"
    >
      <a
        class="button btn-link confirm-approve-content__verify-contract-details"
        role="button"
        tabindex="0"
      >
        Verify contract details
      </a>
    </div>
    <div
      class="confirm-approve-content__card-wrapper"
    >
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-header"
        >
          <div
            class="confirm-approve-content__card-header__symbol"
          >
            <span
              class="box mm-icon mm-icon--size-md box--display-inline-block box--flex-direction-row box--color-inherit"
              style="mask-image: url('./images/icons/tag.svg');"
            />
          </div>
          <div
            class="confirm-approve-content__card-header__title"
          >
            Transaction fee
          </div>
          <div
            class="box box--flex-direction-row box--width-1/6"
          >
            <a
              class="button btn-link confirm-approve-content__small-blue-text"
              role="button"
              tabindex="0"
            >
              Edit
            </a>
          </div>
        </div>
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__transaction-details-content"
          >
            <div
              class="confirm-approve-content__small-text"
            >
              A fee is associated with this request.
            </div>
            <div
              class="confirm-approve-content__transaction-details-content__fee"
            >
              <div
                class="confirm-approve-content__transaction-details-content__primary-fee"
              >
                $10.00
              </div>
              <div
                class="confirm-approve-content__transaction-details-content__secondary-fee"
              >
                20 ETH
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__custom-nonce-content"
          >
            <div
              class="box confirm-approve-content__custom-nonce-header box--flex-direction-row box--justify-content-flex-start box--display-flex"
            >
              <h6
                class="box mm-text mm-text--body-sm mm-text--color-text-default box--flex-direction-row"
              >
                Nonce
              </h6>
              <a
                class="button btn-link confirm-approve-content__custom-nonce-edit"
                role="button"
                tabindex="0"
              >
                Edit
              </a>
            </div>
            <h6
              class="box mm-text confirm-approve-content__custom-nonce-value mm-text--body-sm-bold mm-text--color-text-default box--flex-direction-row"
            >
              2
            </h6>
          </div>
        </div>
        <div
          class="confirm-approve-content__view-full-tx-button-wrapper"
        >
          <div
            class="confirm-approve-content__view-full-tx-button cursor-pointer"
          >
            <div
              class="confirm-approve-content__small-blue-text"
            >
              View full transaction details
            </div>
            <i
              class="fa fa-caret-down"
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
`;

exports[`ConfirmApproveContent Component should render Confirm approve page correctly and display fallback copy for when we are able to retrieve a erc721 or erc1155 name in the setApprovalForAll screen and when revoking a setApprovalForAll allowance 1`] = `
<div>
  <div
    class="confirm-approve-content"
  >
    <div
      class="box confirm-approve-content__icon-display-content box--display-flex box--flex-direction-row"
    >
      <div
        class="box box--display-flex box--flex-direction-row box--align-items-center"
      >
        <div
          class=""
        >
          <img
            alt="https://metamask.github.io/test-dapp/"
            class="url-icon confirm-approve-content__siteimage-identicon"
            src="https://metamask.github.io/test-dapp/metamask-fox.svg"
          />
        </div>
        <h6
          class="box mm-text mm-text--body-sm mm-text--color-text-alternative box--margin-left-1 box--flex-direction-row"
        >
          https://metamask.github.io/test-dapp/
        </h6>
      </div>
    </div>
    <div
      class="confirm-approve-content__title"
      data-testid="confirm-approve-title"
    >
      <span>
         
        Revoke permission to access and transfer all of your 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          ZenAcademy
        </span>
        
        ?
         
      </span>
    </div>
    <div
      class="confirm-approve-content__description"
    >
      <span>
         
        This revokes the permission for a third party to access and transfer all of your 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          ZenAcademy
        </span>
        
         without further notice.
         
      </span>
    </div>
    <div
      class="box box--margin-top-2 box--margin-bottom-4 box--flex-direction-row"
    >
      <a
        class="button btn-link confirm-approve-content__verify-contract-details"
        role="button"
        tabindex="0"
      >
        Verify contract details
      </a>
    </div>
    <div
      class="confirm-approve-content__card-wrapper"
    >
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-header"
        >
          <div
            class="confirm-approve-content__card-header__symbol"
          >
            <span
              class="box mm-icon mm-icon--size-md box--display-inline-block box--flex-direction-row box--color-inherit"
              style="mask-image: url('./images/icons/tag.svg');"
            />
          </div>
          <div
            class="confirm-approve-content__card-header__title"
          >
            Transaction fee
          </div>
          <div
            class="box box--flex-direction-row box--width-1/6"
          >
            <a
              class="button btn-link confirm-approve-content__small-blue-text"
              role="button"
              tabindex="0"
            >
              Edit
            </a>
          </div>
        </div>
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__transaction-details-content"
          >
            <div
              class="confirm-approve-content__small-text"
            >
              A fee is associated with this request.
            </div>
            <div
              class="confirm-approve-content__transaction-details-content__fee"
            >
              <div
                class="confirm-approve-content__transaction-details-content__primary-fee"
              >
                $10.00
              </div>
              <div
                class="confirm-approve-content__transaction-details-content__secondary-fee"
              >
                20 ETH
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__custom-nonce-content"
          >
            <div
              class="box confirm-approve-content__custom-nonce-header box--flex-direction-row box--justify-content-flex-start box--display-flex"
            >
              <h6
                class="box mm-text mm-text--body-sm mm-text--color-text-default box--flex-direction-row"
              >
                Nonce
              </h6>
              <a
                class="button btn-link confirm-approve-content__custom-nonce-edit"
                role="button"
                tabindex="0"
              >
                Edit
              </a>
            </div>
            <h6
              class="box mm-text confirm-approve-content__custom-nonce-value mm-text--body-sm-bold mm-text--color-text-default box--flex-direction-row"
            >
              2
            </h6>
          </div>
        </div>
        <div
          class="confirm-approve-content__view-full-tx-button-wrapper"
        >
          <div
            class="confirm-approve-content__view-full-tx-button cursor-pointer"
          >
            <div
              class="confirm-approve-content__small-blue-text"
            >
              View full transaction details
            </div>
            <i
              class="fa fa-caret-down"
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
`;

exports[`ConfirmApproveContent Component should render Confirm approve page correctly and display fallback copy for when we are not able to retrieve a erc721 or erc1155 name in the setApprovalForAll screen and when giving a setApprovalForAll allowance 1`] = `
<div>
  <div
    class="confirm-approve-content"
  >
    <div
      class="box confirm-approve-content__icon-display-content box--display-flex box--flex-direction-row"
    >
      <div
        class="box box--display-flex box--flex-direction-row box--align-items-center"
      >
        <div
          class=""
        >
          <img
            alt="https://metamask.github.io/test-dapp/"
            class="url-icon confirm-approve-content__siteimage-identicon"
            src="https://metamask.github.io/test-dapp/metamask-fox.svg"
          />
        </div>
        <h6
          class="box mm-text mm-text--body-sm mm-text--color-text-alternative box--margin-left-1 box--flex-direction-row"
        >
          https://metamask.github.io/test-dapp/
        </h6>
      </div>
    </div>
    <div
      class="confirm-approve-content__title"
      data-testid="confirm-approve-title"
    >
      <span>
         
        Allow access to and transfer all of your NFTs from 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          this collection
        </span>
        
        ?
         
      </span>
    </div>
    <div
      class="confirm-approve-content__description"
    >
      <span>
         
        This allows a third party to access and transfer all of your NFTs from 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          this collection
        </span>
        
         without further notice until you revoke its access.
         
      </span>
    </div>
    <div
      class="box box--margin-top-2 box--margin-bottom-4 box--flex-direction-row"
    >
      <a
        class="button btn-link confirm-approve-content__verify-contract-details"
        role="button"
        tabindex="0"
      >
        Verify contract details
      </a>
    </div>
    <div
      class="confirm-approve-content__card-wrapper"
    >
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-header"
        >
          <div
            class="confirm-approve-content__card-header__symbol"
          >
            <span
              class="box mm-icon mm-icon--size-md box--display-inline-block box--flex-direction-row box--color-inherit"
              style="mask-image: url('./images/icons/tag.svg');"
            />
          </div>
          <div
            class="confirm-approve-content__card-header__title"
          >
            Transaction fee
          </div>
          <div
            class="box box--flex-direction-row box--width-1/6"
          >
            <a
              class="button btn-link confirm-approve-content__small-blue-text"
              role="button"
              tabindex="0"
            >
              Edit
            </a>
          </div>
        </div>
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__transaction-details-content"
          >
            <div
              class="confirm-approve-content__small-text"
            >
              A fee is associated with this request.
            </div>
            <div
              class="confirm-approve-content__transaction-details-content__fee"
            >
              <div
                class="confirm-approve-content__transaction-details-content__primary-fee"
              >
                $10.00
              </div>
              <div
                class="confirm-approve-content__transaction-details-content__secondary-fee"
              >
                20 ETH
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__custom-nonce-content"
          >
            <div
              class="box confirm-approve-content__custom-nonce-header box--flex-direction-row box--justify-content-flex-start box--display-flex"
            >
              <h6
                class="box mm-text mm-text--body-sm mm-text--color-text-default box--flex-direction-row"
              >
                Nonce
              </h6>
              <a
                class="button btn-link confirm-approve-content__custom-nonce-edit"
                role="button"
                tabindex="0"
              >
                Edit
              </a>
            </div>
            <h6
              class="box mm-text confirm-approve-content__custom-nonce-value mm-text--body-sm-bold mm-text--color-text-default box--flex-direction-row"
            >
              2
            </h6>
          </div>
        </div>
        <div
          class="confirm-approve-content__view-full-tx-button-wrapper"
        >
          <div
            class="confirm-approve-content__view-full-tx-button cursor-pointer"
          >
            <div
              class="confirm-approve-content__small-blue-text"
            >
              View full transaction details
            </div>
            <i
              class="fa fa-caret-down"
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
`;

exports[`ConfirmApproveContent Component should render Confirm approve page correctly and display fallback copy for when we are not able to retrieve a erc721 or erc1155 name in the setApprovalForAll screen and when revoking a setApprovalForAll allowance 1`] = `
<div>
  <div
    class="confirm-approve-content"
  >
    <div
      class="box confirm-approve-content__icon-display-content box--display-flex box--flex-direction-row"
    >
      <div
        class="box box--display-flex box--flex-direction-row box--align-items-center"
      >
        <div
          class=""
        >
          <img
            alt="https://metamask.github.io/test-dapp/"
            class="url-icon confirm-approve-content__siteimage-identicon"
            src="https://metamask.github.io/test-dapp/metamask-fox.svg"
          />
        </div>
        <h6
          class="box mm-text mm-text--body-sm mm-text--color-text-alternative box--margin-left-1 box--flex-direction-row"
        >
          https://metamask.github.io/test-dapp/
        </h6>
      </div>
    </div>
    <div
      class="confirm-approve-content__title"
      data-testid="confirm-approve-title"
    >
      <span>
         
        Revoke permission to access and transfer all of your NFTs from 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          this collection
        </span>
        
        ?
         
      </span>
    </div>
    <div
      class="confirm-approve-content__description"
    >
      <span>
         
        This revokes the permission for a third party to access and transfer all of your NFTs from 
        <span
          class="confirm-approve-content__approval-asset-title"
        >
          this collection
        </span>
        
         without further notice.
         
      </span>
    </div>
    <div
      class="box box--margin-top-2 box--margin-bottom-4 box--flex-direction-row"
    >
      <a
        class="button btn-link confirm-approve-content__verify-contract-details"
        role="button"
        tabindex="0"
      >
        Verify contract details
      </a>
    </div>
    <div
      class="confirm-approve-content__card-wrapper"
    >
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-header"
        >
          <div
            class="confirm-approve-content__card-header__symbol"
          >
            <span
              class="box mm-icon mm-icon--size-md box--display-inline-block box--flex-direction-row box--color-inherit"
              style="mask-image: url('./images/icons/tag.svg');"
            />
          </div>
          <div
            class="confirm-approve-content__card-header__title"
          >
            Transaction fee
          </div>
          <div
            class="box box--flex-direction-row box--width-1/6"
          >
            <a
              class="button btn-link confirm-approve-content__small-blue-text"
              role="button"
              tabindex="0"
            >
              Edit
            </a>
          </div>
        </div>
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__transaction-details-content"
          >
            <div
              class="confirm-approve-content__small-text"
            >
              A fee is associated with this request.
            </div>
            <div
              class="confirm-approve-content__transaction-details-content__fee"
            >
              <div
                class="confirm-approve-content__transaction-details-content__primary-fee"
              >
                $10.00
              </div>
              <div
                class="confirm-approve-content__transaction-details-content__secondary-fee"
              >
                20 ETH
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="confirm-approve-content__card--no-border"
      >
        <div
          class="confirm-approve-content__card-content"
        >
          <div
            class="confirm-approve-content__custom-nonce-content"
          >
            <div
              class="box confirm-approve-content__custom-nonce-header box--flex-direction-row box--justify-content-flex-start box--display-flex"
            >
              <h6
                class="box mm-text mm-text--body-sm mm-text--color-text-default box--flex-direction-row"
              >
                Nonce
              </h6>
              <a
                class="button btn-link confirm-approve-content__custom-nonce-edit"
                role="button"
                tabindex="0"
              >
                Edit
              </a>
            </div>
            <h6
              class="box mm-text confirm-approve-content__custom-nonce-value mm-text--body-sm-bold mm-text--color-text-default box--flex-direction-row"
            >
              2
            </h6>
          </div>
        </div>
        <div
          class="confirm-approve-content__view-full-tx-button-wrapper"
        >
          <div
            class="confirm-approve-content__view-full-tx-button cursor-pointer"
          >
            <div
              class="confirm-approve-content__small-blue-text"
            >
              View full transaction details
            </div>
            <i
              class="fa fa-caret-down"
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
`;