fix(live-previews): fix replacement of the scoped default imports

aliemir commented 4 months ago

PR Checklist

Please check if your PR fulfills the following requirements:

[x] The commit message follows our guidelines: https://refine.dev/docs/guides-concepts/contributing/#commit-convention

Bugs / Features

[x] Related issue(s) linked
[x] Tests for the changes have been added
[x] Docs have been added / updated
[x] Changesets have been added https://refine.dev/docs/guides-concepts/contributing/#creating-a-changeset

Changes

In the live preview code we're replacing imports with provided scopes of packages.

Example:

import { Button } from "@mui/material";

will be replaced with:

const { Button } = MuiMaterial;

In some cases, imports may be made with subpaths/scopess of a package;

Example:

import Button from "@mui/material/Button";

In this case we've been replacing it with the same structure:

const { Button } = MuiMaterial;

This replacement was using the default import name (in this case Button) but it was flawed because the default import name don't have to match the actual export name.

Example:

import Button$1 from "@mui/material/Button";

In this case, a broken replacement is made:

const { Button$1 } = MuiMaterial;

This caused Button$1 to be undefined and break the preview.

In this PR, we've made a small change in this logic to use scope name and have a name change in the destructuring process.

Example:

import Button$1 from "@mui/material/Button";
import { default as Button$2 } from "@mui/material/Button";
import { Button } from "@mui/material";

will be replaced with

const {
  Button: Button$1,
  Button: Button$2,
  Button
} = MuiMaterial;

changeset-bot[bot] commented 4 months ago

⚠️ No Changeset found

Latest commit: 7beb11de0f98aed5e5779e624ab459e494522cf2

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

netlify[bot] commented 4 months ago

Deploy Preview for refine-video-club ready!

Name	Link
Latest commit	7beb11de0f98aed5e5779e624ab459e494522cf2
Latest deploy log	https://app.netlify.com/sites/refine-video-club/deploys/664b0482af92290008dfb6df
Deploy Preview	https://deploy-preview-5967--refine-video-club.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 4 months ago

Deploy Preview for finefoods-example-refine-dev ready!

Name	Link
Latest commit	7beb11de0f98aed5e5779e624ab459e494522cf2
Latest deploy log	https://app.netlify.com/sites/finefoods-example-refine-dev/deploys/664b0482acb88c000835616c
Deploy Preview	https://deploy-preview-5967--finefoods-example-refine-dev.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

refinedev / refine