Skip to content

Commit

Permalink
Merge branch 'dev' into sara/add-error-logging
Browse files Browse the repository at this point in the history
  • Loading branch information
dariusc93 authored Jan 30, 2024
2 parents 0a32143 + 7cdbf3d commit 581f235
Show file tree
Hide file tree
Showing 8 changed files with 120 additions and 122 deletions.
2 changes: 2 additions & 0 deletions common/src/state/ui.rs
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,9 @@ pub struct UI {
pub metadata: WindowMeta,
#[serde(default = "default_emojis")]
pub emojis: EmojiCounter,
#[serde(skip)]
pub emoji_destination: Option<EmojiDestination>,
#[serde(skip)]
pub emoji_picker_visible: bool,
#[serde(default = "bool_true")]
transform_markdown_text: bool,
Expand Down
10 changes: 8 additions & 2 deletions kit/src/components/invisible_closer/mod.rs
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,21 @@ use dioxus::prelude::*;

#[derive(Props)]
pub struct Props<'a> {
classes: Option<String>,
onclose: EventHandler<'a, ()>,
children: Option<Element<'a>>,
}

#[allow(non_snake_case)]
pub fn InvisibleCloser<'a>(cx: Scope<'a, Props<'a>>) -> Element<'a> {
cx.render(rsx!(div {
class: "close-handler-behind",
class: format_args!(
"close-handler-behind {}",
cx.props.classes.clone().unwrap_or_default()
),
onclick: move |_| {
cx.props.onclose.call(());
}
},
cx.props.children.as_ref()
}))
}
3 changes: 2 additions & 1 deletion kit/src/components/invisible_closer/style.scss
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
.close-handler-behind {
position: fixed;
top: 0;
top: var(--titlebar-height);
left: 0;
right: 0;
bottom: 0;
z-index: 1;
cursor: default;
}

7 changes: 4 additions & 3 deletions kit/src/elements/select/mod.rs
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ use std::collections::HashSet;
use dioxus::prelude::*;
use dioxus_elements::GlobalAttributes;

use crate::components::invisible_closer::InvisibleCloser;

#[derive(Props)]
pub struct Props<'a> {
#[props(optional)]
Expand Down Expand Up @@ -126,9 +128,8 @@ pub fn FancySelect<'a>(cx: Scope<'a, FancySelectProps<'a>>) -> Element<'a> {
})
)
},
div {
class: "select-outside",
onclick: |_| {
InvisibleCloser {
onclose: |_| {
visible.set(false);
}
}
Expand Down
10 changes: 0 additions & 10 deletions kit/src/elements/select/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -54,14 +54,4 @@
&:hover {
background-color: var(--secondary-light);
}
}

.select-outside {
z-index: 1;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
cursor: default;
}
198 changes: 100 additions & 98 deletions native_extensions/emoji_selector/src/lib.rs
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ use dioxus::prelude::*;
use emojis::{Group, UnicodeVersion};
use extensions::{export_extension, Details, Extension, Location, Meta, Type};
use futures::StreamExt;
use kit::components::invisible_closer::InvisibleCloser;
use kit::elements::textarea;
use kit::{
components::nav::{Nav, Route},
Expand Down Expand Up @@ -190,111 +191,112 @@ fn render_selector<'a>(
});

cx.render(rsx! (
InvisibleCloser {
onclose: |_|{
state.write().mutate(Action::SetEmojiDestination(
Some(common::state::ui::EmojiDestination::Chatbar),
));
if !*mouse_over_emoji_button.read() && !*mouse_over_emoji_selector.read() {
state.write().mutate(Action::SetEmojiPickerVisible(false));
}
}
}
div {
onmouseenter: |_| {
*mouse_over_emoji_selector.write_silent() = true;
},
onmouseleave: |_| {
*mouse_over_emoji_selector.write_silent() = false;
let _ = eval(focus_script);
},
id: "emoji_selector",
aria_label: "emoji-selector",
tabindex: "0",
div {
onmouseenter: |_| {
*mouse_over_emoji_selector.write_silent() = true;
},
onmouseleave: |_| {
*mouse_over_emoji_selector.write_silent() = false;
let _ = eval(focus_script);
},
id: "emoji_selector",
aria_label: "emoji-selector",
tabindex: "0",
onblur: |_| {
// When leaving default to the chatbar
state.write().mutate(Action::SetEmojiDestination(
Some(common::state::ui::EmojiDestination::Chatbar),
));
if !*mouse_over_emoji_button.read() && !*mouse_over_emoji_selector.read() {
state.write().mutate(Action::SetEmojiPickerVisible(false));
}
},
div {
class: "search-input disable-select",
textarea::Input {
placeholder: get_local_text("uplink.search-placeholder"),
key: "emoji-search-input",
id: String::from("emoji-search-input"),
loading: false,
ignore_focus: false,
show_char_counter: false,
aria_label: "emoji-search-input".into(),
value: String::new(),
onreturn: |_| {},
onchange: |_| {},
onkeyup: |_| {},
prevent_up_down_arrows: !emoji_suggestions.is_empty(),
oncursor_update: move |(v, p): (String, i64)| {
let mut sub: String = v.chars().take(p as usize).collect();
sub = if !sub.starts_with(':') {
format!(":{}", sub)
} else {
sub
};
let capture = EMOJI_REGEX.captures(&sub);
match capture {
Some(emoji) => {
let emoji = &emoji[0];
if emoji.contains(char::is_whitespace) {
emoji_suggestions.set(vec![]);
return;
}
let alias = emoji.replace(':', "");
emoji_suggestions
.set(state.read().ui.emojis.get_matching_emoji(&alias, false));
class: "search-input disable-select",
textarea::Input {
placeholder: get_local_text("uplink.search-placeholder"),
key: "emoji-search-input",
id: String::from("emoji-search-input"),
loading: false,
ignore_focus: false,
show_char_counter: false,
aria_label: "emoji-search-input".into(),
value: String::new(),
onreturn: |_| {},
onchange: |_| {},
onkeyup: |_| {},
prevent_up_down_arrows: !emoji_suggestions.is_empty(),
oncursor_update: move |(v, p): (String, i64)| {
let mut sub: String = v.chars().take(p as usize).collect();
sub = if !sub.starts_with(':') {
format!(":{}", sub)
} else {
sub
};
let capture = EMOJI_REGEX.captures(&sub);
match capture {
Some(emoji) => {
let emoji = &emoji[0];
if emoji.contains(char::is_whitespace) {
emoji_suggestions.set(vec![]);
return;
}
None => emoji_suggestions.set(vec![]),
let alias = emoji.replace(':', "");
emoji_suggestions
.set(state.read().ui.emojis.get_matching_emoji(&alias, false));
}
},
None => emoji_suggestions.set(vec![]),
}
},
div {
id: "scrolling",
padding_top: if !emoji_suggestions.is_empty() {"4px"} else {""},
if !emoji_suggestions.is_empty() {
rsx!(emoji_suggestions.iter().map(|(emoji, _)| {
rsx!(
div {
aria_label: emoji.as_str(),
class: "emoji",
onclick: move |_| select_emoji_to_send(cx.scope, state, emoji.to_string(), ch),
emoji.as_str()
}
)
}))
} else {
rsx! (emojis::Group::iter().map(|group| {
let name: String = group_to_str(group);
rsx!(
div {
id: "{group_to_str(group)}",
Label {
text: name
},
}
div {
class: "emojis-container",
aria_label: "emojis-container",
group.emojis().filter(|emoji|is_supported(emoji.unicode_version())).map(|emoji| {
rsx!(
div {
aria_label: emoji.as_str(),
class: "emoji",
onclick: move |_| select_emoji_to_send(cx.scope, state, emoji.to_string(), ch),
emoji.as_str()
}
)
})
}
)
}))
}
},
div {
id: "scrolling",
padding_top: if !emoji_suggestions.is_empty() {"4px"} else {""},
if !emoji_suggestions.is_empty() {
rsx!(emoji_suggestions.iter().map(|(emoji, _)| {
rsx!(
div {
aria_label: emoji.as_str(),
class: "emoji",
onclick: move |_| select_emoji_to_send(cx.scope, state, emoji.to_string(), ch),
emoji.as_str()
}
)
}))
} else {
rsx! (emojis::Group::iter().map(|group| {
let name: String = group_to_str(group);
rsx!(
div {
id: "{group_to_str(group)}",
Label {
text: name
},
}
div {
class: "emojis-container",
aria_label: "emojis-container",
group.emojis().filter(|emoji|is_supported(emoji.unicode_version())).map(|emoji| {
rsx!(
div {
aria_label: emoji.as_str(),
class: "emoji",
onclick: move |_| select_emoji_to_send(cx.scope, state, emoji.to_string(), ch),
emoji.as_str()
}
)
})
}
)
}))
}
nav
},
script { focus_script },
))
}
nav
},
script { focus_script },
))
}

// this avoid a BorrowMut error. needs an argument to make the curly braces syntax work
Expand Down
7 changes: 4 additions & 3 deletions ui/src/layouts/chats/presentation/chat/controls.rs
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
use dioxus::prelude::*;
use futures::{channel::oneshot, StreamExt};
use kit::{
components::invisible_closer::InvisibleCloser,
elements::{
button::Button,
tooltip::{ArrowPosition, Tooltip},
Expand Down Expand Up @@ -264,9 +265,9 @@ pub fn get_controls(cx: Scope<ChatProps>) -> Element {
}
},
show_more.then(|| {
rsx!(div {
class: "minimal-chat-button-group-out",
onclick: move |_|{
rsx!(InvisibleCloser {
classes: "minimal-chat-button-group-out".into(),
onclose: move |_|{
show_more.set(false);
},
}
Expand Down
5 changes: 0 additions & 5 deletions ui/src/layouts/chats/presentation/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -75,11 +75,6 @@
}

.minimal-chat-button-group-out {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 98,
}

Expand Down

0 comments on commit 581f235

Please sign in to comment.