Skip to content

feat/default-placeholder-overlay#250

Open
kleinwave wants to merge 2 commits into
mainfrom
feat/default-placeholder-overlay
Open

feat/default-placeholder-overlay#250
kleinwave wants to merge 2 commits into
mainfrom
feat/default-placeholder-overlay

Conversation

@kleinwave

Copy link
Copy Markdown
Collaborator

@kleinwave kleinwave self-assigned this Aug 25, 2025
@kleinwave kleinwave requested a review from manas-qm August 25, 2025 12:54
@kleinwave

kleinwave commented Aug 25, 2025

Copy link
Copy Markdown
Collaborator Author
  • default placeholders for Parameters, State Updates, and Results containers
  • It reassures the user that the containers aren't broken - just no data has been loaded into them yet
  • as a bonus effect, the placeholder text has a subtle pulsing effect to indicate loading
Screenshot 2025-08-25 at 3 58 44 PM

defaultInspectDepth={3}
style={{ overflowY: "auto", height: "100%" }}
/>
{Object.keys(jsonData).length === 0 ? (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't that readable (needs to be extracted).

align-items: center;
justify-content: center;
height: 100%;
color: #A5ACB6;

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extract color

</div>
))
}
{Object.entries(runningNode?.parameters ?? {}).map(([key, parameter]) => (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't that readable (needs to be extracted).

align-items: center;
justify-content: center;
height: 100%;
color: #A5ACB6;

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extract color

font-size: 14px;
font-weight: 500;
margin-bottom: 6px;
color: #E0E0E0;

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extract color

{runningNodeInfo?.state_updates && Object.keys(runningNodeInfo?.state_updates).length > 0
? `(${Object.keys(runningNodeInfo?.state_updates).length})`
: ""}
{runningNodeInfo?.state_updates && Object.keys(runningNodeInfo?.state_updates).length > 0 && (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Needs to be extracted/separated.

{Object.entries(runningNodeInfo?.state_updates ?? {}).map(([key, stateUpdateObject], index) =>
)}

<div className={styles.stateUpdatesTopWrapper} data-testid="state-updates-top-wrapper">

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't that readable (needs to be extracted).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants