diff --git a/page/src/components/status-indicator.tsx b/page/src/components/status-indicator.tsx index 1b627bbd..b4eeee94 100644 --- a/page/src/components/status-indicator.tsx +++ b/page/src/components/status-indicator.tsx @@ -28,11 +28,38 @@ function getStateColor(state: State) { } } +function getStateEmoji(state: State) { + switch (state) { + case State.Stopped: + return "🔴"; + case State.Paused: + return "🟡"; + case State.Running: + return "🟢"; + default: + return ""; + } +} + +function getFilename(path: string) { + const lastSlash = path.lastIndexOf("/"); + if (lastSlash == -1) { + return path; + } + + return path.substring(lastSlash + 1); +} + export interface StatusIndicatorProps { state: State; + application: string | undefined; } export function StatusIndicator(props: StatusIndicatorProps) { + if (props.application && props.application.length > 0) { + document.title = `${getStateEmoji(props.state)} ${getFilename(props.application)} | Sogen`; + } + return ( | null; filesystem: Filesystem | null; emulator: Emulator | null; + application: string | undefined; drawerOpen: boolean; } @@ -84,6 +85,7 @@ export class Playground extends React.Component< filesystem: null, emulator: null, drawerOpen: false, + application: undefined, }; } @@ -192,7 +194,7 @@ export class Playground extends React.Component< ); new_emulator.onTerminate().then(() => this.setState({ emulator: null })); - this.setState({ emulator: new_emulator }); + this.setState({ emulator: new_emulator, application: userFile }); new_emulator.start(this.state.settings, userFile); } @@ -201,7 +203,7 @@ export class Playground extends React.Component< return ( <>
@@ -285,6 +287,7 @@ export class Playground extends React.Component<