[WIP] feature(repo): accept multi-store configuration

[liqueflies]

Hello!

after some work I am going to submit you this first review for sane-shopify multistore!

As you said in #147, the most important thing where keep the store with already synched stores and migrate. Also sync storeName indie document.

I came up with this solution in that way:

• secrets was already a document, so I ended up removing the unique key generating a new one for each store.
• The idea for the achievement was keeping the Provider component the same, targeting only 1 store; Inside the ShopifyTool component I fetch each key on the secrets table and put inside the provider the storeName that will populate the Provider.
• I fixed also the problem (that I noticed but I thought was removed feature) of Progress component.
• I added a Badge component in order to show into the document the store where product / collection is coming from
• I added store name as a description (until is archived)
• I check when import document before archiving them, if are coming from the same store: with this check we are avoiding to delete document that are not present in the store when we are syncing
• I made a fresh design both for the TabTool and then the ComponentInput inside the document
• Everything is made using @sanity/ui

What's missing?

basically webhook. I am going to ask your check for the rest and help me with that.

I leave here some screenshot but of course I suggest you to download my branch linking into a project of yours :)

Hope this can be a good news to you 🎉

[liqueflies]

UPDATE: I saw you made a fix in syncState that I also made but your way was better, so I rebased with your main

[liqueflies]

UPDATE 2: checking now for webhook you are going to setup your implementation of webhook so you are providing already the correct secrets for shopify

[good-idea]

I think it would also be good to add a disclaimer about adding multiple storefronts - and provide a link to a section of the docs here about caveats when working with multiple storefronts. Essentially, that they will need to handle their own logic for multiple carts.

I'm imagining a scenario where I want to create a "popup" site, selling products made by my friends - where all products are displayed on the website. Just thinking out loud here..

[liqueflies]

I think it would also be good to add a disclaimer about adding multiple storefronts - and provide a link to a section of the docs here about caveats when working with multiple storefronts. Essentially, that they will need to handle their own logic for multiple carts.

I'm imagining a scenario where I want to create a "popup" site, selling products made by my friends - where all products are displayed on the website. Just thinking out loud here..

In my particular case I was able to handle multiple listing based on location (https://www.shopify.com/plus/solutions/international-ecommerce)

So what've done is having all countries in a singular sanity instance. I've made a document called region (US, EU, ROW) for example.

Example:

on document fields add:

  {
    type: 'reference',
    name: 'region',
    title: 'Display in',
    // hidden: true,
    to: [{ type: 'region' }]
  }

Than in desk structure I filter document from references on that region (https://www.sanity.io/docs/dynamically-group-list-items-with-a-groq-filter)

Talking about storefront I have to came up with different websites for each region: eu.mystore.com us.mystore.com row.mystore.com

I came up using the same codebase for each website with an ENV variable region (EU, US, ROW) and I make queries using the reference on documents and shopify storefront and token specific for each website.

So each website has it's storefront shopify keys and different cart, the code from frontend is the same!

[liqueflies]

Can I do something different for this?

[good-idea]

Added a couple things and published this in another branch because I didn't know I could push to forked repo branches!

Thank you for all of your work on this!