Skip to content

Commit

Permalink
ux update
Browse files Browse the repository at this point in the history
  • Loading branch information
@XiangpengHao
XiangpengHao committed Dec 27, 2024
1 parent 0d4eeae commit b842ffd
Show file tree
Hide file tree
Showing 5 changed files with 146 additions and 141 deletions.
3 changes: 3 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,9 @@
}
</script>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/sql.min.js"></script>
<!-- Cloudflare Web Analytics -->
<script defer src='https://static.cloudflareinsights.com/beacon.min.js'
data-cf-beacon='{"token": "cdf9b270eac24614a52f26d4b465b8ae"}'></script><!-- End Cloudflare Web Analytics -->
Expand Down
30 changes: 11 additions & 19 deletions src/file_reader.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ async fn update_file(
parquet_table_setter: WriteSignal<Option<ParquetTable>>,
) {
let object_store = &*INMEMORY_STORE;
let path = Path::parse(format!("{}.parquet", parquet_table.table_name)).unwrap();
let path = Path::parse(format!("{}", parquet_table.table_name)).unwrap();
let payload = PutPayload::from_bytes(parquet_table.bytes.clone());
object_store.put(&path, payload).await.unwrap();
parquet_table_setter.set(Some(parquet_table));
Expand Down Expand Up @@ -155,11 +155,7 @@ pub fn FileReader(
let file_reader = web_sys::FileReader::new().unwrap();
let file_reader_clone = file_reader.clone();

let table_name = file
.name()
.strip_suffix(".parquet")
.unwrap_or(&file.name())
.to_string();
let table_name = file.name();

let onload = Closure::wrap(Box::new(move |_: web_sys::Event| {
let table_name = table_name.clone();
Expand Down Expand Up @@ -196,8 +192,6 @@ pub fn FileReader(
.split('/')
.last()
.unwrap_or("uploaded.parquet")
.strip_suffix(".parquet")
.unwrap_or("uploaded")
.to_string();

leptos::task::spawn_local(async move {
Expand Down Expand Up @@ -243,8 +237,6 @@ pub fn FileReader(
.split('/')
.last()
.unwrap_or("uploaded.parquet")
.strip_suffix(".parquet")
.unwrap_or("uploaded")
.to_string();

leptos::task::spawn_local(async move {
Expand Down Expand Up @@ -315,7 +307,7 @@ pub fn FileReader(
let base = "py-2 px-1 border-b-2 font-medium text-sm";
if let Some(active_t) = active_tab.get() {
if active_t == "file" {
return format!("{} border-blue-500 text-blue-600", base);
return format!("{} border-green-500 text-green-600", base);
}
}
format!(
Expand All @@ -332,7 +324,7 @@ pub fn FileReader(
let base = "py-2 px-1 border-b-2 font-medium text-sm";
if let Some(active_t) = active_tab.get() {
if active_t == "url" {
return format!("{} border-blue-500 text-blue-600", base);
return format!("{} border-green-500 text-green-600", base);
}
}
format!(
Expand All @@ -349,7 +341,7 @@ pub fn FileReader(
let base = "py-2 px-1 border-b-2 font-medium text-sm";
if let Some(active_t) = active_tab.get() {
if active_t == "s3" {
return format!("{} border-blue-500 text-blue-600", base);
return format!("{} border-green-500 text-green-600", base);
}
}
format!(
Expand Down Expand Up @@ -420,11 +412,11 @@ pub fn FileReader(
set_url.set(event_target_value(&ev));
}
prop:value=url
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
<button
type="submit"
class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
class="px-4 py-2 bg-green-500 text-white rounded-md hover:bg-green-600"
>
"Load from URL"
</button>
Expand Down Expand Up @@ -454,7 +446,7 @@ pub fn FileReader(
type="text"
on:input=on_s3_bucket_change
prop:value=s3_bucket
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
</div>
<div class="flex-1 min-w-[250px]">
Expand All @@ -465,7 +457,7 @@ pub fn FileReader(
type="text"
on:input=on_s3_region_change
prop:value=s3_region
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
</div>
<div class="flex-1 min-w-[250px]">
Expand All @@ -476,13 +468,13 @@ pub fn FileReader(
type="text"
on:input=on_s3_file_path_change
prop:value=s3_file_path
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
</div>
<div class="flex-1 min-w-[150px] max-w-[250px] self-end">
<button
type="submit"
class="w-full px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
class="w-full px-4 py-2 bg-green-500 text-white rounded-md hover:bg-green-600"
>
"Read from S3"
</button>
Expand Down
13 changes: 7 additions & 6 deletions src/main.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -225,6 +225,8 @@ fn App() -> impl IntoView {
.and_then(|table| ParquetReader::new(table).ok())
});

let (force_update_user_input, set_force_update_user_input) = signal(false);

Effect::watch(
parquet_reader,
move |reader, old_reader, _| {
Expand All @@ -240,9 +242,8 @@ fn App() -> impl IntoView {
}
None => match user_input.get() {
Some(user_input) => {
// force update
let new_input = format!("{} ", user_input);
set_user_input.set(Some(new_input));
set_user_input.set(Some(user_input));
set_force_update_user_input.set(true);
}
None => {
logging::log!("{}", reader.info().to_string());
Expand All @@ -257,9 +258,9 @@ fn App() -> impl IntoView {
);

Effect::watch(
user_input,
move |user_input, _, _| {
let Some(user_input_str) = user_input else {
move || (force_update_user_input.get(), user_input.get()),
move |(_, user_input_str), _, _| {
let Some(user_input_str) = user_input_str else {
return;
};

Expand Down
4 changes: 2 additions & 2 deletions src/query_input.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ pub(crate) async fn execute_query_inner(
ctx.register_object_store(object_store_url.as_ref(), object_store);
ctx.register_parquet(
table_name,
&format!("mem:///{}.parquet", table_name),
&format!("mem:///{}", table_name),
ParquetReadOptions::default(),
)
.await?;
Expand Down Expand Up @@ -101,7 +101,7 @@ pub fn QueryInput(
on:input=move |ev| set_input_value(Some(event_target_value(&ev)))
prop:value=input_value
on:keydown=key_down
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
<div class="flex items-center gap-1">
<button
Expand Down
Loading

0 comments on commit b842ffd

Please sign in to comment.