Error: Already found a plugin named 'react:Dashboard'

[GuysmoB]

Initial checklist

• I understand this is a bug report and questions should be posted in the Community Forum
• I searched issues and couldn’t find anything (or linked relevant results below)

Link to runnable example

No response

Steps to reproduce

I followed this piece of code from https://uppy.io/docs/react/
Thank you for any help ! :)

import Uppy from '@uppy/core';
import Webcam from '@uppy/webcam';
import { Dashboard } from '@uppy/react';

// Don't forget the CSS: core and the UI components + plugins you are using.
import '@uppy/core/dist/style.min.css';
import '@uppy/dashboard/dist/style.min.css';
import '@uppy/webcam/dist/style.min.css';

// Don’t forget to keep the Uppy instance outside of your component.
const uppy = new Uppy().use(Webcam);

function Component() {
    return <Dashboard uppy={uppy} plugins={['Webcam']} />;
}

'use client';
import Uppy from '@uppy/core';
import { Dashboard } from '@uppy/react';
import { FC, useEffect, useState } from 'react';
import Webcam from '@uppy/webcam';
import '@uppy/core/dist/style.min.css';
import '@uppy/dashboard/dist/style.min.css';
import '@uppy/webcam/dist/style.min.css';

const uppy = new Uppy().use(Webcam);

const NewRenderingModal: FC<INewRenderingModal> = ({  }) => {
	return <Dashboard uppy={uppy} plugins={['Webcam']} />;
};

export default NewRenderingModal;

```
"dependencies": {
	"@emotion/react": "^11.11.1",
	"@emotion/styled": "^11.11.0",
	"@googlemaps/js-api-loader": "^1.15.2",
	"@hello-pangea/dnd": "^16.3.0",
	"@hookform/resolvers": "^3.1.0",
	"@mui/icons-material": "^5.14.3",
	"@mui/material": "^5.14.3",
	"@mui/system": "^5.12.1",
	"@mui/x-date-pickers": "^6.11.2",
	"@react-email/render": "^0.0.7",
	"@react-pdf/renderer": "^3.1.12",
	"@stripe/react-stripe-js": "^2.1.1",
	"@stripe/stripe-js": "^1.54.1",
	"@supabase/auth-helpers-nextjs": "^0.7.4",
	"@supabase/supabase-js": "^2.31.0",
	"@tanstack/react-query": "^4.29.12",
	"@tanstack/react-query-devtools": "^4.29.12",
	"@types/autosuggest-highlight": "^3.2.0",
	"@types/jest": "^29.5.1",
	"@types/node": "18.15.11",
	"@types/react": "18.0.33",
	"@types/react-big-calendar": "^1.6.4",
	"@types/react-dom": "18.0.11",
	"@uppy/core": "^3.5.0",
	"@uppy/drag-drop": "^3.0.3",
	"@uppy/file-input": "^3.0.3",
	"@uppy/progress-bar": "^3.0.3",
	"@uppy/react": "^3.1.3",
	"@uppy/tus": "^3.2.0",
	"@uppy/webcam": "^3.3.2",
	"@vercel/analytics": "^1.0.1",
	"autosuggest-highlight": "^3.3.4",
	"axios": "^1.3.5",
	"dotenv-cli": "^7.2.1",
	"encoding": "^0.1.13",
	"eslint": "8.37.0",
	"eslint-config-next": "^13.2.4",
	"google-auth-library": "^9.0.0",
	"googleapis": "^126.0.1",
	"jest-mock-extended": "^3.0.4",
	"moment": "^2.29.4",
	"next": "^13.4.13",
	"nodemailer": "^6.9.3",
	"pusher": "^5.1.3",
	"pusher-js": "^8.3.0",
	"react": "^18.2.0",
	"react-big-calendar": "^1.8.2",
	"react-colorful": "^5.6.1",
	"react-dom": "^18.2.0",
	"react-email": "^1.9.3-canary.0",
	"react-hook-form": "^7.43.9",
	"react-quill": "^2.0.0",
	"react-toastify": "^9.1.2",
	"sharp": "^0.32.5",
	"stripe": "^12.14.0",
	"typescript": "5.0.3",
	"uuidv4": "^6.2.13",
	"yup": "^1.1.1"
},
```

Expected behavior

I should see the Uppy component

Actual behavior

I got this error :

not-found-boundary.js:22 Uncaught Error: Already found a plugin named 'react:Dashboard'. Tried to use: 'react:Dashboard'.
Uppy plugins must have unique id options. See https://uppy.io/docs/plugins/#id.

[Murderlon]

Hi, this may not be a bug but you are likely trying to render multiple Uppy UI components with only one instance.

If that's the case, checkout this:
https://uppy.io/docs/react/#how-do-i-render-x-amount-of-uppy-ui-components