Shopify / blockchain-components

Blockchain related React UI components for Shopify storefronts
https://blockchain.shopify.dev
MIT License
81 stars 18 forks source link

Chore/address dependency cycles #184

Closed QuintonC closed 1 year ago

QuintonC commented 1 year ago

ℹ️ What is the context for these changes?

This pull request solves a couple of problems, the first being more of an "unknown" problem but one that has been frustrating to work around for some time now.

That is, if you were to delete yarn.lock and your node_modules to do a clean install of node_modules, you would run into a large number of circular dependency ESLint violations. This addresses those violations by also adding support for absolute path resolution across many of the packages.

The only two packages that had circular dependency violations were connect-wallet and tokengate, which are now resolved.

Adds support for absolute path resolution in the following packages:

This does not add absolute path resolution to the shared package. The reason for this is that the package does not get bundled, as a result this creates issues for packages that utilize components or hooks from the package. For example, if useMediaQuery is used on a component inside of Button, the path will not resolve to the right place due to the path resolution methods used for the shared package.

Much of this work was cherry-picked from #176, but split into different commits so you can see the changes by package.

🎩 How can this be tophatted?

  1. Pull this branch
  2. Remove all node_modules directories as well as the yarn.lock file.
  3. Run yarn to install all packages.
  4. Run yarn dev
  5. Open the link in your browser to check the functionality of the package. Nothing should have changed, and any errors should have been presented via the CLI / during the build or dev process.

You can also run the package inside any of the example directories by running yarn example and selecting a framework / example to use.

✅ Checklist