pepperplus/pepperplus-ui
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: Added visual separation between global and node or handle specific warnings

Browse Source 
ref: N25B-450
This commit is contained in:
JGerla
2026-01-20 12:50:29 +01:00
parent 5d55ebaaa2
commit 3f6d95683d
2 changed files with 49 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/VisProgPage/visualProgrammingUI/components/WarningSidebar.module.css
View File

@@ -38,6 +38,10 @@
border: 2px solid currentColor;
}
.warning-group-header {
background: ButtonFace;
}
.warnings-list {
flex: 1;
overflow-y: auto;

49
src/pages/VisProgPage/visualProgrammingUI/components/WarningSidebar.tsx
View File

@@ -19,6 +19,9 @@ export function WarningsSidebar() {
? warnings
: warnings.filter(w => w.severity === severityFilter);
return (
<aside className={styles.warningsSidebar}>
<WarningsHeader
@@ -67,6 +70,11 @@ function WarningsHeader({
function WarningsList(props: { warnings: EditorWarning[] }) {
const splitWarnings = {
global: props.warnings.filter(w => w.scope.id === globalWarning),
other: props.warnings.filter(w => w.scope.id !== globalWarning),
}
if (props.warnings.length === 0) {
return (
<div className={styles.warningsEmpty}>
@@ -74,11 +82,44 @@ function WarningsList(props: { warnings: EditorWarning[] }) {
</div>
)
}
if (splitWarnings.global.length === 0) {
return (
<div>
<div className={"warningGroup"}>
<div className={styles.warningGroupHeader}>global:</div>
<div className={styles.warningsEmpty}>
No global warnings!
</div>
</div>
<div className={"warningGroup"}>
<div className={styles.warningGroupHeader}>other:</div>
<div className={styles.warningsList}>
{splitWarnings.other.map((warning) => (
<WarningListItem warning={warning} />
))}
</div>
</div>
</div>
);
}
return (
<div className={styles.warningsList}>
{props.warnings.map((warning) => (
<WarningListItem warning={warning} />
))}
<div>
<div className={"warningGroup"}>
<div className={styles.warningGroupHeader}>global:</div>
<div className={styles.warningsList}>
{splitWarnings.global.map((warning) => (
<WarningListItem warning={warning} />
))}
</div>
</div>
<div className={"warningGroup"}>
<div className={styles.warningGroupHeader}>other:</div>
<div className={styles.warningsList}>
{splitWarnings.other.map((warning) => (
<WarningListItem warning={warning} />
))}
</div>
</div>
</div>
);
}