6
6
/*
7
7
The slideshow toolbar functionality for cells.
8
8
*/
9
-
9
+ import { Select } from "antd" ;
10
10
import { Map as ImmutableMap } from "immutable" ;
11
-
12
- import { FormControl } from "@cocalc/frontend/antd-bootstrap" ;
13
- import { React } from "@cocalc/frontend/app-framework" ;
14
11
import { JupyterActions } from "./browser-actions" ;
15
12
16
13
const TYPES = [
@@ -22,33 +19,25 @@ const TYPES = [
22
19
{ title : "Notes" , value : "notes" } ,
23
20
] as const ;
24
21
25
- const rendered_options = TYPES . map ( ( x ) => (
26
- < option key = { x . value } value = { x . value } >
27
- { x . title }
28
- </ option >
29
- ) ) ;
30
-
31
22
interface SlideshowProps {
32
23
actions : JupyterActions ;
33
24
cell : ImmutableMap < string , any > ;
34
25
}
35
26
36
- export const Slideshow : React . FC < SlideshowProps > = ( props : SlideshowProps ) => {
37
- const { actions, cell } = props ;
38
- function select ( e : any ) : void {
39
- actions . set_cell_slide ( cell . get ( "id" ) , e . target . value ) ;
40
- }
27
+ export function Slideshow ( { actions, cell } : SlideshowProps ) {
41
28
return (
42
29
< div style = { { width : "100%" } } >
43
- < FormControl
44
- componentClass = "select"
45
- placeholder = "select"
46
- onChange = { select }
30
+ < Select
31
+ onChange = { ( value ) => {
32
+ actions . set_cell_slide ( cell . get ( "id" ) , value ) ;
33
+ } }
47
34
value = { cell . get ( "slide" , "" ) }
48
35
style = { { float : "right" , width : "200px" } }
49
- >
50
- { rendered_options }
51
- </ FormControl >
36
+ options = { TYPES . map ( ( x ) => ( {
37
+ label : x . title ,
38
+ value : x . value ,
39
+ } ) ) }
40
+ />
52
41
</ div >
53
42
) ;
54
- } ;
43
+ }
0 commit comments