<q-expansion-item
  group="extras"
  icon="swap_vertical_circle"
  label="Setup guide"
  :content-inset-level="0.5"
>
  <q-card>
    <q-card-section>
      <h5 class="text-subtitle1 q-my-none">
        Diagon Alley: Decentralised Market-Stalls
      </h5>
      <p>Each Stall has its own keys!<br /></p>

      <ol>
        <li>Create Shipping Zones you're willing to ship to</li>
        <li>Create a Stall to list yiur products on</li>
        <li>Create products to put on the Stall</li>
        <li>
          List stalls on a simple frontend shop page, or point at Nostr shop
          client key
        </li>
      </ol>
      Make a list of products to sell, point your list of products at a public
      relay. Buyers browse your products on the relay, and pay you directly.
      Ratings are managed by the relay. Your stall can be listed in multiple
      relays, even over TOR, if you wish to be anonymous.<br />
      More information on the
      <a href="https://github.com/lnbits/Diagon-Alley">Diagon Alley Protocol</a
      ><br />
      <small>
        Created by, <a href="https://github.com/benarc">Ben Arc</a></small
      >
      <!-- </p> -->
    </q-card-section>
  </q-card>
</q-expansion-item>

<q-expansion-item
  group="extras"
  icon="swap_vertical_circle"
  label="API info"
  :content-inset-level="0.5"
>
  <q-expansion-item
    group="api"
    dense
    expand-separator
    label="Get prodcuts, categorised by wallet"
  >
    <q-card>
      <q-card-section>
        <code
          ><span class="text-light-blue">GET</span>
          /diagonalley/api/v1/stall/products/&lt;relay_id&gt;</code
        >
        <h5 class="text-caption q-mt-sm q-mb-none">Body (application/json)</h5>
        <h5 class="text-caption q-mt-sm q-mb-none">
          Returns 201 CREATED (application/json)
        </h5>
        <code>Product JSON list</code>
        <h5 class="text-caption q-mt-sm q-mb-none">Curl example</h5>
        <code
          >curl -X GET {{ request.url_root
          }}api/v1/stall/products/&lt;relay_id&gt;</code
        >
      </q-card-section>
    </q-card>
  </q-expansion-item>
  <q-expansion-item
    group="api"
    dense
    expand-separator
    label="Get invoice for product"
  >
    <q-card>
      <q-card-section>
        <code
          ><span class="text-light-green">POST</span>
          /diagonalley/api/v1/stall/order/&lt;relay_id&gt;</code
        >
        <h5 class="text-caption q-mt-sm q-mb-none">Body (application/json)</h5>
        <code
          >{"id": &lt;string&gt;, "address": &lt;string&gt;, "shippingzone":
          &lt;integer&gt;, "email": &lt;string&gt;, "quantity":
          &lt;integer&gt;}</code
        >
        <h5 class="text-caption q-mt-sm q-mb-none">
          Returns 201 CREATED (application/json)
        </h5>
        <code
          >{"checking_id": &lt;string&gt;,"payment_request":
          &lt;string&gt;}</code
        >
        <h5 class="text-caption q-mt-sm q-mb-none">Curl example</h5>
        <code
          >curl -X POST {{ request.url_root
          }}api/v1/stall/order/&lt;relay_id&gt; -d '{"id": &lt;product_id&&gt;,
          "email": &lt;customer_email&gt;, "address": &lt;customer_address&gt;,
          "quantity": 2, "shippingzone": 1}' -H "Content-type: application/json"
        </code>
      </q-card-section>
    </q-card>
  </q-expansion-item>
  <q-expansion-item
    group="api"
    dense
    expand-separator
    label="Check a product has been shipped"
    class="q-mb-md"
  >
    <q-card>
      <q-card-section>
        <code
          ><span class="text-light-blue">GET</span>
          /diagonalley/api/v1/stall/checkshipped/&lt;checking_id&gt;</code
        >
        <h5 class="text-caption q-mt-sm q-mb-none">Headers</h5>
        <h5 class="text-caption q-mt-sm q-mb-none">
          Returns 200 OK (application/json)
        </h5>
        <code>{"shipped": &lt;boolean&gt;}</code>
        <h5 class="text-caption q-mt-sm q-mb-none">Curl example</h5>
        <code
          >curl -X GET {{ request.url_root
          }}api/v1/stall/checkshipped/&lt;checking_id&gt; -H "Content-type:
          application/json"</code
        >
      </q-card-section>
    </q-card>
  </q-expansion-item>
</q-expansion-item>
