Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[shared-ui] Shift start into console area #4246

Merged
merged 2 commits into from
Jan 28, 2025
Merged

[shared-ui] Shift start into console area #4246

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c62cf2f
[shared-ui] Shift start into console area
paullewis Jan 28, 2025
6f95478
docs(changeset): Shift start into console area
paullewis Jan 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/thirty-eels-joke.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@breadboard-ai/shared-ui": patch
---

Shift start into console area
8 changes: 8 additions & 0 deletions packages/shared-ui/src/elements/asset-organizer/asset-organizer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,14 @@ export class AssetOrganizer extends SignalWatcher(LitElement) {
border: none;
font-size: 0;
cursor: pointer;

opacity: 0.5;
transition: opacity 0.2s cubic-bezier(0, 0, 0.3, 1);

&:hover,
&:focus {
opacity: 1;
}
}
}

Expand Down
4 changes: 3 additions & 1 deletion packages/shared-ui/src/elements/board-activity/board-activity.styles.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ export const styles = css`
.activity-entry {
position: relative;
padding-top: var(--bb-grid-size-2);

--output-padding: var(--bb-grid-size-5);
}

.activity-entry:first-of-type {
Expand Down Expand Up @@ -424,7 +426,7 @@ export const styles = css`
margin: var(--bb-grid-size) 0;
}

.output-port .value {
.output-port .value.markdown {
overflow-x: scroll;
scrollbar-width: none;
}
Expand Down
70 changes: 2 additions & 68 deletions packages/shared-ui/src/elements/board-activity/board-activity.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -232,39 +232,6 @@ export class BoardActivity extends LitElement {
>`;
}

async #createExportFromCurrentRun() {
if (!this.run || !this.run.serialize) {
this.downloadStatus = "initial";
return;
}

this.downloadStatus = "generating";

if (this.#serializedRunUrl) {
URL.revokeObjectURL(this.#serializedRunUrl);
}

this.#serializedRun = await this.run.serialize();
const data = JSON.stringify(this.#serializedRun, null, 2);
this.#serializedRunUrl = URL.createObjectURL(
new Blob([data], { type: "application/json" })
);

this.downloadStatus = "ready";
}

#deleteCurrentExport() {
if (this.#serializedRun) {
this.#serializedRun = null;
}

if (this.#serializedRunUrl) {
URL.revokeObjectURL(this.#serializedRunUrl);
}

this.downloadStatus = "initial";
}

async #renderSecretInput(event: InspectableRunSecretEvent) {
const userInputs: UserInputConfiguration[] = event.keys.reduce(
(prev, key) => {
Expand Down Expand Up @@ -529,6 +496,8 @@ export class BoardActivity extends LitElement {
if (typeof nodeValue === "object") {
if (isLLMContentArray(nodeValue)) {
value = html`<bb-llm-output-array
.showModeToggle=${false}
.showEntrySelector=${false}
.showExportControls=${true}
.lite=${true}
.clamped=${false}
Expand Down Expand Up @@ -612,44 +581,9 @@ export class BoardActivity extends LitElement {
? nothing
: html`<div id="click-run">${this.waitingMessage}</div>`;

let exportMessage: HTMLTemplateResult | symbol = nothing;
switch (this.downloadStatus) {
case "generating": {
exportMessage = html`${Strings.from("STATUS_GENERATING_EXPORT")}`;
break;
}

case "ready": {
exportMessage = html`<button
id="clear-export"
@click=${() => this.#deleteCurrentExport()}
>
${Strings.from("COMMAND_CLEAR")}
</button>
<a
id="download-export"
.download=${`run-${new Date().toISOString()}.json`}
.href=${this.#serializedRunUrl}
>${Strings.from("COMMAND_DOWNLOAD")}</a
>`;
break;
}

default: {
exportMessage = html`<button
id="export"
@click=${() => this.#createExportFromCurrentRun()}
>
${Strings.from("COMMAND_CREATE_EXPORT")}
</button>`;
break;
}
}

const events =
this.events && this.events.length
? html`
<div class="export-container">${exportMessage}</div>
${repeat(
this.events,
(event) => event.id,
Expand Down
34 changes: 3 additions & 31 deletions packages/shared-ui/src/elements/editor/editor.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@

import * as StringsHelper from "../../strings/helper.js";
const Strings = StringsHelper.forSection("Editor");
const GlobalStrings = StringsHelper.forSection("Global");

import {
BoardServer,
Expand Down Expand Up @@ -68,9 +67,7 @@ import {
NodeDeleteEvent,
NodeRunRequestEvent,
NodeTypeRetrievalErrorEvent,
RunEvent,
ShowTooltipEvent,
StopEvent,
WorkspaceSelectionStateEvent,
WorkspaceVisualUpdateEvent,
} from "../../events/events.js";
Expand Down Expand Up @@ -1438,11 +1435,6 @@ export class Editor extends LitElement implements DragConnectorReceiver {
}

render() {
const isRunning = this.topGraphResult
? this.topGraphResult.status === "running" ||
this.topGraphResult.status === "paused"
: false;

const readOnlyFlag =
this.graph !== null && this.readOnly && this.showReadOnlyLabel
? html`<aside id="readonly-overlay">Read-only View</aside>`
Expand Down Expand Up @@ -1478,7 +1470,6 @@ export class Editor extends LitElement implements DragConnectorReceiver {
}

if (awaitingUpdate.size === 0) {
console.log("Store ready");
this.graphStore?.removeEventListener(
"update",
onGraphUpdate as EventListener
Expand Down Expand Up @@ -1569,25 +1560,6 @@ export class Editor extends LitElement implements DragConnectorReceiver {
const content = html`<div id="content">
${this.graph && !this.readOnly
? html`<div id="floating-buttons">
<div id="start">
<button
id="run"
title=${GlobalStrings.from("LABEL_RUN_PROJECT")}
class=${classMap({ running: isRunning })}
?disabled=${this.readOnly}
@click=${() => {
if (isRunning) {
this.dispatchEvent(new StopEvent());
} else {
this.dispatchEvent(new RunEvent());
}
}}
>
${isRunning
? GlobalStrings.from("LABEL_STOP")
: GlobalStrings.from("LABEL_RUN")}
</button>
</div>
<div id="shelf">
<button
id="preset-all"
Expand All @@ -1608,8 +1580,8 @@ export class Editor extends LitElement implements DragConnectorReceiver {
if (!(evt.target instanceof HTMLButtonElement)) {
return;
}
await storeReady;

await storeReady;
this.#showComponentPicker(evt.target, "A2");
}}
>
Expand All @@ -1623,8 +1595,8 @@ export class Editor extends LitElement implements DragConnectorReceiver {
if (!(evt.target instanceof HTMLButtonElement)) {
return;
}
await storeReady;

await storeReady;
this.#showComponentPicker(evt.target, "Built-in Kit");
}}
>
Expand All @@ -1638,8 +1610,8 @@ export class Editor extends LitElement implements DragConnectorReceiver {
if (!(evt.target instanceof HTMLButtonElement)) {
return;
}
await storeReady;

await storeReady;
this.#showComponentPicker(evt.target, "Tool Kit");
}}
>
Expand Down
Loading