feat: implement database explorer, SQL console, and tabbed navigation interface for table management

This commit is contained in:
Ümit Tunç
2026-04-24 13:36:55 +03:00
parent 5192d950f0
commit 53b40e95e5
3 changed files with 51 additions and 2 deletions
+18 -1
View File
@@ -184,7 +184,24 @@ const DatabaseTablesGrid: React.FC<DatabaseTablesGridProps> = ({ database, setNo
loading={loading}
getRowId={(row: any) => row.name}
density="comfortable"
sx={{ border: 'none' }}
sx={{
border: 'none',
'& .MuiDataGrid-row:nth-of-type(even)': {
bgcolor: (theme) => theme.palette.mode === 'dark' ? 'rgba(255,255,255,0.02)' : 'rgba(0,0,0,0.01)',
},
'& .MuiDataGrid-cell': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeader': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeaders': {
borderBottom: '1px solid',
borderColor: 'divider',
}
}}
/>
</Paper>
</Box>
+15
View File
@@ -145,6 +145,21 @@ const MainContent: React.FC = () => {
pageSizeOptions={[25, 50, 100]}
sx={{
border: 'none',
'& .MuiDataGrid-row:nth-of-type(even)': {
bgcolor: (theme) => theme.palette.mode === 'dark' ? 'rgba(255,255,255,0.02)' : 'rgba(0,0,0,0.01)',
},
'& .MuiDataGrid-cell': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeader': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeaders': {
borderBottom: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-row:hover': { bgcolor: 'rgba(0, 97, 255, 0.04)' },
}}
/>
+18 -1
View File
@@ -121,7 +121,24 @@ const SqlConsole: React.FC<SqlConsoleProps> = ({ initialQuery, setNotification }
columns={columns}
rowCount={rowCount}
loading={loading}
sx={{ border: 'none' }}
sx={{
border: 'none',
'& .MuiDataGrid-row:nth-of-type(even)': {
bgcolor: (theme) => theme.palette.mode === 'dark' ? 'rgba(255,255,255,0.02)' : 'rgba(0,0,0,0.01)',
},
'& .MuiDataGrid-cell': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeader': {
borderRight: '1px solid',
borderColor: 'divider',
},
'& .MuiDataGrid-columnHeaders': {
borderBottom: '1px solid',
borderColor: 'divider',
}
}}
/>
</Paper>
</Box>