From 6fa22957aa273fed263888b9610c31c1488ecc2a Mon Sep 17 00:00:00 2001 From: harsh-mn-yral Date: Mon, 9 Dec 2024 15:41:34 +0530 Subject: [PATCH 1/6] icons --- ssr/src/component/icons/airdrop_icon.rs | 46 +++++++++++++++++ .../component/icons/arrow_left_right_icon.rs | 33 ++++++++++++ ssr/src/component/icons/chevron_right_icon.rs | 20 ++++++++ ssr/src/component/icons/mod.rs | 6 +++ ssr/src/component/icons/notification_icon.rs | 51 +++++++++++++++++++ ssr/src/component/icons/send_icon.rs | 36 +++++++++++++ ssr/src/component/icons/share_icon.rs | 46 +++++++++++++++++ ssr/src/component/mod.rs | 1 + 8 files changed, 239 insertions(+) create mode 100755 ssr/src/component/icons/airdrop_icon.rs create mode 100755 ssr/src/component/icons/arrow_left_right_icon.rs create mode 100755 ssr/src/component/icons/chevron_right_icon.rs create mode 100755 ssr/src/component/icons/mod.rs create mode 100755 ssr/src/component/icons/notification_icon.rs create mode 100755 ssr/src/component/icons/send_icon.rs create mode 100755 ssr/src/component/icons/share_icon.rs diff --git a/ssr/src/component/icons/airdrop_icon.rs b/ssr/src/component/icons/airdrop_icon.rs new file mode 100755 index 00000000..2512702b --- /dev/null +++ b/ssr/src/component/icons/airdrop_icon.rs @@ -0,0 +1,46 @@ +use leptos::*; + +#[component] +pub fn AirdropIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, +) -> impl IntoView { + view! { + + + + + + + + + + + + + + } +} diff --git a/ssr/src/component/icons/arrow_left_right_icon.rs b/ssr/src/component/icons/arrow_left_right_icon.rs new file mode 100755 index 00000000..afdc932e --- /dev/null +++ b/ssr/src/component/icons/arrow_left_right_icon.rs @@ -0,0 +1,33 @@ +use leptos::*; + +#[component] +pub fn ArrowLeftRightIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, +) -> impl IntoView { + view! { + + + + + + + + + } +} diff --git a/ssr/src/component/icons/chevron_right_icon.rs b/ssr/src/component/icons/chevron_right_icon.rs new file mode 100755 index 00000000..e045dc76 --- /dev/null +++ b/ssr/src/component/icons/chevron_right_icon.rs @@ -0,0 +1,20 @@ +use leptos::*; + +#[component] +pub fn ChevronRightIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, +) -> impl IntoView { + view! { + + + + } +} diff --git a/ssr/src/component/icons/mod.rs b/ssr/src/component/icons/mod.rs new file mode 100755 index 00000000..5f11de21 --- /dev/null +++ b/ssr/src/component/icons/mod.rs @@ -0,0 +1,6 @@ +pub mod airdrop_icon; +pub mod arrow_left_right_icon; +pub mod chevron_right_icon; +pub mod notification_icon; +pub mod send_icon; +pub mod share_icon; diff --git a/ssr/src/component/icons/notification_icon.rs b/ssr/src/component/icons/notification_icon.rs new file mode 100755 index 00000000..4138d670 --- /dev/null +++ b/ssr/src/component/icons/notification_icon.rs @@ -0,0 +1,51 @@ +use leptos::*; + +#[component] +pub fn NotificationIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, + #[prop(optional)] show_dot: bool, +) -> impl IntoView { + if show_dot { + view! { + + + + + } + } else { + view! { + + + + } + } +} diff --git a/ssr/src/component/icons/send_icon.rs b/ssr/src/component/icons/send_icon.rs new file mode 100755 index 00000000..fbed9d7c --- /dev/null +++ b/ssr/src/component/icons/send_icon.rs @@ -0,0 +1,36 @@ +use leptos::*; + +#[component] +pub fn SendIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, + #[prop(optional)] filled: bool, +) -> impl IntoView { + view! { + + + + + + + + + } +} diff --git a/ssr/src/component/icons/share_icon.rs b/ssr/src/component/icons/share_icon.rs new file mode 100755 index 00000000..fda5a53e --- /dev/null +++ b/ssr/src/component/icons/share_icon.rs @@ -0,0 +1,46 @@ +use leptos::*; + +#[component] +pub fn ShareIcon( + #[prop(optional, default = "w-full h-full".to_string())] classes: String, +) -> impl IntoView { + view! { + + + + + + + + + + + + + + } +} diff --git a/ssr/src/component/mod.rs b/ssr/src/component/mod.rs index 38bd66c1..7a01bd23 100644 --- a/ssr/src/component/mod.rs +++ b/ssr/src/component/mod.rs @@ -11,6 +11,7 @@ pub mod dashbox; pub mod feed_popup; pub mod hn_icons; pub mod ic_symbol; +pub mod icons; pub mod infinite_scroller; pub mod loading; pub mod login_modal; From 8dd528f651a0326951a4657aaafd06eb9ab1a05e Mon Sep 17 00:00:00 2001 From: harsh-mn-yral Date: Mon, 9 Dec 2024 15:41:42 +0530 Subject: [PATCH 2/6] update wallet page --- ssr/src/page/wallet/mod.rs | 150 ++++++++++++++++------------------ ssr/src/page/wallet/tokens.rs | 77 ++++++++++++++--- 2 files changed, 136 insertions(+), 91 deletions(-) diff --git a/ssr/src/page/wallet/mod.rs b/ssr/src/page/wallet/mod.rs index c1a4c02f..a54e86cd 100644 --- a/ssr/src/page/wallet/mod.rs +++ b/ssr/src/page/wallet/mod.rs @@ -1,6 +1,8 @@ pub mod tokens; pub mod transactions; pub mod txn; + +use crate::component::icons::notification_icon::NotificationIcon; use crate::{ component::share_popup::ShareButtonWithFallbackPopup, state::canisters::unauth_canisters, }; @@ -19,7 +21,7 @@ use crate::{ }; #[component] -fn ProfileGreeter(details: ProfileDetails, is_own_account: bool) -> impl IntoView { +fn ProfileGreeter(details: ProfileDetails, _is_own_account: bool) -> impl IntoView { // let (is_connected, _) = account_connected_reader(); let share_link = { let principal = details.principal(); @@ -31,22 +33,23 @@ fn ProfileGreeter(details: ProfileDetails, is_own_account: bool) -> impl IntoVie ); view! { -
- {is_own_account - .then(|| { - view! { Welcome! } - })}
- - // TEMP: Workaround for hydration bug until leptos 0.7 +
+
+ Profile picture + + // TEMP: Workaround for hydration bug until leptos 0.7 // class=("md:w-5/12", move || !is_connected()) {details.display_name_or_fallback()} -
-
-
- + + +
} } @@ -163,85 +166,70 @@ pub fn WalletImpl(principal: Principal) -> impl IntoView { }, ); view! { -
-
-
- - {move || { - let profile_details = try_or_redirect_opt!(profile_info_res()?); - let is_own_account = try_or_redirect_opt!(is_own_account()?); - Some( - view! { }, - ) - }} - -
-
- - {move || { - let is_own_account = try_or_redirect_opt!(is_own_account() ?); - let balance = try_or_redirect_opt!(balance_fetch() ?); - Some( - view! { - - {if is_own_account { - "Your Coyns Balance" - } else { - "Coyns Balance" - }} - -
{balance}
- }, - ) - }} - -
+
+ + + {move || { + let profile_details = try_or_redirect_opt!(profile_info_res()?); + let is_own_account = try_or_redirect_opt!(is_own_account()?); + Some( + view! { }, + ) + }} + + +
{move || { let is_own_account = try_or_redirect_opt!(is_own_account() ?); + let balance = try_or_redirect_opt!(balance_fetch() ?); Some( view! { - -
-
- -
-
- + + {if is_own_account { + "Your Coyns Balance" + } else { + "Coyns Balance" + }} + +
{balance}
}, ) }} -
- - {move || { - let is_own_account = try_or_redirect_opt!(is_own_account()?); - Some( - view! { -
- - {if is_own_account { "My Tokens" } else { "Tokens" }} - +
+ + {move || { + let is_own_account = try_or_redirect_opt!(is_own_account() ?); + Some( + view! { + +
+
+
- }, - ) - }} - -
- - {move || { - let canister_id = try_or_redirect_opt!(canister_id() ?); - Some( - view! { - - }, - ) - }} - -
+
+ + }, + ) + }} + +
+
+
All tokens
+ + {move || { + let canister_id = try_or_redirect_opt!(canister_id() ?); + Some( + view! { + + }, + ) + }} +
diff --git a/ssr/src/page/wallet/tokens.rs b/ssr/src/page/wallet/tokens.rs index 41c462bd..bb83cb22 100644 --- a/ssr/src/page/wallet/tokens.rs +++ b/ssr/src/page/wallet/tokens.rs @@ -2,6 +2,10 @@ use candid::Principal; use yral_canisters_common::cursored_data::token_roots::TokenRootList; use yral_canisters_common::utils::token::{RootType, TokenMetadata}; +use crate::component::icons::{ + airdrop_icon::AirdropIcon, arrow_left_right_icon::ArrowLeftRightIcon, + chevron_right_icon::ChevronRightIcon, send_icon::SendIcon, share_icon::ShareIcon, +}; use crate::page::wallet::ShareButtonWithFallbackPopup; use crate::utils::token::icpump::IcpumpTokenInfo; use crate::{component::infinite_scroller::InfiniteScroller, state::canisters::unauth_canisters}; @@ -37,12 +41,7 @@ pub fn TokenView( {move || { info.map(|info| { - view! { - - } + view! { } }) }} @@ -93,9 +92,7 @@ pub fn TokenTile(user_principal: Principal, token_meta_data: TokenMetadata) -> i } src=info.logo_b64.clone() /> - + impl In provider fetch_count=10 children=move |token_root, _ref| { - view! { } + view! { + + } } />
} } + +#[component] +fn WalletCard( + icon_url: String, + token_name: String, + token_symbol: String, + balance: f64, +) -> impl IntoView { + view! { +
+
+
+ token_name.clone() +
{token_name}
+
+
+
{balance}
+
{token_symbol}
+
+
+
+ + + + + + + + + + + + + + + +
+
+ } +} + +#[component] +fn ActionButton(children: Children, href: String, label: String) -> impl IntoView { + view! { + +
{children()}
+
{label}
+ + } +} From 23c005955cf77719369ad770d48465bd58590561 Mon Sep 17 00:00:00 2001 From: joel-medicala-yral Date: Tue, 17 Dec 2024 13:42:33 +0530 Subject: [PATCH 3/6] merged --- ssr/src/component/icons/mod.rs | 1 + ssr/src/page/wallet/tokens.rs | 10 +++++----- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/ssr/src/component/icons/mod.rs b/ssr/src/component/icons/mod.rs index 6346b2ec..90ee3f1b 100755 --- a/ssr/src/component/icons/mod.rs +++ b/ssr/src/component/icons/mod.rs @@ -4,3 +4,4 @@ pub mod chevron_right_icon; pub mod eye_hide_icon; pub mod send_icon; pub mod share_icon; +pub mod notification_icon; \ No newline at end of file diff --git a/ssr/src/page/wallet/tokens.rs b/ssr/src/page/wallet/tokens.rs index bb83cb22..abc0f82e 100644 --- a/ssr/src/page/wallet/tokens.rs +++ b/ssr/src/page/wallet/tokens.rs @@ -180,19 +180,19 @@ fn WalletCard(
- + - + - + - + - +
From 6f169973677fa1fe3e8b40a66750652925ff00d6 Mon Sep 17 00:00:00 2001 From: joel-medicala-yral Date: Tue, 17 Dec 2024 17:06:06 +0530 Subject: [PATCH 4/6] added everything --- ssr/src/component/icons/notification_icon.rs | 4 +- ssr/src/component/share_popup.rs | 2 +- ssr/src/page/icpump/mod.rs | 26 +++- ssr/src/page/profile/tokens.rs | 4 +- ssr/src/page/wallet/mod.rs | 56 ++------ ssr/src/page/wallet/tokens.rs | 136 ++++++------------- 6 files changed, 82 insertions(+), 146 deletions(-) diff --git a/ssr/src/component/icons/notification_icon.rs b/ssr/src/component/icons/notification_icon.rs index 4138d670..bed1345c 100755 --- a/ssr/src/component/icons/notification_icon.rs +++ b/ssr/src/component/icons/notification_icon.rs @@ -8,7 +8,7 @@ pub fn NotificationIcon( if show_dot { view! { , diff --git a/ssr/src/page/icpump/mod.rs b/ssr/src/page/icpump/mod.rs index 2eb43d0a..edc5450a 100644 --- a/ssr/src/page/icpump/mod.rs +++ b/ssr/src/page/icpump/mod.rs @@ -12,8 +12,10 @@ use crate::component::icons::chevron_right_icon::ChevronRightIcon; use crate::component::icons::eye_hide_icon::EyeHiddenIcon; use crate::component::icons::send_icon::SendIcon; use crate::component::icons::share_icon::ShareIcon; +use crate::component::share_popup::ShareContent; use crate::component::spinner::FullScreenSpinner; use crate::consts::ICPUMP_LISTING_PAGE_SIZE; +use crate::utils::host::get_host; use crate::utils::token::firestore::init_firebase; use crate::utils::token::firestore::listen_to_documents; use crate::utils::token::icpump::get_paginated_token_list; @@ -146,6 +148,17 @@ pub fn TokenCard( .expect("URL should have at least one segment") .to_string(); + let popup = create_rw_signal(false); + let base_url = get_host(); + + let share_link_s = store_value(format!("{}/{}", details.link, details.user_id)); + let share_message = format!( + "Hey! Check out the token: {} I created on YRAL 👇 {}. I just minted my own token—come see and create yours! 🚀 #YRAL #TokenMinter", + details.token_symbol, + share_link_s(), + ); + let share_message_s = store_value(share_message); + view! {
- - + +
+ + +
} } - +use crate::component::overlay::PopupOverlay; #[component] pub fn PageSelector(page: RwSignal, end_of_list: RwSignal) -> impl IntoView { view! { diff --git a/ssr/src/page/profile/tokens.rs b/ssr/src/page/profile/tokens.rs index c05a0b1b..ef59b929 100644 --- a/ssr/src/page/profile/tokens.rs +++ b/ssr/src/page/profile/tokens.rs @@ -5,7 +5,7 @@ use yral_canisters_client::individual_user_template::DeployedCdaoCanisters; use crate::{ component::{bullet_loader::BulletLoader, token_confetti_symbol::TokenConfettiSymbol}, - page::wallet::tokens::TokenTile, + page::wallet::tokens::WalletCard, state::canisters::{authenticated_canisters, unauth_canisters}, utils::token::icpump::IcpumpTokenInfo, }; @@ -84,7 +84,7 @@ pub fn ProfileTokens(user_canister: Principal, user_principal: Principal) -> imp .into_iter() .map(|token| { view! { - diff --git a/ssr/src/page/wallet/mod.rs b/ssr/src/page/wallet/mod.rs index a54e86cd..9850ce1b 100644 --- a/ssr/src/page/wallet/mod.rs +++ b/ssr/src/page/wallet/mod.rs @@ -21,7 +21,7 @@ use crate::{ }; #[component] -fn ProfileGreeter(details: ProfileDetails, _is_own_account: bool) -> impl IntoView { +fn ProfileGreeter(details: ProfileDetails, is_own_account: bool) -> impl IntoView { // let (is_connected, _) = account_connected_reader(); let share_link = { let principal = details.principal(); @@ -47,9 +47,12 @@ fn ProfileGreeter(details: ProfileDetails, _is_own_account: bool) -> impl IntoVi
- - - + + + + + +
} } @@ -108,22 +111,6 @@ pub fn WalletImpl(principal: Principal) -> impl IntoView { let (is_connected, _) = account_connected_reader(); let auth_cans = authenticated_canisters(); - let balance_fetch = create_resource( - move || principal, - move |principal| async move { - let canisters = unauth_canisters(); - let Some(user_canister) = canisters - .get_individual_canister_by_user_principal(principal) - .await? - else { - return Err(ServerFnError::new("Failed to get user canister")); - }; - let user = canisters.individual_user(user_canister).await; - - let bal = user.get_utility_token_balance().await?; - Ok::<_, ServerFnError>(bal.to_string()) - }, - ); let profile_info_res = auth_cans.derive( move || principal, @@ -173,31 +160,10 @@ pub fn WalletImpl(principal: Principal) -> impl IntoView { let profile_details = try_or_redirect_opt!(profile_info_res()?); let is_own_account = try_or_redirect_opt!(is_own_account()?); Some( - view! { }, - ) - }} - - -
- - {move || { - let is_own_account = try_or_redirect_opt!(is_own_account() ?); - let balance = try_or_redirect_opt!(balance_fetch() ?); - Some( - view! { - - {if is_own_account { - "Your Coyns Balance" - } else { - "Coyns Balance" - }} - -
{balance}
- }, + view! { }, ) }} -
{move || { let is_own_account = try_or_redirect_opt!(is_own_account() ?); @@ -217,9 +183,9 @@ pub fn WalletImpl(principal: Principal) -> impl IntoView { ) }} -
-
-
All tokens
+
+
+
All Tokens
{move || { let canister_id = try_or_redirect_opt!(canister_id() ?); diff --git a/ssr/src/page/wallet/tokens.rs b/ssr/src/page/wallet/tokens.rs index abc0f82e..86814e9b 100644 --- a/ssr/src/page/wallet/tokens.rs +++ b/ssr/src/page/wallet/tokens.rs @@ -6,9 +6,13 @@ use crate::component::icons::{ airdrop_icon::AirdropIcon, arrow_left_right_icon::ArrowLeftRightIcon, chevron_right_icon::ChevronRightIcon, send_icon::SendIcon, share_icon::ShareIcon, }; -use crate::page::wallet::ShareButtonWithFallbackPopup; +use crate::component::overlay::PopupOverlay; +use crate::component::share_popup::ShareContent; +use crate::page::icpump::ActionButton; +use crate::utils::host::get_host; use crate::utils::token::icpump::IcpumpTokenInfo; use crate::{component::infinite_scroller::InfiniteScroller, state::canisters::unauth_canisters}; + use leptos::*; use leptos_icons::*; @@ -41,7 +45,7 @@ pub fn TokenView( {move || { info.map(|info| { - view! { } + view! { } }) }} @@ -62,71 +66,9 @@ fn generate_share_link_from_metadata( ) } -#[component] -pub fn TokenTile(user_principal: Principal, token_meta_data: TokenMetadata) -> impl IntoView { - let share_link = generate_share_link_from_metadata(&token_meta_data, user_principal); - let share_link_s = store_value(share_link); - let share_message = format!( - "Hey! Check out the token: {} I created on YRAL 👇 {}. I just minted my own token—come see and create yours! 🚀 #YRAL #TokenMinter", - token_meta_data.symbol, - share_link_s(), - ); - let share_message_s = store_value(share_message); - let info = token_meta_data; - view! { -
- -
-
- - - - -
- {info.name.clone()} -
-
- - // remove the unwrap if global token listing but its a list of token so it can safely be unwrapped - {info.balance.unwrap().humanize_float_truncate_to_dp(2)} - - - {info.symbol.clone()} - -
- - -
- -
- -
- } -} - #[component] pub fn TokenList(user_principal: Principal, user_canister: Principal) -> impl IntoView { - let canisters = unauth_canisters(); + let canisters: yral_canisters_common::Canisters = unauth_canisters(); let provider = TokenRootList { canisters, @@ -156,55 +98,63 @@ pub fn TokenList(user_principal: Principal, user_canister: Principal) -> impl In } #[component] -fn WalletCard( - icon_url: String, - token_name: String, - token_symbol: String, - balance: f64, -) -> impl IntoView { +pub fn WalletCard(user_principal: Principal, token_meta_data: TokenMetadata) -> impl IntoView { + let root: String = token_meta_data + .root + .map(|r| r.to_text()) + .unwrap_or(token_meta_data.name.to_lowercase()); + + let share_link = generate_share_link_from_metadata(&token_meta_data, user_principal); + let share_link_s = store_value(share_link); + let share_message = format!( + "Hey! Check out the token: {} I created on YRAL 👇 {}. I just minted my own token—come see and create yours! 🚀 #YRAL #TokenMinter", + token_meta_data.symbol, + share_link_s(), + ); + let share_message_s = store_value(share_message); + let pop_up = create_rw_signal(false); + let base_url = get_host(); view! { -
-
+
+
token_name.clone() -
{token_name}
+
{token_meta_data.name}
-
{balance}
-
{token_symbol}
+
{token_meta_data.balance.unwrap().humanize_float_truncate_to_dp(2)}
+
{token_meta_data.symbol}
- + - + - + - + - +
-
- } -} -#[component] -fn ActionButton(children: Children, href: String, label: String) -> impl IntoView { - view! { - -
{children()}
-
{label}
- + + + +
} } From f143c1384806b61d61772c22bb1bd06664192646 Mon Sep 17 00:00:00 2001 From: joel-medicala-yral Date: Tue, 17 Dec 2024 17:21:17 +0530 Subject: [PATCH 5/6] fixed send route --- ssr/src/page/wallet/tokens.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ssr/src/page/wallet/tokens.rs b/ssr/src/page/wallet/tokens.rs index 86814e9b..1b66fe7f 100644 --- a/ssr/src/page/wallet/tokens.rs +++ b/ssr/src/page/wallet/tokens.rs @@ -131,7 +131,7 @@ pub fn WalletCard(user_principal: Principal, token_meta_data: TokenMetadata) ->
- + From 182afe712891e7561289865bdba4981f3181b582 Mon Sep 17 00:00:00 2001 From: joel-medicala-yral Date: Tue, 17 Dec 2024 17:33:27 +0530 Subject: [PATCH 6/6] added inner styling to components --- ssr/src/page/wallet/tokens.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ssr/src/page/wallet/tokens.rs b/ssr/src/page/wallet/tokens.rs index 1b66fe7f..0866af95 100644 --- a/ssr/src/page/wallet/tokens.rs +++ b/ssr/src/page/wallet/tokens.rs @@ -116,7 +116,7 @@ pub fn WalletCard(user_principal: Principal, token_meta_data: TokenMetadata) -> let base_url = get_host(); view! {
-
+