<div class="page-wrapper" id="desktopReviewPage">
  <div class="desktop-review container">
    <div class="viewRow">
      <button class="btn btn-outline-success btn-sm btnViewMode" id="btnSimpleView">
        <%= __('review.simple_view') %>
      </button>
      <button class="btn btn-outline-success btn-sm btnViewMode" id="btnStatusView">
        <%= __('review.status_view') %>
      </button>
      <button class="btn btn-outline-success btn-sm btnViewMode" id="btnBalanceView">
        <%= __('review.balance_view') %>
      </button>
      <button class="btn btn-outline-success btn-sm btnViewMode visually-hidden" id="btnFullView">
        <%= __('review.full_view') %>
      </button>
      <button class="btn btn-outline-success btn-sm float-end btnViewMode" id="btnToggleFont">
        <%= __('review.toggle_font') %>
      </button>
      &nbsp;<input class="search blockchain-fuzzy-search" type="search" data-column="1"
        placeholder='(blockchain; fuzzy search... try "flax")'>
    </div>

    <div class="container badge bg-success visually-hidden" id="totalBalanceRow">
      <span>
        <%= __('balance.total_dollar_all_coins') %>
      </span>
      <span>
        $<%= allCoinsDollars %>
      </span>
    </div>

    <table id="reviewTable" class="table table-hover tablesorter">
      <thead>
        <tr>
          <th class="se_no">
            #
          </th>
          <th class="blockchain">
            <%= __('general.blockchain') %>
          </th>
          <th class="chain_status">
            <%= __('review.chain_status') %>
          </th>
          <th class="chain_sync_to_time">
            <%= __('review.sync_at') %>
          </th>
          <th class="chain_height">
            <%= __('review.chain_height') %>
          </th>
          <th class="expected_time_to_win">
            <%= __('review.expected_time_to_win') %>
          </th>
          <th class="noBlockInDays">
            <%= __('review.noBlockInDays') %>
          </th>
          <th class="blockCountToday">
            <%= __('review.blockCountToday') %>
          </th>
          <th class="plot_count">
            <%= __('review.plot_count') %>
          </th>
          <th class="plots_size">
            <%= __('review.plots_size') %>
          </th>
          <th class="netspace_size">
            <%= __('review.netspace_size') %>
          </th>
          <th class="connection_count">
            <%= __('review.connect_count') %>
          </th>
          <th class="wallet_status">
            <%= __('review.wallet_status') %>
          </th>
          <th class="wallet_height">
            <%= __('review.wallet_heigt') %>
          </th>
          <th class="coin_symbol">
            <%= __('review.token_name') %>
          </th>
          <th class="coin_price">
            <%= __('review.token_price') %>
          </th>
          <th class="total_coins">
            <%= __('review.mined_count') %>
          </th>
          <th class="wallet_balance">
            <%= __('review.wallet_balance') %>
          </th>
          <th class="reward_balance">
            <%= __('review.reward_balance') %>
          </th>
          <th class="total_price">
            <%= __('review.total_usd_value') %>
          </th>
          <th class="protocol_port">
            <%= __('review.protocol_port') %>
          </th>
          <th class="fork_version">
            <%= __('general.versions') %>
          </th>
        </tr>
      </thead>
      <tbody>
        <% data.forEach(function(dt, dtIndex){ %>
          <tr class="table-<%= dt.ext_str_2 %>">
            <td class="se_no">
              <%= dtIndex + 1 %>
            </td>
            <td class="blockchain">
              <a target="_blank"
                href="https://alltheblocks.net/<%= dt.blockchain === 'staicoin' ? 'stai': dt.blockchain %>">
                <img src="images/logos/<%= dt.blockchain %>-min.png" alt="<%= dt.blockchain %>" width="20" height="20">
              </a>
              <b>
                <%= dt.blockchain %>
              </b>
            </td>
            <td class="chain_status text-<%= dt.ext_str_2 %>">
              <%= dt.status %>
            </td>
            <td class="chain_sync_to_time <%= dt.invalid_chain_status ? 'text-danger' : '' %>"
              data-sync="<%= dt.chain_sync_to_time %>">
              <%= dt.chain_sync_to_time && dt.chain_sync_to_time.toLocaleString("en-US", {hour12: false}) %>
            </td>
            <td class="chain_height">
              <%= dt.chain_height %>
            </td>
            <td class="expected_time_to_win" data-bs-html=true data-bs-toggle="tooltip" data-bs-placement="top"
              title="<div style='background: green;'><%= dt.expected_time_to_win %></div>">
              <%= dt.expected_hours_to_win %>
            </td>
            <td class="noBlockInDays <%= dt.isValidETW ? '' : 'text-danger' %>" data-bs-html=true
              data-bs-toggle="tooltip" data-bs-placement="top"
              title="<div style='background: green;'><%= dt.ext_num_2 %> days</div>">
              <%= parseFloat((dt.ext_num_2 * 24).toFixed(1)) %>
            </td>
            <td class="blockCountToday">
              <%= dt.ext_num_3 %>
            </td>
            <td class="plot_count">
              <%= dt.plot_count %>
            </td>
            <td class="plots_size">
              <%= dt.plots_size %>
            </td>
            <td class="netspace_size">
              <%= dt.netspace_size %>
            </td>
            <td class="connection_count <%= dt.invalid_connection_status ? 'text-danger' : '' %>">
              <%= dt.connection_count %>
            </td>
            <td class="wallet_status <%= dt.invalid_wallet_status ? 'text-danger' : '' %>">
              <%= dt.wallet_status %>
            </td>
            <td class="wallet_height">
              <%= dt.wallet_height %>
            </td>
            <td class="coin_symbol">
              <b>
                <%= dt.symbol %>
              </b>
            </td>
            <td class="coin_price">
              <b>
                <%= dt.coin_price %>
              </b>
            </td>
            <td class="total_coins">
              <%= dt.total_coins %>
            </td>
            <td class="wallet_balance">
              <%= dt.wallet_balance %>
            </td>
            <td class="reward_balance">
              <%= dt.reward_balance %>
            </td>
            <td class="total_price">
              <%= dt.total_price %>
            </td>
            <td class="protocol_port">
              <%= dt.ext_num_1 %>
            </td>
            <td class="fork_version">
              <%= dt.ext_str_1 %>
            </td>
          </tr>
          <% }); %>
      </tbody>
    </table>
  </div>
</div>