Media Queries in React: How to pass a variable to size=full prop in <Drawer> component

Question

const isMobile = useMediaQuery('(max-width:992px)');

Old Syntax:

<Drawer full={isMobile}></Drawer>

But acc to new changes, here: Rsuite

full is Deprecated. Use size="full" instead for Full screen

So, New Syntax would be:

 <Drawer size='full' ></Drawer> 

In this case, how to pass the isMobile to Drawer component?

Answer 1

You can done with it like this

<Drawer size={ isMobile  ? 'full' : 'sm'} ></Drawer>