<!DOCTYPE html>
<html>
  <head>
  <title><%= content_for(:title) || "Pragprog Books Online Store" %></title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <%= yield :head %>

    <%# Enable PWA manifest for installable apps (make sure to enable in
        config/routes.rb too!) %>
    <%#= tag.link rel: "manifest", href: pwa_manifest_path(format: :json) %>

    <link rel="icon" href="/icon.png" type="image/png">
    <link rel="icon" href="/icon.svg" type="image/svg+xml">
    <link rel="apple-touch-icon" href="/icon.png">

    <%# Includes all stylesheet files in app/assets/stylesheets %>
    <%= stylesheet_link_tag :app, "data-turbo-track": "reload" %>
    <%= javascript_importmap_tags %>
  </head>

  <body>
    <header class="bg-green-700">
      <%= image_tag 'logo.svg', alt: 'The Pragmatic Bookshelf' %>
      <h1><%= @page_title %></h1>
    </header>

    <section class="flex">
      <nav class="bg-green-900 p-6">
        <%= render partial: 'layouts/cart', locals: {cart: @cart } %>


        <ul class="text-gray-300 leading-8">
          <li><a href="/"><%= t('.home') %></a></li>
          <li><a href="/questions"><%= t('.questions') %></a></li>
          <li><a href="/news"><%= t('.news') %></a></li>
          <li><a href="/contact"><%= t('.contact') %></a></li>
        </ul>

        <hr class="my-2">
  
        <ul class="text-gray-300 leading-8">
        <% if authenticated? %>
          <li><%= link_to 'Orders',   orders_path   %></li>
          <li><%= link_to 'Products', products_path %></li>
          <li><%= link_to 'Users',    users_path    %></li>
          <li><%= button_to 'Logout', session_path, method: :delete %></li>
        <% else %>
          <li><%= link_to 'Login', new_session_path %></li>
        <% end %>
        </ul>
      </nav>

      <main class="container mx-auto mt-4 px-5 flex">
        <%= yield %>
      </main>
    </section>
  </body>
</html>
