Skip to content

Commit

Permalink
jupyter kernel selector: some cleanup and close button
Browse files Browse the repository at this point in the history
  • Loading branch information
@haraldschilly
haraldschilly committed Nov 8, 2018
1 parent 13f5088 commit 999ca02
Show file tree
Hide file tree
Showing 3 changed files with 88 additions and 69 deletions.
13 changes: 6 additions & 7 deletions src/smc-webapp/jupyter/actions.ts
View file
Expand Up @@ -1902,11 +1902,14 @@ export class JupyterActions extends Actions<JupyterStoreState> {

set_kernel = (kernel: any) => {
if (this.store.get("kernel") !== kernel) {
return this._set({
this._set({
type: "settings",
kernel
});
}
if (this.store.get("show_kernel_selector")) {
this.hide_select_kernel();
}
};

show_history_viewer = () => {
Expand Down Expand Up @@ -3220,12 +3223,8 @@ export class JupyterActions extends Actions<JupyterStoreState> {
});
};

select_kernel = (kernel_name: string | undefined): void => {
if (kernel_name != null) {
this.set_kernel(kernel_name);
} else {
this.set_kernel(null);
}
select_kernel = (kernel_name: string): void => {
this.set_kernel(kernel_name);
this.set_default_kernel(kernel_name);
this.focus(true);
this.hide_select_kernel();
Expand Down
7 changes: 5 additions & 2 deletions src/smc-webapp/jupyter/main.tsx
View file
Expand Up @@ -40,6 +40,7 @@ interface JupyterEditorProps {
name: string; // TODO: is this correct?
view_mode?: any; // rtypes.oneOf(['normal', 'json', 'raw'])
kernel?: string; // string name of the kernel
site_name: string;
// error?: string; // TODO: repeated?
fatal?: string; // *FATAL* error; user must edit file to fix.
toolbar?: boolean;
Expand Down Expand Up @@ -134,7 +135,8 @@ class JupyterEditor0 extends Component<JupyterEditorProps> {
kernels_by_language: rtypes.immutable.Map,
default_kernel: rtypes.string,
closestKernel: rtypes.immutable.Map
}
},
customize: { site_name: rtypes.string }
};
}

Expand Down Expand Up @@ -351,9 +353,10 @@ class JupyterEditor0 extends Component<JupyterEditorProps> {
kernel_info={this.props.kernel_info}
kernel_selection={this.props.kernel_selection}
kernels_by_name={this.props.kernels_by_name}
kernels_by_language = {this.props.kernels_by_language}
kernels_by_language={this.props.kernels_by_language}
default_kernel={this.props.default_kernel}
closestKernel={this.props.closestKernel}
site_name={this.props.site_name}
/>
);
}
Expand Down
137 changes: 77 additions & 60 deletions src/smc-webapp/jupyter/select-kernel.tsx
View file
Expand Up @@ -9,7 +9,7 @@ import {
OrderedMap /*, List as ImmutableList*/
} from "immutable";
import * as misc from "smc-util/misc";
const { Icon, Markdown, /*Space,*/ Loading } = require("../r_misc"); // TODO: import types
const { Icon, /* Markdown, /*Space,*/ Loading } = require("../r_misc"); // TODO: import types
const {
Button,
Col,
Expand All @@ -28,12 +28,14 @@ const row_style: React.CSSProperties = {
};

const main_style: React.CSSProperties = {
padding: "20px 10px",
overflowY: "auto",
overflowX: "hidden"
};

interface IKernelSelectorProps {
actions: any;
site_name: string;
kernel?: string;
kernel_info?: any;
default_kernel?: string;
Expand All @@ -43,37 +45,35 @@ interface IKernelSelectorProps {
closestKernel?: TKernel;
}

interface IKernelSelectorState {
selected_kernel?: string;
}
interface IKernelSelectorState {}

export class KernelSelector extends Component<
IKernelSelectorProps,
IKernelSelectorState
> {
constructor(props: IKernelSelectorProps, context: any) {
super(props, context);
this.state = { selected_kernel: undefined };
this.state = {};
}

render_select_button() {
const disabled = this.state.selected_kernel == null;
const msg = disabled
? "Select a kernel"
: `Use ${this.kernel_name(this.state.selected_kernel!)}`;
return (
<Button
key={"select"}
bsStyle={disabled ? "default" : "primary"}
disabled={disabled}
onClick={() =>
this.props.actions.select_kernel(this.state.selected_kernel)
}
>
{msg}
</Button>
);
}
// render_select_button() {
// const disabled = this.state.selected_kernel == null;
// const msg = disabled
// ? "Select a kernel"
// : `Use ${this.kernel_name(this.state.selected_kernel!)}`;
// return (
// <Button
// key={"select"}
// bsStyle={disabled ? "default" : "primary"}
// disabled={disabled}
// onClick={() =>
// this.props.actions.select_kernel(this.state.selected_kernel)
// }
// >
// {msg}
// </Button>
// );
// }

// the idea here is to not set the kernel, but still render the notebook.
// looks like that's not easy, and well, probably incompatible with classical jupyter.
Expand All @@ -96,18 +96,6 @@ export class KernelSelector extends Component<
}
*/

render_body() {
if (
this.props.kernel_selection == null ||
this.props.kernels_by_name == null
)
return;
let ks = this.props.kernel_selection.map((k, v) => {
return `${k}=${v}`;
});
return <Markdown value={`kernels: ${ks.join(", ")}`} />;
}

kernel_name(name: string) {
return this.kernel_attr(name, "display_name");
}
Expand Down Expand Up @@ -136,7 +124,7 @@ export class KernelSelector extends Component<

render_kernel_button(
name: string,
size: string = "default",
size?: string,
show_icon: boolean = true
): Rendered {
const lang = this.kernel_attr(name, "language");
Expand Down Expand Up @@ -200,16 +188,16 @@ export class KernelSelector extends Component<
);
}

render_all_selected_link() {
if (this.props.kernels_by_name == null) return;
const name = this.state.selected_kernel;
if (name == null) return;
const cocalc: ImmutableMap<string, any> = this.props.kernels_by_name.getIn(
[name, "metadata", "cocalc"],
null
);
return this.render_suggested_link(cocalc);
}
// render_all_selected_link() {
// if (this.props.kernels_by_name == null) return;
// const name = this.state.selected_kernel;
// if (name == null) return;
// const cocalc: ImmutableMap<string, any> = this.props.kernels_by_name.getIn(
// [name, "metadata", "cocalc"],
// null
// );
// return this.render_suggested_link(cocalc);
// }

render_all_langs(): Rendered[] | undefined {
if (this.props.kernels_by_language == null) return;
Expand Down Expand Up @@ -263,12 +251,18 @@ export class KernelSelector extends Component<
}

render_top() {
if (this.props.kernel == null) {
let msg: string;
if (this.props.kernel_info != null) {
msg = "This notebook kernel is unknown.";
if (this.props.kernel == null || this.props.kernel_info == null) {
let msg: Rendered;
// kernel, but no info means it is not known
if (this.props.kernel != null && this.props.kernel_info == null) {
msg = (
<>
Your notebook kernel <code>"{this.props.kernel}"</code> does not
exist on {this.props.site_name}.
</>
);
} else {
msg = "This notebook has no kernel.";
msg = <>This notebook has no kernel.</>;
}
return (
<Row style={row_style}>
Expand Down Expand Up @@ -296,7 +290,7 @@ export class KernelSelector extends Component<
return (
<Row style={row_style}>
<Alert bsStyle={"danger"}>
<h3>Unknown Kernel</h3>
<h4>Unknown Kernel</h4>
<div>
A similar kernel might be{" "}
{this.render_kernel_button(closestKernelName)}.
Expand All @@ -316,19 +310,30 @@ export class KernelSelector extends Component<
);
}

render() {
let body: Rendered;
render_close_button(): Rendered | undefined {
if (this.props.kernel == null || this.props.kernel_info == null) return;
return (
<Button
style={{ float: "right" }}
onClick={() => this.props.actions.hide_select_kernel()}
>
Close
</Button>
);
}

render_body(): Rendered {
if (
this.props.kernels_by_name == null ||
this.props.kernel_selection == null
) {
body = (
return (
<Row style={row_style}>
<Loading />
</Row>
);
} else {
body = (
return (
<>
{this.render_top()}
{this.render_unknown()}
Expand All @@ -340,13 +345,25 @@ export class KernelSelector extends Component<
</>
);
}
}

render_head(): Rendered {
return (
<Row style={row_style}>
<h3>
{"Select a Kernel"}
{this.render_close_button()}
</h3>
</Row>
);
}

render(): Rendered {
return (
<div style={main_style} className={"smc-vfill"}>
<Col md={8} mdOffset={2}>
<Row style={row_style}>
<h3>{"Select a Kernel"}</h3>
</Row>
{body}
{this.render_head()}
{this.render_body()}
</Col>
</div>
);
Expand Down

0 comments on commit 999ca02

Please sign in to comment.