Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] - Changing Image src from null fails to update #4518

Open
jprosevear opened this issue Jan 8, 2025 · 2 comments · May be fixed by #4523
Open

[BUG] - Changing Image src from null fails to update #4518

jprosevear opened this issue Jan 8, 2025 · 2 comments · May be fixed by #4523
Assignees
Labels
📦 Scope : Components Related to the components 🐛 Type: Bug Something isn't working

Comments

@jprosevear
Copy link

NextUI Version

2.6.11

Describe the bug

If src is null/empty/undefined to start, the image does not load when its updated, including when the isLoading state is managed.

There seems to be some handling for "pending":

if (!src) return "pending";

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

The code is roughly:

const App = () => {
  const [src, setSrc] = useState(null);

  useEffect(() => {
    setTimeout(() => {
      console.log('set src');
      setSrc('https://nextui.org/images/fruit-4.jpeg');
    }, 5000);
  }, []);

  return (
      <Image
        alt="NextUI Image with fallback"
        height={200}
        isLoading={!src}
        src={src}
      />
      {`${src}`}
};

Expected behavior

The image to load.

Screenshots or Videos

Screen.Recording.2025-01-08.at.8.56.59.AM.mov

Operating System Version

macOS

Browser

Chrome

Copy link

linear bot commented Jan 8, 2025

@wingkwong wingkwong self-assigned this Jan 8, 2025
@wingkwong wingkwong added 🐛 Type: Bug Something isn't working 📦 Scope : Components Related to the components labels Jan 8, 2025
@peterbrczan
Copy link

+1 I have experienced the same issue.

@wingkwong wingkwong linked a pull request Jan 9, 2025 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
📦 Scope : Components Related to the components 🐛 Type: Bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants