Site icon Hip-Hop Website Design and Development

How use wp media add liberary in react parts?

i am utilizing create-react-app to jot down a react plugin for wordpress.
I need to add a button in plugin admin settings web page for add a picture.
I comply with this doc however nothing is rendered.

https://github.com/WordPress/gutenberg/tree/grasp/packages/block-editor/src/parts/media-upload

my code:

...
import { Button } from '@wordpress/parts';
import { MediaUpload, MediaUploadCheck } from '@wordpress/block-editor';

const ALLOWED_MEDIA_TYPES = [ 'image' ];

const MyMediaUploader = () => {
    return (
        <MediaUploadCheck>
            <MediaUpload
                onSelect={ ( media ) => console.log( 'chosen ' + media.size ) }
                allowedTypes={ ALLOWED_MEDIA_TYPES }
                worth=""
                render={ ( { open } ) => (
                    <Button onClick={ open }>
                        Open Media Library
                    </Button>
                ) }
            />
        </MediaUploadCheck>
    );
}

export default operate settingsPage(){
    return(
        <MyMediaUploader/> 
    )
}