Stripe Products Integration

[app-generator]

SPECS:

• The products associated with a Stripe account are saved in JSON format using Python Stripe library
  • Location of the OUTPUT file: products/templates/products/products.json
• The superuser is able to access a new page with options:
  • Get products from Stripe
  • Visualize the downloaded JSON
  • create for each Stripe product a local product (JSON format)
  • the creation process is not automatic. The superuser selects the STRIPE product and creates a local one.
• Each local product once created from a Stripe product, becomes editable:
  • price
  • information
  • images can be uploaded or an external link used
  • card
  • main image
  • img_1, img_2, img_3

A sample JSON from Stripe: https://github.com/app-generator/python-stripe-wrapper/blob/main/products.json

The JSON that defines the local product should be updated as below:

{
    "id": "prod_L3QBiEdGWquAHl",
    "name": "Nike Dynamo Go FlyEase",
    "price": 49,
    "currency": "usd",
    "info": "Baby/Toddler Easy On/Off Shoes",
    "short_description": "A workhorse built to help power you .....",
    "full_description": "Easy, snug and built for any-time play the...",
    "img_card" : "Base64:asdaksdjhakjdhaksdhakjds",
    "img_main" : "https://files.stripe.com/links/MDB8YWNjdF8xSGxXdEdHTExkMVgwN1ZV____PUBLIC_URL",
    "img_1": "Base64:asdaksdjhakjdhaksdhakjds",
    "img_2": "Base64:asdaksdjhakjdhaksdhakjds",
    "img_3": "Base64:asdaksdjhakjdhaksdhakjds",
}

Note: the images are not saved anymore on static folder

Product.JSON updates:

• id field is the Stripe product ID
• Images are now specified in the JSON using two formats:
  • external url
  • base64 representation

The Products creation page

the page is divided in two pannels

• LEFT panel dedicated to Stripe products

  • superuser can pull the JSON from stripe
  • visualize the JSON (read only)
  • visualize the products using a collapsible view
  • each product has the option to be created or edited (if already exists)

• RIGHT panel is dedicated to local products

• List all local products

• Create / Edit product (all JSON fields)

  • the stripe_id is readonly
  • images can be uploaded or external links provided

  Quality

• Only Vanilla JS is used

• No jQuery or other frameworks like React, Vue .. etc

[app-generator]

Hello @MySecondLanguage

The logic should take into account the cases:

UI/UX

Product Names should use the real Product name. In the current implementation, is quite hard to identify the left/right correspondence.

The read-only fields (all use cases):

• product name (always use the Stripe version)
• product ID

Creation

• the JSON must have a slugified name from the product name
  • Sample: Nike Goalkeeper Match -> nike-goalkeeper-match.json
• Also, on creation, when the user clicks on CREATE the new product is not created in all cases. the existing products should be checked and if the product is already pulled locally, that version is loaded.
  • the association is made based on the product_id that is unique

Edit

The images part is missing. The Superuser should be able to upload 5 images. Each one can be an external link or real image safe in base64 format in the product JSON. This part assures that in production no external storage for the uploaded images is necessary.

Let me know if something is not clear.

Ty!

[app-generator]

Validated. Closing! Ty @MySecondLanguage