QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-18 23:55:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(db): prevent long database error messages from overflowing UI (#37709)

Browse Source 
Co-authored-by: RiniMisini12 <misinirini@gmail.com>
This commit is contained in:
Rini Misini
2026-02-07 15:13:09 +01:00
committed by GitHub
parent b9ab03994a
commit f4708a5648
2 changed files with 71 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
superset-frontend/src/components/MessageToasts/Toast.tsx
View File

@@ -26,14 +26,24 @@ import { ToastType, ToastMeta } from './types';
const ToastContainer = styled.div`
${({ theme }) => css`
display: flex;
justify-content: space-between; // Changed from center to space-between
align-items: center;
align-items: flex-start;
gap: ${theme.sizeUnit * 2}px;
// Content container for icon and text
.toast__content {
display: flex;
align-items: center;
flex: 1; // Take available space
align-items: flex-start;
gap: ${theme.sizeUnit * 2}px;
flex: 1;
max-height: 60vh;
overflow-y: auto;
padding-right: ${theme.sizeUnit * 2}px;
scrollbar-width: thin;
scrollbar-color: ${theme.colorTextLightSolid} ${theme.colorBgSpotlight};
}
.anticon {

59
superset-frontend/src/components/MessageToasts/ToastPresenter.tsx
View File

@@ -33,10 +33,62 @@ const StyledToastPresenter = styled.div<VisualProps>(
${position === 'bottom' ? 'bottom' : 'top'}: 0px;
right: 0px;
margin-right: 50px;
margin-bottom: 50px;
margin-block: 50px;
z-index: ${theme.zIndexPopupBase + 1};
word-break: break-word;
height: calc(100vh - 100px);
display: flex;
flex-direction: ${position === 'bottom' ? 'column-reverse' : 'column'};
align-items: stretch;
gap: ${theme.sizeUnit * 2}px;
overflow-y: auto;
overscroll-behavior: contain;
overflow-x: hidden;
scrollbar-width: thin;
scrollbar-color:
color-mix(in srgb, ${theme.colorText}, transparent 75%)
transparent;
&:hover,
&:focus-within,
&:active {
scrollbar-color:
color-mix(in srgb, ${theme.colorText}, transparent 60%)
transparent;
}
/* Chromium / WebKit */
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-thumb {
background-color: color-mix(
in srgb,
${theme.colorText},
transparent 75%
);
border-radius: 6px;
transition: background-color 0.2s ease;
}
&:hover::-webkit-scrollbar-thumb,
&:focus-within::-webkit-scrollbar-thumb,
&:active::-webkit-scrollbar-thumb {
background-color: color-mix(
in srgb,
${theme.colorText},
transparent 60%
);
}
.toast {
padding: ${theme.sizeUnit * 4}px;
margin: ${theme.sizeUnit * 4}px;
@@ -44,6 +96,9 @@ const StyledToastPresenter = styled.div<VisualProps>(
border-radius: ${theme.borderRadius}px;
box-shadow: ${theme.boxShadow};
color: ${theme.colorTextLightSolid};
display: flex;
align-items: flex-start;
max-height: 70vh;
opacity: 0;
position: relative;
transform: translateY(-100%);
@@ -63,7 +118,7 @@ const StyledToastPresenter = styled.div<VisualProps>(
}
.toast > button {
color: ${theme.colorTextLightSolid};
color: ${theme.colorText};
opacity: 1;
}