perspective_viewer/components/column_selector/
pivot_column.rs1use perspective_client::config::ColumnType;
14use web_sys::*;
15use yew::prelude::*;
16
17use crate::components::dragdrop_list::*;
18use crate::components::type_icon::TypeIcon;
19use crate::presentation::Presentation;
20use crate::session::*;
21use crate::utils::*;
22
23#[derive(Properties)]
24pub struct PivotColumnProps {
25 pub column: String,
27
28 #[prop_or_default]
29 pub column_type: Option<ColumnType>,
30
31 pub action: DragTarget,
33
34 #[prop_or_default]
36 pub metadata: Option<SessionMetadataRc>,
37
38 #[prop_or_default]
40 pub opt_session: Option<Session>,
41 pub presentation: Presentation,
42}
43
44impl PartialEq for PivotColumnProps {
45 fn eq(&self, other: &Self) -> bool {
46 self.column == other.column
47 && self.action == other.action
48 && self.metadata == other.metadata
49 }
50}
51
52impl DragDropListItemProps for PivotColumnProps {
53 type Item = String;
54
55 fn get_item(&self) -> String {
56 self.column.clone()
57 }
58}
59
60pub struct PivotColumn;
61
62impl Component for PivotColumn {
63 type Message = ();
64 type Properties = PivotColumnProps;
65
66 fn create(_ctx: &Context<Self>) -> Self {
67 Self
68 }
69
70 fn view(&self, ctx: &Context<Self>) -> Html {
71 let dragstart = Callback::from({
72 let event_name = ctx.props().column.to_owned();
73 let presentation = ctx.props().presentation.clone();
74 let action = ctx.props().action;
75 move |event: DragEvent| {
76 if presentation.set_drag_image(&event) {
77 presentation.notify_drag_start(event_name.to_string(), DragEffect::Move(action))
78 }
79 }
80 });
81
82 let dragend = Callback::from({
83 let presentation = ctx.props().presentation.clone();
84 move |_event| presentation.notify_drag_end()
85 });
86
87 let col_type = ctx.props().column_type.unwrap_or_else(|| {
88 ctx.props()
89 .metadata
90 .as_ref()
91 .and_then(|x| x.get_column_table_type(&ctx.props().column))
92 .unwrap_or(ColumnType::Integer)
93 });
94
95 html! {
96 <div
97 class="pivot-column-draggable"
98 draggable="true"
99 ondragstart={dragstart}
100 ondragend={dragend}
101 >
102 <div class="pivot-column-border">
103 <span class="drag-handle icon" />
104 <TypeIcon ty={col_type} />
105 <span class="column_name">{ ctx.props().column.clone() }</span>
106 </div>
107 </div>
108 }
109 }
110}