Use Box instead of div

This commit is contained in:
Nicola Benaglia 2025-06-12 09:07:07 +02:00
parent e82b9dab8c
commit 4be9893465
4 changed files with 25 additions and 28 deletions

View File

@ -143,7 +143,6 @@ import { CopyIcon } from './assets/Icons/CopyIcon.tsx';
import { SuccessIcon } from './assets/Icons/SuccessIcon.tsx'; import { SuccessIcon } from './assets/Icons/SuccessIcon.tsx';
import { useAtom, useSetAtom } from 'jotai'; import { useAtom, useSetAtom } from 'jotai';
import { useResetAtom } from 'jotai/utils'; import { useResetAtom } from 'jotai/utils';
import MintingDetailsPage from './components/Minting/Minting-new.tsx';
type extStates = type extStates =
| 'authenticated' | 'authenticated'
@ -3978,13 +3977,11 @@ function App() {
)} )}
{isOpenMinting && ( {isOpenMinting && (
// <Minting <Minting
// setIsOpenMinting={setIsOpenMinting} setIsOpenMinting={setIsOpenMinting}
// myAddress={address} myAddress={address}
// show={show} show={show}
// /> />
<MintingDetailsPage />
)} )}
{!isAuthenticated && ( {!isAuthenticated && (

View File

@ -546,7 +546,7 @@ export const ChatDirect = ({
}, []); }, []);
return ( return (
<div <Box
style={{ style={{
background: theme.palette.background.default, background: theme.palette.background.default,
display: 'flex', display: 'flex',
@ -615,7 +615,7 @@ export const ChatDirect = ({
tempChatReferences={tempChatReferences} tempChatReferences={tempChatReferences}
/> />
<div <Box
style={{ style={{
backgroundColor: theme.palette.background.default, backgroundColor: theme.palette.background.default,
bottom: isFocusedParent ? '0px' : 'unset', bottom: isFocusedParent ? '0px' : 'unset',
@ -632,7 +632,7 @@ export const ChatDirect = ({
zIndex: isFocusedParent ? 5 : 'unset', zIndex: isFocusedParent ? 5 : 'unset',
}} }}
> >
<div <Box
style={{ style={{
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
@ -720,7 +720,7 @@ export const ChatDirect = ({
</Typography> </Typography>
</Box> </Box>
)} )}
</div> </Box>
<Box <Box
sx={{ sx={{
@ -766,7 +766,7 @@ export const ChatDirect = ({
{` Send`} {` Send`}
</CustomButton> </CustomButton>
</Box> </Box>
</div> </Box>
<LoadingSnackbar <LoadingSnackbar
open={isLoading} open={isLoading}
@ -783,6 +783,6 @@ export const ChatDirect = ({
info={infoSnack} info={infoSnack}
setInfo={setInfoSnack} setInfo={setInfoSnack}
/> />
</div> </Box>
); );
}; };

View File

@ -206,7 +206,7 @@ export const ChatList = ({
width: '100%', width: '100%',
}} }}
> >
<div <Box
style={{ style={{
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
@ -215,7 +215,7 @@ export const ChatList = ({
width: '100%', width: '100%',
}} }}
> >
<div <Box
ref={parentRef} ref={parentRef}
className="List" className="List"
style={{ style={{
@ -226,13 +226,13 @@ export const ChatList = ({
position: 'relative', position: 'relative',
}} }}
> >
<div <Box
style={{ style={{
height: rowVirtualizer.getTotalSize(), height: rowVirtualizer.getTotalSize(),
width: '100%', width: '100%',
}} }}
> >
<div <Box
style={{ style={{
left: 0, left: 0,
position: 'absolute', position: 'absolute',
@ -325,7 +325,7 @@ export const ChatList = ({
// Render fallback if message is null // Render fallback if message is null
if (!message) { if (!message) {
return ( return (
<div <Box
key={virtualRow.index} key={virtualRow.index}
style={{ style={{
alignItems: 'center', alignItems: 'center',
@ -345,12 +345,12 @@ export const ChatList = ({
postProcess: 'capitalizeFirstChar', postProcess: 'capitalizeFirstChar',
})} })}
</Typography> </Typography>
</div> </Box>
); );
} }
return ( return (
<div <Box
data-index={virtualRow.index} //needed for dynamic row height measurement data-index={virtualRow.index} //needed for dynamic row height measurement
ref={rowVirtualizer.measureElement} //measure dynamic row height ref={rowVirtualizer.measureElement} //measure dynamic row height
key={message.signature} key={message.signature}
@ -395,12 +395,12 @@ export const ChatList = ({
scrollToItem={goToMessage} scrollToItem={goToMessage}
/> />
</ErrorBoundary> </ErrorBoundary>
</div> </Box>
); );
})} })}
</div> </Box>
</div> </Box>
</div> </Box>
{showScrollButton && ( {showScrollButton && (
<Button <Button
@ -449,7 +449,7 @@ export const ChatList = ({
})} })}
</Button> </Button>
)} )}
</div> </Box>
{enableMentions && (hasSecretKey || isPrivate === false) && ( {enableMentions && (hasSecretKey || isPrivate === false) && (
<ChatOptions <ChatOptions

View File

@ -145,7 +145,7 @@ export const GroupList = ({
</ButtonBase> </ButtonBase>
</Box> </Box>
<div <Box
style={{ style={{
alignItems: 'flex-start', alignItems: 'flex-start',
display: 'flex', display: 'flex',
@ -176,7 +176,7 @@ export const GroupList = ({
/> />
))} ))}
</List> </List>
</div> </Box>
<Box <Box
sx={{ sx={{